Merge branch 'master' into release

Author: ethanshar

.github/ISSUE_TEMPLATE/bug-report.md

@@ -7,28 +7,42 @@ assignees: ''
 
 ---
 
-**Describe the bug**
+### Describe the bug
+<!--
 A clear and concise description of what the bug is.
+-->
 
-**To Reproduce**
+### To Reproduce
+<!--
 Steps to reproduce the behavior:
 1. Go to '...'
 2. Click on '....'
 3. Scroll down to '....'
 4. See error
+-->
 
-**Expected behavior**
+### Expected behavior
+<!--
 A clear and concise description of what you expected to happen.
+-->
 
-**Code snippet**
+### Code snippet
+<!--
 A code snippet that reproduce the issue. 
+-->
 
-**Screenshots**
+### Screenshots
+<!--
 If applicable, add screenshots to help explain your problem.
+-->
 
-**Device (please complete the following information):**
+### Device (please complete the following information)
+<!--
  - Device: [e.g. iPhone6]
  - OS: [e.g. iOS8.1]
+-->
 
-**Additional context**
+### Additional context
+<!--
 Add any other context about the problem here.
+-->

.github/ISSUE_TEMPLATE/docs-issue.md

@@ -7,12 +7,16 @@ assignees: ''
 
 ---
 
-**Describe the bug**
+### Describe the bug
+<!--
 A clear and concise description of what the issue with the docs is.
+-->
 
-**Component?**
+### Component?
+<!--
 Are there missing docs for a component? Which component? 
+-->
 
-**Is there a general issue with the docs site?**
+### Is there a general issue with the docs site?
 
-**Is there an issue with the Expo snack app?**
+### Is there an issue with the Expo snack app?

.github/ISSUE_TEMPLATE/feature-request.md

@@ -7,10 +7,17 @@ assignees: ''
 
 ---
 
-**Which component?**
+### Which component?
+<!--
+Which component is the feature is for? 
+-->
 
-**What is the new feature?**
+### What is the new feature?
+<!--
 A clear and concise description of what the required feature
+-->
 
-**Code snippet**
+### Code snippet
+<!--
 How you would have use this feature? How the API will look like?
+-->

.github/ISSUE_TEMPLATE/question.md

@@ -7,7 +7,7 @@ assignees: ''
 
 ---
 
-## Ask us any question
+### Ask us any question
 
 <!--
 Having trouble with using RNUILIB? Curious about a feature? Wondering about are future plans? 

.github/ISSUE_TEMPLATE/typescript-issue.md

@@ -7,7 +7,12 @@ assignees: ''
 
 ---
 
-**Component**
+### Component
+<!--
 Which component has a missing or invalid typings? 
+-->
 
-**What's the issue?**
+### What's the issue?
+<!--
+Add relevant details 
+-->

demo/src/screens/MenuStructure.js

@@ -149,7 +149,8 @@ export const navigationData = {
     title: 'Incubator (Experimental)',
     screens: [
       {title: 'Native TouchableOpacity', tags: 'touchable native', screen: 'unicorn.incubator.TouchableOpacityScreen'},
-      {title: '(New) TextField', tags: 'text field input', screen: 'unicorn.components.IncubatorTextFieldScreen'}
+      {title: '(New) TextField', tags: 'text field input', screen: 'unicorn.components.IncubatorTextFieldScreen'},
+      {title: 'WheelPicker (Incubator)', tags: 'wheel picker spinner experimental', screen: 'unicorn.incubator.WheelPickerScreen'}
     ]
   },
   Inspirations: {

demo/src/screens/incubatorScreens/WheelPickerScreen.tsx

@@ -0,0 +1,49 @@
+import React, {useCallback} from 'react';
+import {View, Text, Incubator, Colors, Typography} from 'react-native-ui-lib';
+import _ from 'lodash';
+import {ItemProps} from 'src/incubator/WheelPicker/Item';
+
+// Months
+const months = [
+  'January',
+  'February',
+  'March',
+  'April',
+  'May',
+  'June',
+  'July',
+  'August',
+  'September',
+  'October',
+  'November',
+  'December'
+];
+
+// Years
+const years = _.times(2020, i => i);
+
+export default () => {
+
+  const onChange = useCallback((index: number, item?: ItemProps) => {
+    console.log(item, index);
+  }, []);
+
+  return (
+    <View flex padding-page>
+      <Text h1>Wheel Picker</Text>
+      <View flex centerV centerH paddingT-page>
+        <Text h3>Months</Text>
+        <Incubator.WheelPicker
+          onChange={onChange}
+          activeTextColor={Colors.primary}
+          inactiveTextColor={Colors.grey20}
+          items={_.map(months, i => ({text: i, value: i}))}
+          textStyle={{...Typography.text60R}}
+        />
+
+        <Text h3 marginT-s5>Years</Text>
+        <Incubator.WheelPicker onChange={onChange} items={_.map(years, i => ({text: '' + i, value: i}))} />
+      </View>
+    </View>
+  );
+};

demo/src/screens/incubatorScreens/index.js

@@ -2,5 +2,9 @@ import {gestureHandlerRootHOC} from 'react-native-gesture-handler';
 
 export function registerScreens(registrar) {
   registrar('unicorn.incubator.TouchableOpacityScreen', () =>
-    gestureHandlerRootHOC(require('./TouchableOpacityScreen').default));
+    gestureHandlerRootHOC(require('./TouchableOpacityScreen').default)
+  );
+  registrar('unicorn.incubator.WheelPickerScreen', () =>
+    gestureHandlerRootHOC(require('./WheelPickerScreen').default)
+  );
 }

eslint-rules/lib/rules/no-direct-import.js

@@ -31,10 +31,10 @@ module.exports = {
       try {
         const origin = context.options[0].origin;
         const destination = context.options[0].destination;
-        const msg = `Do not import directly from '${origin}'. Please use '${destination}' (autofix available).`;
+        const message = `Do not import directly from '${origin}'. Please use '${destination}' (autofix available).`;
         context.report({
           node,
-          message: `${msg}`,
+          message,
           fix(fixer) {
             if (node && destination) {
               return fixer.replaceText(node.source, `'${destination}'`);
@@ -46,7 +46,7 @@ module.exports = {
       }
     }
 
-    function checkImportDeclaretion(node) {
+    function checkImportDeclaration(node) {
       const origin = context.options[0].origin;
       const source = node.source.value;
       if (source && origin && source === origin) {
@@ -55,7 +55,7 @@ module.exports = {
     }
 
     return {
-      ImportDeclaration: node => checkImportDeclaretion(node),
+      ImportDeclaration: checkImportDeclaration
     };
   },
 };

eslint-rules/tests/lib/rules/no-direct-import.js

@@ -10,20 +10,21 @@ RuleTester.setDefaultConfig({
 
 const ruleTester = new RuleTester();
 
-const valideExample = `import {Component} from 'another-module';`;
-const invalideExample = `import {Component} from 'some-module';`;
+const validExample = `import {Component} from 'another-module';`;
+const invalidExample = `import {Component} from 'some-module';`;
 
 ruleTester.run('no-direct-import', rule, {
   valid: [
     {
       options: ruleOptions,
-      code: valideExample,
+      code: validExample,
     },
   ],
   invalid: [
     {
       options: ruleOptions,
-      code: invalideExample,
+      code: invalidExample,
+      output: `import {Component} from 'another-module';`,
       errors: [
         { message: `Do not import directly from 'some-module'. Please use 'another-module' (autofix available).` },
       ],