diff --git a/src/components/Dropdown/index.tsx b/src/components/Dropdown/index.tsx
index 9c6a599..9cb6470 100644
--- a/src/components/Dropdown/index.tsx
+++ b/src/components/Dropdown/index.tsx
@@ -79,6 +79,7 @@ const DropdownComponent: <T>(
       inverted = true,
       renderLeftIcon,
       renderRightIcon,
+      renderSelectedItem,
       renderItem,
       renderInputSearch,
       onFocus,
@@ -450,33 +451,37 @@ const DropdownComponent: <T>(
           accessibilityLabel={accessibilityLabel}
           onPress={showOrClose}
         >
-          <View style={styles.dropdown}>
-            {renderLeftIcon?.(visible)}
-            <Text
-              style={[
-                styles.textItem,
-                isSelected !== null ? selectedTextStyle : placeholderStyle,
-                font(),
-              ]}
-              {...selectedTextProps}
-            >
-              {isSelected !== null
-                ? _get(currentValue, labelField)
-                : placeholder}
-            </Text>
-            {renderRightIcon ? (
-              renderRightIcon(visible)
-            ) : (
-              <Image
-                source={ic_down}
-                style={StyleSheet.flatten([
-                  styles.icon,
-                  { tintColor: iconColor },
-                  iconStyle,
-                ])}
-              />
-            )}
-          </View>
+          {renderSelectedItem ? (
+            renderSelectedItem(visible)
+          ) : (
+            <View style={styles.dropdown}>
+              {renderLeftIcon?.(visible)}
+              <Text
+                style={[
+                  styles.textItem,
+                  isSelected !== null ? selectedTextStyle : placeholderStyle,
+                  font(),
+                ]}
+                {...selectedTextProps}
+              >
+                {isSelected !== null
+                  ? _get(currentValue, labelField)
+                  : placeholder}
+              </Text>
+              {renderRightIcon ? (
+                renderRightIcon(visible)
+              ) : (
+                <Image
+                  source={ic_down}
+                  style={StyleSheet.flatten([
+                    styles.icon,
+                    { tintColor: iconColor },
+                    iconStyle,
+                  ])}
+                />
+              )}
+            </View>
+          )}
         </TouchableWithoutFeedback>
       );
     };
@@ -552,11 +557,13 @@ const DropdownComponent: <T>(
             onSearch(text);
           });
         } else {
+          const { height } = position;
+
           return (
             <CInput
               testID={testID + ' input'}
               accessibilityLabel={accessibilityLabel + ' input'}
-              style={[styles.input, inputSearchStyle]}
+              style={[styles.input, inputSearchStyle, { height: height }]}
               inputStyle={[inputSearchStyle, font()]}
               value={searchText}
               autoCorrect={false}
@@ -590,6 +597,7 @@ const DropdownComponent: <T>(
       searchPlaceholderTextColor,
       testID,
       searchText,
+      position,
     ]);
 
     const _renderList = useCallback(
@@ -597,6 +605,15 @@ const DropdownComponent: <T>(
         const isInverted = !inverted ? false : isTopPosition;
 
         const _renderListHelper = () => {
+          let customList = listData;
+          if (customList.length === 0) {
+            let customNotFound: any = { _index: 0 };
+            customNotFound[valueField] = null;
+            customNotFound[labelField] = 'Not Found';
+
+            customList.push(customNotFound);
+          }
+
           return (
             <FlatList
               testID={testID + ' flatlist'}
@@ -605,7 +622,7 @@ const DropdownComponent: <T>(
               keyboardShouldPersistTaps="handled"
               ref={refList}
               onScrollToIndexFailed={scrollIndex}
-              data={listData}
+              data={customList}
               inverted={isTopPosition ? inverted : false}
               renderItem={_renderItem}
               keyExtractor={(_item, index) => index.toString()}
@@ -618,7 +635,7 @@ const DropdownComponent: <T>(
           <TouchableWithoutFeedback>
             <View style={styles.flexShrink}>
               {isInverted && _renderListHelper()}
-              {renderSearch()}
+              {/* {renderSearch()} */}
               {!isInverted && _renderListHelper()}
             </View>
           </TouchableWithoutFeedback>
@@ -630,16 +647,19 @@ const DropdownComponent: <T>(
         flatListProps,
         listData,
         inverted,
-        renderSearch,
+        // renderSearch,
         scrollIndex,
         showsVerticalScrollIndicator,
         testID,
+        labelField,
+        valueField,
       ]
     );
 
     const _renderModal = useCallback(() => {
       if (visible && position) {
         const { isFull, width, height, top, bottom, left } = position;
+        // console.log(position);
 
         const onAutoPosition = () => {
           if (keyboardHeight > 0) {
@@ -663,6 +683,12 @@ const DropdownComponent: <T>(
           let keyboardStyle: ViewStyle = {};
 
           let extendHeight = !isTopPosition ? top : bottom;
+          if (search) {
+            extendHeight = !isTopPosition
+              ? top - height - 2
+              : bottom - height * 0.5;
+          }
+
           if (
             keyboardAvoiding &&
             keyboardHeight > 0 &&
@@ -701,6 +727,18 @@ const DropdownComponent: <T>(
                       isFull && styles.fullScreen,
                     ])}
                   >
+                    <View
+                      style={StyleSheet.flatten([
+                        // styles.container,
+                        // isFull ? styleHorizontal : styleVertical,
+                        {
+                          left: left,
+                          width: width,
+                        },
+                      ])}
+                    >
+                      {renderSearch()}
+                    </View>
                     <View
                       style={StyleSheet.flatten([
                         styles.container,
@@ -737,6 +775,7 @@ const DropdownComponent: <T>(
       containerStyle,
       styleHorizontal,
       _renderList,
+      renderSearch,
     ]);
 
     return (
diff --git a/src/components/Dropdown/model.ts b/src/components/Dropdown/model.ts
index a32bba5..64bc58a 100644
--- a/src/components/Dropdown/model.ts
+++ b/src/components/Dropdown/model.ts
@@ -59,6 +59,7 @@ export interface DropdownProps<T> {
   excludeItems?: T[];
   excludeSearchItems?: T[];
   onChange: (item: T) => void;
+  renderSelectedItem?: (visible?: boolean) => JSX.Element | null | undefined;
   renderLeftIcon?: (visible?: boolean) => JSX.Element | null | undefined;
   renderRightIcon?: (visible?: boolean) => JSX.Element | null | undefined;
   renderItem?: (item: T, selected?: boolean) => JSX.Element | null | undefined;
diff --git a/src/components/Dropdown/styles.ts b/src/components/Dropdown/styles.ts
index 2c83bdd..4a98a73 100644
--- a/src/components/Dropdown/styles.ts
+++ b/src/components/Dropdown/styles.ts
@@ -31,6 +31,7 @@ export const styles = StyleSheet.create({
     flexDirection: I18nManager.isRTL ? 'row-reverse' : 'row',
     justifyContent: 'space-between',
     alignItems: 'center',
+    columnGap: 10,
   },
   title: {
     marginVertical: 5,
@@ -53,11 +54,13 @@ export const styles = StyleSheet.create({
     height: 20,
   },
   input: {
-    borderWidth: 0.5,
-    borderColor: '#DDDDDD',
+    borderColor: 'gray', 
+    borderWidth: 1, 
+    borderRadius: 8,
     paddingHorizontal: 8,
     marginBottom: 8,
-    margin: 6,
+    // margin: 6,
+    backgroundColor: 'white',
     height: 45,
   },
   fullScreen: {