From 75677d6af537babb3e32bb95e54131a61bfef48a Mon Sep 17 00:00:00 2001
From: Ross Miller <ross@openpath.com>
Date: Sun, 21 Feb 2021 11:09:10 -0800
Subject: [PATCH] Fix #91: Optimize styles by using StyleSheet.create() for
 styles that don't include dynamic data

---
 index.js | 35 ++++++++++++++++++++++++-----------
 1 file changed, 24 insertions(+), 11 deletions(-)

diff --git a/index.js b/index.js
index 5e387c8..922d1e1 100644
--- a/index.js
+++ b/index.js
@@ -10,11 +10,25 @@ import {
   Keyboard,
   Image,
   View,
-  ViewPropTypes
+  ViewPropTypes,
+  StyleSheet
 } from 'react-native';
 
 const AnimatedTextInput = Animated.createAnimatedComponent(TextInput);
 
+const optimizedStyles = StyleSheet.create({
+  iconSearchDefault: {
+    tintColor: 'grey'
+  },
+  iconDeleteDefault: {
+    tintColor: 'grey'
+  },
+  cancelButtonText: {
+    fontSize: 14,
+    color: '#fff'
+  }
+})
+
 class Search extends PureComponent {
   constructor(props) {
     super(props);
@@ -417,6 +431,12 @@ const getStyles = (inputHeight, isRtl) => {
     inputHeight = 30
   }
 
+  const {
+    iconSearchDefault,
+    iconDeleteDefault,
+    cancelButtonText
+  } = optimizedStyles;
+
   return {
     container: {
       backgroundColor: 'grey',
@@ -445,9 +465,7 @@ const getStyles = (inputHeight, isRtl) => {
       height: 14,
       width: 14
     },
-    iconSearchDefault: {
-      tintColor: 'grey'
-    },
+    iconSearchDefault,
     iconDelete: {
       position: 'absolute',
       [isRtl ? 'left' : 'right']: 70,
@@ -455,9 +473,7 @@ const getStyles = (inputHeight, isRtl) => {
       height: 14,
       width: 14
     },
-    iconDeleteDefault: {
-      tintColor: 'grey'
-    },
+    iconDeleteDefault,
     cancelButton: {
       justifyContent: 'center',
       alignItems: isRtl ? 'flex-end' : 'flex-start',
@@ -465,10 +481,7 @@ const getStyles = (inputHeight, isRtl) => {
       width: 60,
       height: 50
     },
-    cancelButtonText: {
-      fontSize: 14,
-      color: '#fff'
-    }
+    cancelButtonText
   };
 }