Skip to content

Commit f7c3116

Browse files
ethansharethanshar
committed
Merge branch 'master' into release
2 parents bda35fb + ba6f7eb commit f7c3116

File tree

120 files changed

+6132
-386
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

120 files changed

+6132
-386
lines changed

‎android/app/src/main/java/com/rnuilib/MainApplication.java‎

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,19 @@
11
package com.rnuilib;
22

3-
import android.app.Application;
4-
import android.content.Context;
5-
63
import com.facebook.react.PackageList;
74
import com.facebook.react.ReactNativeHost;
85
import com.facebook.react.ReactPackage;
9-
10-
import java.util.List;
11-
import java.util.Arrays;
12-
136
import com.reactnativenavigation.NavigationApplication;
147
import com.reactnativenavigation.react.NavigationReactNativeHost;
158
import com.reactnativenavigation.react.ReactGateway;
16-
179
import com.wix.reactnativeuilib.highlighterview.HighlighterViewPackage;
10+
import com.wix.reactnativeuilib.keyboardinput.KeyboardInputPackage;
1811
import com.wix.reactnativeuilib.textinput.TextInputDelKeyHandlerPackage;
1912
import com.wix.reactnativeuilib.wheelpicker.WheelPickerPackage;
2013

14+
import java.util.Arrays;
15+
import java.util.List;
16+
2117

2218
public class MainApplication extends NavigationApplication {
2319

@@ -52,6 +48,7 @@ public List<ReactPackage> createAdditionalReactPackages() {
5248
packages.add(new HighlighterViewPackage());
5349
packages.add(new WheelPickerPackage());
5450
packages.add(new TextInputDelKeyHandlerPackage());
51+
packages.add(new KeyboardInputPackage(this));
5552
return packages;
5653
}
5754
}

‎demo/src/index.js‎

Lines changed: 198 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,5 +5,202 @@ I18nManager.allowRTL(true);
55

66
module.exports = {
77
name: 'unicorn demo app',
8-
ExampleScreenPresenter: require('./screens/ExampleScreenPresenter')
8+
// componentScreens
9+
get ActionSheetScreen() {
10+
return require('./screens/componentScreens/ActionSheetScreen').default;
11+
},
12+
get ActionBarScreen() {
13+
return require('./screens/componentScreens/ActionBarScreen').default;
14+
},
15+
get AvatarsScreen() {
16+
return require('./screens/componentScreens/AvatarsScreen').default;
17+
},
18+
get AnimatedImageScreen() {
19+
return require('./screens/componentScreens/AnimatedImageScreen').default;
20+
},
21+
get ButtonsScreen() {
22+
return require('./screens/componentScreens/ButtonsScreen').default;
23+
},
24+
get BadgesScreen() {
25+
return require('./screens/componentScreens/BadgesScreen').default;
26+
},
27+
get CardsScreen() {
28+
return require('./screens/componentScreens/CardsScreen').default;
29+
},
30+
get CarouselScreen() {
31+
return require('./screens/componentScreens/CarouselScreen').default;
32+
},
33+
get CheckboxScreen() {
34+
return require('./screens/componentScreens/CheckboxScreen').default;
35+
},
36+
get ConnectionStatusBarScreen() {
37+
return require('./screens/componentScreens/ConnectionStatusBarScreen').default;
38+
},
39+
get DialogScreen() {
40+
return require('./screens/componentScreens/DialogScreen').default;
41+
},
42+
get DrawerScreen() {
43+
return require('./screens/componentScreens/DrawerScreen').default;
44+
},
45+
get TagsInputScreen() {
46+
return require('./screens/componentScreens/TagsInputScreen').default;
47+
},
48+
get HintsScreen() {
49+
return require('./screens/componentScreens/HintsScreen').default;
50+
},
51+
get ImageScreen() {
52+
return require('./screens/componentScreens/ImageScreen').default;
53+
},
54+
get MaskedInputScreen() {
55+
return require('./screens/componentScreens/MaskedInputScreen').default;
56+
},
57+
get OverlaysScreen() {
58+
return require('./screens/componentScreens/OverlaysScreen').default;
59+
},
60+
get PageControlScreen() {
61+
return require('./screens/componentScreens/PageControlScreen').default;
62+
},
63+
get PanDismissibleScreen() {
64+
return require('./screens/componentScreens/PanDismissibleScreen').default;
65+
},
66+
get PanListenerScreen() {
67+
return require('./screens/componentScreens/PanListenerScreen').default;
68+
},
69+
get PanResponderScreen() {
70+
return require('./screens/componentScreens/PanResponderScreen').default;
71+
},
72+
get PickerScreen() {
73+
return require('./screens/componentScreens/PickerScreen').default;
74+
},
75+
get RadioButtonScreen() {
76+
return require('./screens/componentScreens/RadioButtonScreen').default;
77+
},
78+
get SharedTransitionScreen() {
79+
return require('./screens/componentScreens/SharedTransitionScreen').default;
80+
},
81+
get StepperScreen() {
82+
return require('./screens/componentScreens/StepperScreen').default;
83+
},
84+
get SwitchScreen() {
85+
return require('./screens/componentScreens/SwitchScreen').default;
86+
},
87+
get ToastsScreen() {
88+
return require('./screens/componentScreens/ToastsScreen').default;
89+
},
90+
get TabBarScreen() {
91+
return require('./screens/componentScreens/TabBarScreen').default;
92+
},
93+
get TextScreen() {
94+
return require('./screens/componentScreens/TextScreen').default;
95+
},
96+
get TextFieldScreen() {
97+
return require('./screens/componentScreens/TextFieldScreen').default;
98+
},
99+
get TourScreen() {
100+
return require('./screens/componentScreens/TourScreen').default;
101+
},
102+
get FeatureHighlightScreen() {
103+
return require('./screens/componentScreens/FeatureHighlightScreen').default;
104+
},
105+
get WheelPickerDialogScreen() {
106+
return require('./screens/componentScreens/WheelPickerDialogScreen').default;
107+
},
108+
get SliderScreen() {
109+
return require('./screens/componentScreens/SliderScreen').default;
110+
},
111+
get FloatingButtonScreen() {
112+
return require('./screens/componentScreens/FloatingButtonScreen').default;
113+
},
114+
get ColorPickerScreen() {
115+
return require('./screens/componentScreens/ColorPickerScreen').default;
116+
},
117+
get ColorSwatchScreen() {
118+
return require('./screens/componentScreens/ColorSwatchScreen').default;
119+
},
120+
get StackAggregatorScreen() {
121+
return require('./screens/componentScreens/StackAggregatorScreen').default;
122+
},
123+
get DateTimePickerScreen() {
124+
return require('./screens/componentScreens/DateTimePickerScreen').default;
125+
},
126+
get WizardScreen() {
127+
return require('./screens/componentScreens/WizardScreen').default;
128+
},
129+
// nativeComponentScreens
130+
get HighlightOverlayViewScreen() {
131+
return require('./screens/nativeComponentScreens/HighlightOverlayViewScreen').default;
132+
},
133+
get SafeAreaSpacerViewScreen() {
134+
return require('./screens/nativeComponentScreens/SafeAreaSpacerViewScreen').default;
135+
},
136+
get WheelPickerViewScreen() {
137+
return require('./screens/nativeComponentScreens/WheelPickerViewScreen').default;
138+
},
139+
// componentScreenScreens
140+
get EmptyStateScreen() {
141+
return require('./screens/componentScreenScreens/EmptyStateScreen').default;
142+
},
143+
get LoadingScreen() {
144+
return require('./screens/componentScreenScreens/LoadingScreen').default;
145+
},
146+
get ModalScreen() {
147+
return require('./screens/componentScreenScreens/ModalScreen').default;
148+
},
149+
// listScreens
150+
get BasicListScreen() {
151+
return require('./screens/listScreens/BasicListScreen').default;
152+
},
153+
get ContactsListScreen() {
154+
return require('./screens/listScreens/ContactsListScreen').default;
155+
},
156+
get ConversationListScreen() {
157+
return require('./screens/listScreens/ConversationListScreen').default;
158+
},
159+
// styleScreens
160+
get BorderRadiusesScreen() {
161+
return require('./screens/styleScreens/BorderRadiusesScreen').default;
162+
},
163+
get ColorsScreen() {
164+
return require('./screens/styleScreens/ColorsScreen').default;
165+
},
166+
get TypographyScreen() {
167+
return require('./screens/styleScreens/TypographyScreen').default;
168+
},
169+
get ShadowsScreen() {
170+
return require('./screens/styleScreens/ShadowsScreen').default;
171+
},
172+
get SpacingsScreen() {
173+
return require('./screens/styleScreens/SpacingsScreen').default;
174+
},
175+
// animationScreens
176+
get CardScannerScreen() {
177+
return require('./screens/animationScreens/CardScannerScreen').default;
178+
},
179+
get CardAnimationsScreen() {
180+
return require('./screens/animationScreens/CardAnimationsScreen').default;
181+
},
182+
get ListAnimationsScreen() {
183+
return require('./screens/animationScreens/ListAnimationsScreen').default;
184+
},
185+
get ProgressBarScreen() {
186+
return require('./screens/animationScreens/ProgressBarScreen').default;
187+
},
188+
// realExamples
189+
get AppleMusic() {
190+
return require('./screens/realExamples/AppleMusic').default;
191+
},
192+
get Pinterest() {
193+
return require('./screens/realExamples/Pinterest').default;
194+
},
195+
get ListActionsScreen() {
196+
return require('./screens/realExamples/ListActions/ListActionsScreen').default;
197+
},
198+
// wrapperScreens
199+
get TouchableOpacityScreen() {
200+
return require('./screens/wrapperScreens/TouchableOpacityScreen').default;
201+
},
202+
// General
203+
get ExampleScreenPresenter() {
204+
return require('./screens/ExampleScreenPresenter');
205+
}
9206
};

‎demo/src/screens/ExampleScreenPresenter.js‎

Lines changed: 69 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,81 @@
1-
import React from 'react';
2-
import {View, Text, Checkbox, RadioGroup, RadioButton, ColorPalette, Colors, Slider} from 'react-native-ui-lib';
31
import _ from 'lodash';
2+
import React from 'react';
3+
import {StyleSheet} from 'react-native';
4+
import {Checkbox, ColorPalette, Colors, RadioButton, RadioGroup, Slider, Text, View} from 'react-native-ui-lib';
45

56
export function renderBooleanOption(title, key) {
67
const value = this.state[key];
78
return (
8-
<View row centerV spread marginB-s4>
9-
<Text text70M style={{flex: 1}}>
9+
<View row centerV spread marginB-s4 key={key}>
10+
<Text text70 style={{flex: 1}}>
11+
{title}
12+
</Text>
13+
<Checkbox
14+
useCustomTheme
15+
key={key}
16+
textID={key}
17+
value={value}
18+
onValueChange={value => this.setState({[key]: value})}
19+
/>
20+
</View>
21+
);
22+
}
23+
24+
export function renderBooleanGroup(title, options) {
25+
return (
26+
<View marginB-s2>
27+
<Text text70M marginB-s2>
1028
{title}
1129
</Text>
12-
<Checkbox useCustomTheme textID={key} value={value} onValueChange={value => this.setState({[key]: value})}/>
30+
<View row style={styles.rowWrap}>
31+
{_.map(options, key => {
32+
const value = this.state[key];
33+
return (
34+
<View spread centerH row key={key}>
35+
<Checkbox
36+
marginR-s2
37+
useCustomTheme
38+
key={key}
39+
textID={key}
40+
value={value}
41+
onValueChange={value => this.setState({[key]: value})}
42+
/>
43+
<Text text70 marginR-s3 marginB-s2>
44+
{key}
45+
</Text>
46+
</View>
47+
);
48+
})}
49+
</View>
1350
</View>
1451
);
1552
}
1653

17-
export function renderRadioGroup(title, key, options) {
54+
export function renderRadioGroup(title, key, options, {isRow} = {}) {
1855
const value = this.state[key];
1956
return (
2057
<View marginB-s2>
2158
<Text text70M marginB-s2>
2259
{title}
2360
</Text>
24-
<RadioGroup initialValue={value} onValueChange={value => this.setState({[key]: value})}>
61+
<RadioGroup
62+
row={isRow}
63+
style={isRow && styles.rowWrap}
64+
initialValue={value}
65+
onValueChange={value => this.setState({[key]: value})}
66+
>
2567
{_.map(options, (value, key) => {
26-
return <RadioButton useCustomTheme testID={key} key={key} marginB-s2 label={value} value={options[key]}/>;
68+
return (
69+
<RadioButton
70+
useCustomTheme
71+
testID={key}
72+
key={key}
73+
marginB-s2
74+
marginR-s2={isRow}
75+
label={key}
76+
value={value}
77+
/>
78+
);
2779
})}
2880
</RadioGroup>
2981
</View>
@@ -46,7 +98,7 @@ export function renderColorOption(title,
4698
);
4799
}
48100

49-
export function renderSliderOption(title, key, {min = 0, max = 10, step = 1, initial = 0}) {
101+
export function renderSliderOption(title, key, {min = 0, max = 10, step = 1, initial = 0, sliderText = ''}) {
50102
const value = this.state[key];
51103
return (
52104
<View marginV-s2>
@@ -64,9 +116,16 @@ export function renderSliderOption(title, key, {min = 0, max = 10, step = 1, ini
64116
onValueChange={value => this.setState({[key]: value})}
65117
/>
66118
<Text marginL-s4 text70>
67-
text{value}
119+
{sliderText}
120+
{value}
68121
</Text>
69122
</View>
70123
</View>
71124
);
72125
}
126+
127+
const styles = StyleSheet.create({
128+
rowWrap: {
129+
flexWrap: 'wrap'
130+
}
131+
});

‎demo/src/screens/MainScreen.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -329,7 +329,7 @@ export default class MainScreen extends Component {
329329
<FlatList
330330
showsVerticalScrollIndicator={false}
331331
data={section.screens}
332-
keyExtractor={item => item.title}
332+
keyExtractor={item => item.screen ? item.title : `header_${item.title}`}
333333
renderItem={this.renderItem}
334334
/>
335335
</View>

‎demo/src/screens/MenuStructure.js‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,16 +34,19 @@ export const navigationData = {
3434
{title: 'Feature Highlight', tags: 'feature overlay', screen: 'unicorn.components.FeatureHighlightScreen'},
3535
{title: 'Hint', tags: 'hints tooltip', screen: 'unicorn.components.HintsScreen'},
3636
{title: 'Image', tags: 'image cover overlay', screen: 'unicorn.components.ImageScreen'},
37+
{title: 'KeyboardAwareScrollView', tags: 'KeyboardAwareScrollView', screen: 'unicorn.components.KeyboardAwareScrollViewScreen'},
3738
{title: 'Overlays', tags: 'overlay image', screen: 'unicorn.components.OverlaysScreen'},
3839
{title: 'Page Control', tags: 'page', screen: 'unicorn.components.PageControlScreen'},
3940
{title: 'Pan Dismissible', tags: 'pan swipe drag dismiss', screen: 'unicorn.components.PanDismissibleScreen'},
4041
{title: 'Pan Listener', tags: 'pan swipe drag listener', screen: 'unicorn.components.PanListenerScreen'},
4142
{title: 'Pan Responder', tags: 'pan swipe drag responder', screen: 'unicorn.components.PanResponderScreen'},
43+
{title: 'ScrollBar', tags: 'scroll bar gradient', screen: 'unicorn.components.ScrollBarScreen'},
4244
{title: 'Shared Transition', tags: 'shared transition element', screen: 'unicorn.components.SharedTransitionScreen'},
4345
{title: 'Stack Aggregator', tags: 'stack aggregator', screen: 'unicorn.components.StackAggregatorScreen'},
4446
{title: 'TabBar', tags: 'tab bar', screen: 'unicorn.components.TabBarScreen'},
4547
{title: 'Text', tags: 'text', screen: 'unicorn.components.TextScreen'},
4648
{title: 'Toast', tags: 'toast top bottom snackbar', screen: 'unicorn.components.ToastsScreen'},
49+
{title: 'View', tags: 'view modifiers', screen: 'unicorn.components.ViewScreen'},
4750
{title: 'Wheel Picker Dialog', tags: 'wheel picker dialog', screen: 'unicorn.components.WheelPickerDialogScreen'},
4851
{title: 'Wizard', tags: 'wizard', screen: 'unicorn.components.WizardScreen'}
4952
]
@@ -74,7 +77,9 @@ export const navigationData = {
7477
screen: 'unicorn.nativeComponents.HighlightOverlayViewScreen'
7578
},
7679
{title: 'Wheel Picker', tags: 'wheel picker', screen: 'unicorn.nativeComponents.WheelPickerViewScreen'},
77-
{title: 'SafeArea Spacer', tags: 'native safe area', screen: 'unicorn.nativeComponents.SafeAreaSpacerViewScreen'}
80+
{title: 'SafeArea Spacer', tags: 'native safe area', screen: 'unicorn.nativeComponents.SafeAreaSpacerViewScreen'},
81+
{title: 'KeyboardTracking (iOS)', tags: 'KeyboardTracking', screen: 'unicorn.nativeComponents.KeyboardTrackingViewScreen'},
82+
{title: 'KeyboardInput', tags: 'KeyboardInput', screen: 'unicorn.nativeComponents.KeyboardInputViewScreen'}
7883
]
7984
},
8085
Screens: {

0 commit comments

Comments
 (0)