From 19bf2b71f27b110c18e56b7f0b8c77f2a17db8c7 Mon Sep 17 00:00:00 2001
From: helabbassi <helabbassi@kilix.fr>
Date: Sun, 18 Feb 2018 10:30:12 +0100
Subject: [PATCH 1/3] Add customCheckboxSource render prop

---
 src/SelectMultiple.js | 27 +++++++++++++++++----------
 1 file changed, 17 insertions(+), 10 deletions(-)

diff --git a/src/SelectMultiple.js b/src/SelectMultiple.js
index 19ac7f3..ea77e05 100644
--- a/src/SelectMultiple.js
+++ b/src/SelectMultiple.js
@@ -28,6 +28,7 @@ export default class SelectMultiple extends Component {
     onSelectionsChange: PropTypes.func.isRequired,
 
     checkboxSource: sourceType,
+    renderCustomCheckboxSource: PropTypes.func,
     selectedCheckboxSource: sourceType,
     renderLabel: PropTypes.func,
     listViewProps: PropTypes.any,
@@ -132,27 +133,33 @@ export default class SelectMultiple extends Component {
     } = this.props
 
     const {
+      renderCustomCheckboxSource,
       selectedCheckboxSource,
       selectedRowStyle,
       selectedCheckboxStyle,
       selectedLabelStyle
     } = this.props
 
-    if (row.selected) {
-      checkboxSource = selectedCheckboxSource
-      rowStyle = mergeStyles(styles.row, rowStyle, selectedRowStyle)
-      checkboxStyle = mergeStyles(styles.checkbox, checkboxStyle, selectedCheckboxStyle)
-      labelStyle = mergeStyles(styles.label, labelStyle, selectedLabelStyle)
-    } else {
-      rowStyle = mergeStyles(styles.row, rowStyle)
-      checkboxStyle = mergeStyles(styles.checkbox, checkboxStyle)
-      labelStyle = mergeStyles(styles.label, labelStyle)
+    if (!renderCustomCheckboxSource) {
+      if (row.selected) {
+        checkboxSource = selectedCheckboxSource
+        rowStyle = mergeStyles(styles.row, rowStyle, selectedRowStyle)
+        checkboxStyle = mergeStyles(styles.checkbox, checkboxStyle, selectedCheckboxStyle)
+        labelStyle = mergeStyles(styles.label, labelStyle, selectedLabelStyle)
+      } else {
+        rowStyle = mergeStyles(styles.row, rowStyle)
+        checkboxStyle = mergeStyles(styles.checkbox, checkboxStyle)
+        labelStyle = mergeStyles(styles.label, labelStyle)
+      }
     }
 
     return (
       <TouchableWithoutFeedback onPress={() => this.onRowPress(row)}>
         <View style={rowStyle}>
-          <Image style={checkboxStyle} source={checkboxSource} />
+          {renderCustomCheckboxSource 
+            ? renderCustomCheckboxSource(row.selected)
+            : <Image style={checkboxStyle} source={checkboxSource} />
+          }
           {this.renderLabel(row.label, labelStyle, row.selected)}
         </View>
       </TouchableWithoutFeedback>

From f02ea776eeac993421804dd55915c5d4c63177f3 Mon Sep 17 00:00:00 2001
From: helabbassi <helabbassi@kilix.fr>
Date: Tue, 27 Feb 2018 21:08:56 +0100
Subject: [PATCH 2/3] rename renderCustomCheckBoxSource

---
 src/SelectMultiple.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/SelectMultiple.js b/src/SelectMultiple.js
index ea77e05..6272626 100644
--- a/src/SelectMultiple.js
+++ b/src/SelectMultiple.js
@@ -28,7 +28,7 @@ export default class SelectMultiple extends Component {
     onSelectionsChange: PropTypes.func.isRequired,
 
     checkboxSource: sourceType,
-    renderCustomCheckboxSource: PropTypes.func,
+    renderCheckbox: PropTypes.func,
     selectedCheckboxSource: sourceType,
     renderLabel: PropTypes.func,
     listViewProps: PropTypes.any,
@@ -133,14 +133,14 @@ export default class SelectMultiple extends Component {
     } = this.props
 
     const {
-      renderCustomCheckboxSource,
+      renderCheckbox,
       selectedCheckboxSource,
       selectedRowStyle,
       selectedCheckboxStyle,
       selectedLabelStyle
     } = this.props
 
-    if (!renderCustomCheckboxSource) {
+    if (!renderCheckbox) {
       if (row.selected) {
         checkboxSource = selectedCheckboxSource
         rowStyle = mergeStyles(styles.row, rowStyle, selectedRowStyle)
@@ -156,8 +156,8 @@ export default class SelectMultiple extends Component {
     return (
       <TouchableWithoutFeedback onPress={() => this.onRowPress(row)}>
         <View style={rowStyle}>
-          {renderCustomCheckboxSource 
-            ? renderCustomCheckboxSource(row.selected)
+          {renderCheckbox 
+            ? renderCheckbox(row.selected)
             : <Image style={checkboxStyle} source={checkboxSource} />
           }
           {this.renderLabel(row.label, labelStyle, row.selected)}

From ecde3646e71e3b31dfc9f4cdf0751c418b913904 Mon Sep 17 00:00:00 2001
From: helabbassi <helabbassi@kilix.fr>
Date: Tue, 27 Feb 2018 22:19:51 +0100
Subject: [PATCH 3/3] Update styles & remove avoid mutating props

---
 README.md             |  1 +
 src/SelectMultiple.js | 63 ++++++++++++++++++++++---------------------
 2 files changed, 34 insertions(+), 30 deletions(-)

diff --git a/README.md b/README.md
index 67ae60d..eed44ca 100644
--- a/README.md
+++ b/README.md
@@ -113,6 +113,7 @@ class App extends Component {
 | selectedRowStyle | [default styles](src/SelectMultiple.styles.js) | `object` | [Style](https://facebook.github.io/react-native/docs/view.html#style) for the row container when selected. |
 | selectedCheckboxStyle | [default styles](src/SelectMultiple.styles.js) | `object` | [Style](https://facebook.github.io/react-native/docs/image.html#style) for the checkbox image when selected. |
 | selectedLabelStyle | [default styles](src/SelectMultiple.styles.js) | `object` | [Style](https://facebook.github.io/react-native/docs/text.html#style) for the text label when selected. |
+| renderCheckbox | null | `func` | Function for render custom checkbox. | 
 | renderLabel | null | `func` | Function for render label. |
 
 ## Contribute
diff --git a/src/SelectMultiple.js b/src/SelectMultiple.js
index 6272626..d7304a5 100644
--- a/src/SelectMultiple.js
+++ b/src/SelectMultiple.js
@@ -115,52 +115,55 @@ export default class SelectMultiple extends Component {
     return <ListView style={style} dataSource={dataSource} renderRow={renderItemRow} {...(listViewProps || {})} />
   }
 
-  renderLabel = (label, style, selected) => {
+  renderLabel = (row) => {
+    const {labelStyle, selectedLabelStyle} = this.props
+    const labelStyleToRender = row.selected 
+      ? mergeStyles(styles.label, labelStyle, selectedLabelStyle) 
+      : mergeStyles(styles.label, labelStyle);
+
     if (this.props.renderLabel) {
-      return this.props.renderLabel(label, style, selected)
+      return this.props.renderLabel(row.label, labelStyleToRender, row.selected)
     }
     return (
-      <Text style={style}>{label}</Text>
+      <Text style={labelStyleToRender}>{row.label}</Text>
     )
   }
 
-  renderItemRow = (row) => {
-    let {
-      checkboxSource,
-      rowStyle,
-      labelStyle,
-      checkboxStyle
-    } = this.props
+  getCheckboxStyle = (row) => {
+    const {renderCheckbox, selectedCheckboxStyle, checkboxStyle} = this.props
+
+    if (row.selected) {
+      return mergeStyles(styles.checkbox, checkboxStyle, selectedCheckboxStyle)
+    } else {
+      return mergeStyles(styles.checkbox, checkboxStyle)
+    }
+  }
+
+  getRowStyle = (row) => {
+    const {rowStyle, selectedRowStyle} = this.props;
 
+    if (row.selected) {
+      return mergeStyles(styles.row, rowStyle, selectedRowStyle)
+    } else {
+      return mergeStyles(styles.row, rowStyle)
+    }
+  }
+
+  renderItemRow = (row) => {
     const {
+      checkboxSource,
       renderCheckbox,
-      selectedCheckboxSource,
-      selectedRowStyle,
-      selectedCheckboxStyle,
-      selectedLabelStyle
+      selectedCheckboxSource
     } = this.props
 
-    if (!renderCheckbox) {
-      if (row.selected) {
-        checkboxSource = selectedCheckboxSource
-        rowStyle = mergeStyles(styles.row, rowStyle, selectedRowStyle)
-        checkboxStyle = mergeStyles(styles.checkbox, checkboxStyle, selectedCheckboxStyle)
-        labelStyle = mergeStyles(styles.label, labelStyle, selectedLabelStyle)
-      } else {
-        rowStyle = mergeStyles(styles.row, rowStyle)
-        checkboxStyle = mergeStyles(styles.checkbox, checkboxStyle)
-        labelStyle = mergeStyles(styles.label, labelStyle)
-      }
-    }
-
     return (
       <TouchableWithoutFeedback onPress={() => this.onRowPress(row)}>
-        <View style={rowStyle}>
+        <View style={this.getRowStyle(row)}>
           {renderCheckbox 
             ? renderCheckbox(row.selected)
-            : <Image style={checkboxStyle} source={checkboxSource} />
+            : <Image style={this.getCheckboxStyle(row)} source={row.selected ? selectedCheckboxSource : checkboxSource} />
           }
-          {this.renderLabel(row.label, labelStyle, row.selected)}
+          {this.renderLabel(row)}
         </View>
       </TouchableWithoutFeedback>
     )