From 254585ab1185bac71821c7ec1247ee69345d7bbd Mon Sep 17 00:00:00 2001
From: Maneesh_ML <maneesh.a@mtwlabs.com>
Date: Thu, 13 Feb 2020 16:57:31 +0530
Subject: [PATCH 1/2] Added highlightBackground Prop

---
 index.js | 37 +++++++++++++++++++++----------------
 1 file changed, 21 insertions(+), 16 deletions(-)

diff --git a/index.js b/index.js
index f2a3753..01e0ebc 100644
--- a/index.js
+++ b/index.js
@@ -26,6 +26,7 @@ export const HighLightView = styled.View`
   border-bottom-color: ${props => props.highlightColor};
   border-top-width: ${props => props.highlightBorderWidth}px;
   border-bottom-width: ${props => props.highlightBorderWidth}px;
+  background-color: ${props => props.highlightBackground};
 `;
 export const SelectedItem = styled.View`
   height: 30px;
@@ -34,7 +35,7 @@ export const SelectedItem = styled.View`
   height: ${props => props.itemHeight};
 `;
 const deviceWidth = Dimensions.get('window').width;
-export default class ScrollPicker extends React.Component {
+export default class CMonthPicker extends React.Component {
   constructor() {
     super();
     this.onMomentumScrollBegin = this.onMomentumScrollBegin.bind(this);
@@ -59,15 +60,17 @@ export default class ScrollPicker extends React.Component {
   }
 
   render() {
-    const {header, footer} = this.renderPlaceHolder();
+    const { header, footer } = this.renderPlaceHolder();
     return (
       <Container wrapperHeight={this.props.wrapperHeight} wrapperWidth={this.props.wrapperWidth}
-                 wrapperBackground={this.props.wrapperBackground}>
+        wrapperBackground={this.props.wrapperBackground}>
         <HighLightView highlightColor={this.props.highlightColor}
-                       highlightWidth={this.props.highlightWidth}
-                       wrapperHeight={this.props.wrapperHeight}
-                       itemHeight={this.props.itemHeight}
-                       highlightBorderWidth={this.props.highlightBorderWidth}/>
+          highlightWidth={this.props.highlightWidth}
+          wrapperHeight={this.props.wrapperHeight}
+          itemHeight={this.props.itemHeight}
+          highlightBorderWidth={this.props.highlightBorderWidth}
+          highlightBackground={this.props.highlightBackground}
+        />
         <ScrollView
           ref={(sview) => {
             this.sview = sview;
@@ -90,9 +93,9 @@ export default class ScrollPicker extends React.Component {
 
   renderPlaceHolder() {
     const height = (this.props.wrapperHeight - this.props.itemHeight) / 2;
-    const header = <View style={{height, flex: 1}}></View>;
-    const footer = <View style={{height, flex: 1}}></View>;
-    return {header, footer};
+    const header = <View style={{ height, flex: 1 }}></View>;
+    const footer = <View style={{ height, flex: 1 }}></View>;
+    return { header, footer };
   }
 
   renderItem(data, index) {
@@ -120,7 +123,7 @@ export default class ScrollPicker extends React.Component {
         this.isScrollTo = true;
       }
       if (this.sview) {
-        this.sview.scrollTo({y: verticalElem});
+        this.sview.scrollTo({ y: verticalElem });
       }
     }
     if (this.state.selectedIndex === selectedIndex) {
@@ -192,12 +195,12 @@ export default class ScrollPicker extends React.Component {
     const y = this.props.itemHeight * ind;
     setTimeout(() => {
       if (this.sview) {
-        this.sview.scrollTo({y});
+        this.sview.scrollTo({ y });
       }
     }, 0);
   }
 }
-ScrollPicker.propTypes = {
+CMonthPicker.propTypes = {
   style: PropTypes.object,
   dataSource: PropTypes.array,
   selectedIndex: PropTypes.number,
@@ -206,6 +209,7 @@ ScrollPicker.propTypes = {
   highlightColor: PropTypes.string,
   itemHeight: PropTypes.number,
   wrapperBackground: PropTypes.string,
+  highlightBackground: PropTypes.string,
   wrapperWidth: PropTypes.number,
   wrapperHeight: PropTypes.number,
   highlightWidth: PropTypes.number,
@@ -215,19 +219,20 @@ ScrollPicker.propTypes = {
   onMomentumScrollEnd: PropTypes.func,
   onScrollEndDrag: PropTypes.func,
 };
-ScrollPicker.defaultProps = {
+CMonthPicker.defaultProps = {
   dataSource: [1, 2, 3],
   itemHeight: 60,
   wrapperBackground: '#FFFFFF',
   wrapperHeight: 180,
   wrapperWidth: 150,
   highlightWidth: deviceWidth,
+  highlightBackground: '#FFFFFF',
   highlightBorderWidth: 2,
   highlightColor: '#333',
   onMomentumScrollEnd: () => {
   },
   onScrollEndDrag: () => {
   },
-  itemTextStyle: {fontSize: 20, lineHeight: 26, textAlign: 'center', color: '#B4B4B4'},
-  activeItemTextStyle: {fontSize: 20, lineHeight: 26, textAlign: 'center', color: '#222121'}
+  itemTextStyle: { fontSize: 20, lineHeight: 26, textAlign: 'center', color: '#B4B4B4' },
+  activeItemTextStyle: { fontSize: 20, lineHeight: 26, textAlign: 'center', color: '#222121' }
 };
\ No newline at end of file

From 19b24a6d0bb9b64ceca0ad7066b4b9d7ba02e419 Mon Sep 17 00:00:00 2001
From: Maneesh_ML <maneesh.a@mtwlabs.com>
Date: Thu, 13 Feb 2020 16:59:05 +0530
Subject: [PATCH 2/2] Added highlightBackground Prop

---
 index.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/index.js b/index.js
index 01e0ebc..d6f305d 100644
--- a/index.js
+++ b/index.js
@@ -35,7 +35,7 @@ export const SelectedItem = styled.View`
   height: ${props => props.itemHeight};
 `;
 const deviceWidth = Dimensions.get('window').width;
-export default class CMonthPicker extends React.Component {
+export default class ScrollPicker extends React.Component {
   constructor() {
     super();
     this.onMomentumScrollBegin = this.onMomentumScrollBegin.bind(this);
@@ -200,7 +200,7 @@ export default class CMonthPicker extends React.Component {
     }, 0);
   }
 }
-CMonthPicker.propTypes = {
+ScrollPicker.propTypes = {
   style: PropTypes.object,
   dataSource: PropTypes.array,
   selectedIndex: PropTypes.number,
@@ -219,7 +219,7 @@ CMonthPicker.propTypes = {
   onMomentumScrollEnd: PropTypes.func,
   onScrollEndDrag: PropTypes.func,
 };
-CMonthPicker.defaultProps = {
+ScrollPicker.defaultProps = {
   dataSource: [1, 2, 3],
   itemHeight: 60,
   wrapperBackground: '#FFFFFF',