fix(select): 🎨 add isDefaultState prop for prefix & suffix, fixing icon color on selected state

Author: Karthik-B-06

src/components/select/Select.tsx

@@ -199,6 +199,7 @@ const RNSelect: React.FC<Partial<SelectProps>> = forwardRef<
                 invalid={invalid}
                 prefix={prefix}
                 isPressedOrHovered={pressed || isHovered}
+                isDefaultState={isUndefined(selectState)}
               />
               <Text
                 style={tailwind.style([
@@ -229,6 +230,7 @@ const RNSelect: React.FC<Partial<SelectProps>> = forwardRef<
                 invalid={invalid}
                 suffix={suffix}
                 isPressedOrHovered={pressed || isHovered}
+                isDefaultState={isUndefined(selectState)}
               />
             </>
           );

src/components/select/SelectPrefix.tsx

@@ -14,6 +14,7 @@ interface SelectPrefixProps
     >,
     BoxProps {
   isPressedOrHovered: boolean;
+  isDefaultState: boolean;
 }
 
 export const SelectPrefix: React.FC<SelectPrefixProps> = ({
@@ -23,6 +24,7 @@ export const SelectPrefix: React.FC<SelectPrefixProps> = ({
   disabled,
   isPressedOrHovered,
   prefix,
+  isDefaultState,
   ...props
 }) => {
   const tailwind = useTheme();
@@ -35,7 +37,9 @@ export const SelectPrefix: React.FC<SelectPrefixProps> = ({
     ? selectPrefixStyles.prefix.variant[variant].disabled
     : invalid
     ? selectPrefixStyles.prefix.variant[variant].invalid
-    : selectPrefixStyles.prefix.variant[variant].default;
+    : isDefaultState
+    ? selectPrefixStyles.suffix.variant[variant].default
+    : selectPrefixStyles.suffix.variant[variant].filled;
 
   const _prefix: SelectProps["prefix"] = React.useMemo(() => {
     const selectPrefix =

src/components/select/SelectSuffix.tsx

@@ -15,6 +15,7 @@ interface SelectSuffixProps
     >,
     BoxProps {
   isPressedOrHovered: boolean;
+  isDefaultState: boolean;
 }
 
 export const SelectSuffix: React.FC<SelectSuffixProps> = ({
@@ -24,6 +25,7 @@ export const SelectSuffix: React.FC<SelectSuffixProps> = ({
   disabled,
   isPressedOrHovered,
   suffix,
+  isDefaultState,
   ...props
 }) => {
   const tailwind = useTheme();
@@ -36,7 +38,9 @@ export const SelectSuffix: React.FC<SelectSuffixProps> = ({
     ? selectSuffixStyles.suffix.variant[variant].disabled
     : invalid
     ? selectSuffixStyles.suffix.variant[variant].invalid
-    : selectSuffixStyles.suffix.variant[variant].default;
+    : isDefaultState
+    ? selectSuffixStyles.suffix.variant[variant].default
+    : selectSuffixStyles.suffix.variant[variant].filled;
 
   const _suffix: SelectProps["suffix"] = React.useMemo(() => {
     const selectSuffix =