[BUG] Custom components automatically switch to Chakra style instead of keeping default
mhamid3d opened this issue · comments
Description
I have a custom Option component, even if I just return a components.Option component, with no changes, the style is completely different. It's better visible in dark mode, I have provided a sandbox with 2 Select components, one with a custom Option, and another is just default Select. Check the colors of the Options when you hover and select, despite not changing anything related to the style, it seems to be picking on Chakra style colors.
I expected the style to remain the same unless I explicitly change it.
chakra-react-select Version
4.7.6
Link to Reproduction
https://codesandbox.io/s/chakra-react-select-chakrastyles-forked-qvmqkp?file=/app.tsx
TypeScript?
- Yes I use TypeScript
Steps to reproduce
- Go to '...'
- Click on '...'
- Scroll down to '...'
- See error
Operating System
- macOS
- Windows
- Linux
- iOS/iPadOS
- Android
Additional Information
No response
You need to import the components from chakraComponents, not components. components is the original components from react select.
https://codesandbox.io/s/chakra-react-select-chakrastyles-forked-5jv2pq?file=/app.tsx