callstack / callstack/react-native-paper
Button and IconButton TouchableRipple borderRadius is calculated from the icon size and not the button borderRadius
- Dominant language
- TypeScript
- Stars
- 14.5k
- Forks
- 2.2k
- Avg merge
- 5d 23h
- Merged PRs (30d)
- 12
Description
### Current behaviour
The `IconButton` component `TouchableRipple` `borderRadius` is calculated based on the icon size and the button padding.
https://github.com/callstack/react-native-paper/blob/8e5d12da0685fc5073fd930d4043131b1c472f8b/src/components/IconButton/IconButton.tsx#L150-L155
https://github.com/callstack/react-native-paper/blob/8e5d12da0685fc5073fd930d4043131b1c472f8b/src/components/IconButton/IconButton.tsx#L186
### Expected behaviour
The `borderRadius` for the `TouchableRipple` should match the `borderRadius` set for the button in `style`s and fill the button surface
### How to reproduce?
https://snack.expo.dev/@jahirfiquitiva/rnp-iconbutton-ripple
### Preview
### Alternative solution
Add a prop to customize the `TouchableRipple` `borderRadius`.
Contributor guide
Assessment
This issue has not been assessed yet.