Unable to Style Input Component via Theme Configuration

[omar-bear]

Description

I am unable to style the Input component from the theme.

After looking through the Ficus UI codebase and examining the useDefaultProps hook, which is supposed to grab the Input component's style from the theme, I styled the Input in the following way:

import { InputProps } from 'react-native-ficus-ui';
import foundations from '@/theme/foundations';

export default {
  name: 'light',
  ...foundations,
  components: {
    // ...other components
    Input: {
      variant: 'default',
      variants: {
        default: {
          colorScheme: 'gray',
          bg: 'gray.50',
          borderColor: 'gray.200',
          borderWidth: 1,
          focusBorderWidth: 2,
          borderRadius: 'full',
          focusBorderColor: 'success.600',
          placeholderTextColor: 'gray.400',
        } as InputProps,
      },
    },
    // ...other components
  },
};

I also tried directly like this:

import { InputProps } from 'react-native-ficus-ui';
import foundations from '@/theme/foundations';

export default {
  name: 'light',
  ...foundations,
  components: {
    // ...other components
    Input: {
      colorScheme: 'gray',
      bg: 'gray.50',
      borderColor: 'gray.200',
      borderWidth: 1,
      focusBorderWidth: 2,
      borderRadius: 'full',
      focusBorderColor: 'success.600',
      placeholderTextColor: 'gray.400',
    },
    // ...other components
  },
};

However, it's still not working.

[ntorionbearstudio]

Can you test again please @omar-bear?

It's working when I try this for example :

<ThemeProvider
      theme={{
        components: {
          Input: {
            bg: 'red.50',
            borderColor: 'red.200',
            borderWidth: 2,
            focusBorderWidth: 3,
            borderRadius: 'full',
            focusBorderColor: 'red.600',
            placeholderTextColor: 'red.400',
          },
        },
      }}
    >