@holper/react-native-holper-storybook 0.6.5 → 0.6.6

package/lib/components/Button/index.js

@@ -1,13 +1,13 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { TouchableOpacity, ViewPropTypes, ActivityIndicator } from 'react-native';
+import {TouchableOpacity, ViewPropTypes, ActivityIndicator} from 'react-native';
 import withPreventDoubleClick from './../PreventDoubleClick';
-import { Colors } from '../../configs/constants';
+import {Colors} from '../../configs/constants';
 import style from './style';
 
-const Button = ({ onPress, disabled, isLoading, bordered, variant, size, noShadow, style: customStyle, children }) => {
+const Button = ({onPress, disabled, isLoading, bordered, variant, size, noShadow, style: customStyle, children}) => {
   const getSpinnerColor = () => {
-    switch(variant) {
+    switch (variant) {
       case 'primary':
       case 'inverted':
       case 'error':
@@ -23,21 +23,21 @@ const Button = ({ onPress, disabled, isLoading, bordered, variant, size, noShado
         style.button,
         style[variant],
         style[size],
-        bordered ? style.bordered: {},
-        disabled ? style.disabled: {},
-        noShadow ? style.noShadow: {},
+        bordered ? style.bordered : {},
+        disabled ? style.disabled : {},
+        noShadow ? style.noShadow : {},
         customStyle
       ]}
       disabled={isLoading || disabled}
       onPress={onPress}
     >
       {isLoading ?
-        <ActivityIndicator color={getSpinnerColor()} size={28} /> :
+        <ActivityIndicator color={getSpinnerColor()} size={28}/> :
         children
       }
     </TouchableOpacity>
   );
-}
+};
 
 Button.defaultProps = {
   children: null,
@@ -48,7 +48,8 @@ Button.defaultProps = {
   variant: 'primary',
   size: 'medium',
   style: {},
-  onPress: () => {},
+  onPress: () => {
+  },
 };
 
 Button.propTypes = {
@@ -57,7 +58,7 @@ Button.propTypes = {
   isLoading: PropTypes.bool,
   bordered: PropTypes.bool,
   noShadow: PropTypes.bool,
-  variant: PropTypes.oneOf(['primary', 'secondary', 'dim', 'light', 'inverted', 'error']),
+  variant: PropTypes.oneOf(['primary', 'secondary', 'dim', 'light', 'inverted', 'error', 'highlight']),
   size: PropTypes.oneOf(['tiny', 'small', 'medium', 'fit', 'icon']),
   style: ViewPropTypes.style,
   onPress: PropTypes.func,

package/lib/components/Button/style.js

@@ -1,7 +1,7 @@
-import { Dimensions } from 'react-native';
-import { Colors } from '../../configs/constants';
+import {Dimensions} from 'react-native';
+import {Colors} from '../../configs/constants';
 
-const { width } = Dimensions.get('window');
+const {width} = Dimensions.get('window');
 
 export default {
   // Default button shape
@@ -15,8 +15,8 @@ export default {
     justifyContent: 'center',
     alignItems: 'center',
     borderWidth: 1,
-    shadowOffset: { width: 0, height: 4 },
-    shadowOpacity:  0.4,
+    shadowOffset: {width: 0, height: 4},
+    shadowOpacity: 0.4,
     shadowRadius: 3,
     elevation: 5,
   },
@@ -51,6 +51,11 @@ export default {
     backgroundColor: Colors.red,
     shadowColor: Colors.red
   },
+  highlight: {
+    borderColor: Colors.violet,
+    backgroundColor: Colors.violet,
+    shadowColor: Colors.violet
+  },
   // Bordered
   bordered: {
     shadowColor: Colors.transparent,
@@ -82,4 +87,4 @@ export default {
     shadowColor: Colors.transparent,
     elevation: 0
   }
-}
+};

package/lib/components/Text/index.js

@@ -1,9 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Text as RNText } from 'react-native';
+import {Text as RNText} from 'react-native';
 import style from './style';
 
-const Text = ({ variant, size, color, weight, align, style: customStyle, children, ...props }) => (
+const Text = ({variant, size, color, weight, align, style: customStyle, children, ...props}) => (
   <RNText
     style={[
       style[variant],
@@ -31,7 +31,7 @@ Text.defaultProps = {
 };
 
 Text.propTypes = {
-  color: PropTypes.oneOf(['dark', 'light', 'lighter', 'white', 'green', 'red', 'yellow']),
+  color: PropTypes.oneOf(['dark', 'light', 'lighter', 'white', 'green', 'red', 'yellow', 'violet']),
   variant: PropTypes.oneOf(['default', 'lowercase', 'uppercase']),
   size: PropTypes.oneOf(['tiny', 'small', 'medium', 'large', 'extra-large']),
   weight: PropTypes.oneOf(['regular', 'bold', 'semiBold']),

package/lib/components/Text/style.js

@@ -1,4 +1,4 @@
-import { Colors } from '../../configs/constants';
+import {Colors} from '../../configs/constants';
 
 export default {
   //  colors
@@ -23,6 +23,9 @@ export default {
   yellow: {
     color: Colors.yellow
   },
+  violet: {
+    color: Colors.violet
+  },
   // variants
   lowercase: {
     textTransform: 'lowercase'
@@ -69,4 +72,4 @@ export default {
   justify: {
     textAlign: 'justify'
   }
-}
+};

package/package.json

@@ -2,7 +2,7 @@
   "main": "lib/index.js",
   "name": "@holper/react-native-holper-storybook",
   "description": "A component library for Holper projects",
-  "version": "0.6.5",
+  "version": "0.6.6",
   "license": "MIT",
   "files": [
     "lib",