ExtendTheme feature Compatibility

[picninim]

Hey @csandman ! I've being using your lib for all my projects that uses chakra :), and normally the UI design is always based on the "outlined" variant version of the all the components. But recently, I got a design where the "flushed" is the default style for most of the components, including selects and inputs, and I came across the following issue ( its not much of a issue lol ):

Chakra allows us to config the default theme using the extendTheme method, so if we want to use the input being flushed by default we can extend it, so we don't need to pass the variant="flushed" all the time.

import { extendTheme } from '@chakra-ui/react';

export const themeConfig = extendTheme({
  components: {
    Input: {
      defaultProps: {
        variant: 'flushed',
      },
    }
  }
});

So using the themeConfig, I can just call <Input /> and it will no longer be "outlined" by default, but "flushed".

But I checked that for the select component, there is a validation that if no variant props is passed, or if it is not on the listed variants if forces to be "outline".
So the real "issue": Using the extendTheme does not work properly with the select component, which enforces passing the variant even if that variant is already configured through the extendTheme feature.

I was wondering if you think that makes senses not to force the variant to be "outline" once is already what is in the Chakra Input default config, and make it compatible with the extedTheme feature of chakra.
If you think its a good idea, I will be happy to create a pull request for this update :)
But as I said, its not much of an issue, passing the variant prop every time we use the component is good enough for me :)

[csandman]

I'll start by saying, I'm glad you're getting good use out of this package! Always makes me happy to hear it 😁

I think this is a good idea, until now I hadn't considered much about the defaultProps option on the Chakra components configs. If you'd like to submit a PR I'll definitely consider it.

A couple of notes on how I think this should be implemented:

1. I think this should be handled entirely in the useChakraSelectProps hook, to keep all of the logic for it centralized. You'll want to remove the default arg I included for variant and then pull the default variant from the Chakra theme there instead.
2. I tinkered around with this for a bit to see if there were any caveats, and I noticed that this changes the styling for the DropdownIndicator component. To fix that, you should probably add the variant prop to the useMultiStyleConfig hook in that component to make everything consistent, something we probably should have done in the first place haha.

If you follow those guidelines, I'd be happy to accept a PR!

[csandman]

I can also do it if you want, up to you. I figured I'd give you the opportunity to first if you wanted.