unicorn-demo-app 7.9.1 → 7.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/package.json +1 -1
  2. package/src/screens/MainScreen.js +1 -1
  3. package/src/screens/componentScreens/CheckboxScreen.tsx +41 -2
  4. package/src/screens/componentScreens/ExpandableSectionScreen.tsx +2 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "unicorn-demo-app",
3
- "version": "7.9.1",
3
+ "version": "7.10.0",
4
4
  "main": "src/index.js",
5
5
  "author": "Ethan Sharabi <ethan.shar@gmail.com>",
6
6
  "license": "MIT",
package/src/screens/MainScreen.js CHANGED
@@ -117,7 +117,7 @@ class MainScreen extends Component {
117
117
  this?.sectionListRef?.current?.scrollToLocation({
118
118
  animated: true,
119
119
  sectionIndex: index,
120
- itemIndex: 0,
120
+ itemIndex: 1,
121
121
  viewPosition: 0
122
122
  });
123
123
  };
package/src/screens/componentScreens/CheckboxScreen.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  import React, {Component} from 'react';
2
2
  import {StyleSheet} from 'react-native';
3
- import {Assets, Colors, View, Text, Checkbox} from 'react-native-ui-lib'; //eslint-disable-line
3
+ import {Assets, Colors, View, Text, Button, Checkbox, CheckboxRef} from 'react-native-ui-lib'; //eslint-disable-line
4
4
 
5
5
  export default class CheckboxScreen extends Component {
6
6
  state = {
@@ -10,7 +10,28 @@ export default class CheckboxScreen extends Component {
10
10
  value4: true,
11
11
  value5: false,
12
12
  value6: false,
13
- value7: true
13
+ value7: false,
14
+ validationText: '',
15
+ validationColor: Colors.$textDefault
16
+ };
17
+
18
+ checkbox = React.createRef<CheckboxRef>();
19
+
20
+ onPress = () => {
21
+ this.checkbox.current?.validate();
22
+ };
23
+
24
+ onValueChange = (value: boolean) => {
25
+ this.setState({value7: value}, () => {
26
+ console.log('onValueChange: ', value);
27
+ });
28
+ };
29
+
30
+ onChangeValidity = (value?: boolean) => {
31
+ this.setState({
32
+ validationText: String(value),
33
+ validationColor: value === true ? Colors.$textSuccess : Colors.$textDangerLight
34
+ });
14
35
  };
15
36
 
16
37
  render() {
@@ -77,6 +98,24 @@ export default class CheckboxScreen extends Component {
77
98
  iconColor={Colors.green10}
78
99
  />
79
100
  </View>
101
+
102
+ <View marginT-20>
103
+ <Text text60 $textDefault marginB-10>
104
+ Validation
105
+ </Text>
106
+ <Text marginB-4 color={this.state.validationColor}>{this.state.validationText}</Text>
107
+ <View row centerV spread marginB-10>
108
+ <Checkbox
109
+ required
110
+ onChangeValidity={this.onChangeValidity}
111
+ ref={this.checkbox}
112
+ value={this.state.value7}
113
+ onValueChange={this.onValueChange}
114
+ label={'This is a checkbox'}
115
+ />
116
+ <Button size={'small'} label={'Validate'} onPress={this.onPress}/>
117
+ </View>
118
+ </View>
80
119
  </View>
81
120
  );
82
121
  }
package/src/screens/componentScreens/ExpandableSectionScreen.tsx CHANGED
@@ -64,7 +64,7 @@ class ExpandableSectionScreen extends PureComponent {
64
64
  return (
65
65
  <View margin-10 spread row>
66
66
  <Text grey10 text60>
67
- ExpandableSection's sectionHeader
67
+ ExpandableSection sectionHeader
68
68
  </Text>
69
69
  <Image style={styles.icon} source={this.getChevron()}/>
70
70
  </View>
@@ -73,7 +73,7 @@ class ExpandableSectionScreen extends PureComponent {
73
73
 
74
74
  getBodyElement() {
75
75
  return (
76
- <Carousel pageWidth={350} itemSpacings={Spacings.s2}>
76
+ <Carousel>
77
77
  {_.map(this.elements, (element, key) => {
78
78
  return (
79
79
  <View key={key} margin-12>