use iconRenderer as Icon component

Author: renrizzolo

lib/components/ItemIcon.js

@@ -1,9 +1,9 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import { Image } from 'react-native'
-import Icon from 'react-native-vector-icons/MaterialIcons'
+// import Icon from 'react-native-vector-icons/MaterialIcons'
 
-const ItemIcon = ({ icon, iconKey, itemIconStyle }) => {
+const ItemIcon = ({ iconRenderer: Icon, icon, iconKey, itemIconStyle }) => {
   return (
     typeof icon === 'object' || typeof icon === 'number' ?
       <Image

lib/components/RowItem.js

@@ -33,7 +33,6 @@ class RowItem extends Component {
   }
 
   shouldComponentUpdate(nextProps, nextState) {
-
     if (nextProps.selectedItems !== this.props.selectedItems) {
       if (
         this.props.selectedItems.includes(this.props.item[this.props.uniqueKey]) &&
@@ -70,7 +69,6 @@ class RowItem extends Component {
       ) {
         return true
       }
-      
     }
 
     if (this.props.searchTerm !== nextProps.searchTerm) {
@@ -172,7 +170,11 @@ class RowItem extends Component {
   )
   _renderSelectedIcon = () => {
     const {
-      item, selectedIconComponent, mergedColors, unselectedIconComponent,
+      item,
+      selectedIconComponent,
+      mergedColors,
+      unselectedIconComponent,
+      iconRenderer: Icon,
     } = this.props
     return this._itemSelected(item)
       ? callIfFunction(selectedIconComponent) || (
@@ -205,6 +207,7 @@ class RowItem extends Component {
       displayKey,
       selectedItems,
       iconKey,
+      iconRenderer: Icon,
     } = this.props
     const hasDropDown = item[subKey] && item[subKey].length > 0 && showDropDowns
 
@@ -235,7 +238,12 @@ class RowItem extends Component {
           >
             {selectedIconOnLeft && this._renderSelectedIcon()}
             {iconKey && item[iconKey] && (
-              <ItemIcon iconKey={iconKey} icon={item[iconKey]} style={mergedStyles.itemIconStyle} />
+              <ItemIcon
+                iconRenderer={Icon}
+                iconKey={iconKey}
+                icon={item[iconKey]}
+                style={mergedStyles.itemIconStyle}
+              />
             )}
             <Text
               numberOfLines={itemNumberOfLines}

lib/components/RowSubItem.js

@@ -1,7 +1,6 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 import { View, TouchableOpacity, Text, Image } from 'react-native'
-import Icon from 'react-native-vector-icons/MaterialIcons'
 import ItemIcon from './ItemIcon'
 import { callIfFunction } from '../helpers'
 
@@ -54,6 +53,7 @@ class RowSubItem extends Component {
       highlightedChildren,
       uniqueKey,
       subItem,
+      iconRenderer: Icon,
     } = this.props
     const highlightChild = !selectChildren && highlightedChildren.includes(subItem[uniqueKey])
     const itemSelected = this._itemSelected()