Feature render custom icon prop added for selectbox.

src/components/selectBox/index.tsx

@@ -69,6 +69,7 @@ function SelectBox<T>({
     isCleanEnabled = false,
     removeSelectValidation,
     contentContainerStyle,
+    CustomPrefixComponent,
     subTitle = "Optional",
     initialSelectedItems,
     isSearchable = false,
@@ -191,6 +192,7 @@ function SelectBox<T>({
         icon: iconDynamicStyle
     } = useStyles({
         icon: IconComponentProp ? true : false,
+        CustomPrefixComponent,
         spreadBehaviour,
         inlineSpaces,
         isSearchable,
@@ -577,6 +579,10 @@ function SelectBox<T>({
     };
 
     const renderIcon = () => {
+        if(CustomPrefixComponent) {
+            return CustomPrefixComponent();
+        }
+
         if (!IconComponentProp) {
             return null;
         }

src/components/selectBox/stylesheet.ts

@@ -161,6 +161,7 @@ const stylesheet = StyleSheet.create({
 });
 
 export const useStyles = ({
+    CustomPrefixComponent,
     spreadBehaviour,
     inlineSpaces,
     currentType,
@@ -246,6 +247,10 @@ export const useStyles = ({
         styles.contentContainer.borderColor = colors.content.border.emphasized;
     }
 
+    if(CustomPrefixComponent) {
+        styles.content.marginLeft = spaces.spacingSm;
+    }
+
     return styles;
 };
 export default stylesheet;

src/components/selectBox/type.ts

@@ -31,6 +31,7 @@ export type SelectBoxDynamicStyleType = {
     spreadBehaviour?: SelectBoxSpreadBehaviour;
     spaces: NCoreUIKit.ActivePalette["spaces"];
     colors: NCoreUIKit.ActivePalette["colors"];
+    CustomPrefixComponent?: () => ReactNode;
     currentType: SelectBoxTypes;
     borders: NCoreUIKit.Borders;
     isSearchable?: boolean;
@@ -139,6 +140,7 @@ interface ISelectBoxProps<T> {
         item: T & SelectedItem | SelectedItem;
         index: number;
     }) => ReactElement;
+    CustomPrefixComponent?: () => ReactNode;
     hintTextContainerStyle?: ViewStyle;
     renderLoadingIcon?: NCoreUIKitIcon;
     contentContainerStyle?: ViewStyle;