[Feature] More extensive theming

Is your feature request related to a problem? Please Describe. The current theming method only seems to support some of the component’s theming, and it only seems to support one variant (Please correct me if I’m wrong).

Describe the solution you’d like All the style props should be customizable, with multiple variants:

import { ThemeProvider } from 'react-native-elements';

const base = {
  Button: {
    containerStyle: {
    },
    buttonStyle: {
    },
    etc.
  }
};

const primary = {
  Button: {
    containerStyle: {
    },
    buttonStyle: {
    },
    etc.
  }
};

<ThemeProvider theme={{base, primary}}>

------------
import { Button } from 'react-native-elements';

<Button variant="primary" containerStyle={{ any }} />
Which should produce the concatenated style of Internal > Base > Primary > External, for each customizable styles on the Button component

Describe alternatives you’ve considered Currently I’m using composition to achieve a similar behaviour

[EricVanDerDijs]

@flyingcircle Yes, but it does not take into account that one could use ‘clear’ and ‘solid’ buttons and extend their styles separately, since this logic is coded into the RNE component itself without taking into account that there could be overrides specific for every button type, that is what I’m trying to point out.

[EricVanDerDijs]

Hi! I have been using this library for a couple of weeks and I was surprised that even when the lib offers me 3 different types of buttons, all of them with their own set of styles, I cannot extend the styles globally for the button types that are offered, since when I try to define a theme the styling for the normal buttons I use in the whole app, I end up breaking the styling of the buttons with type ‘clear’ that I use in several other places.

I was looking at the code and this could be fixed by moving the conditional styling (styles.title(type, theme)) used here:

  const titleStyle = StyleSheet.flatten([
      styles.title(type, theme), // --> this would become buttonClearTitleStyle
      passedTitleStyle,
      disabled && styles.disabledTitle(theme),
      disabled && disabledTitleStyle,
    ]);

To a property in the theme object, therefore becoming a default buttonClearTitleStyle, that way we can extend that style and define a custom app styling leveraging the default theme provided by you

By now I have not found a way to do that type of customization other than copying and pasting the styles where I need them