GeekyAnts / GeekyAnts/NativeBase
Cannot pass `startIcon` to custom `Button` variant
- Dominant language
- TypeScript
- Stars
- 20.4k
- Forks
- 2.4k
- PR merge metrics
- No merged PRs in 30d
Description
### Description
I expect that using the `startIcon` prop, I can define a button variant that has a specific icon by default
### CodeSandbox/Snack link
https://snack.expo.dev/@localjo/ec312b
### Steps to reproduce
Try to create a custom button variant with an icon:
```
Button: {
variants: {
mine: {
bg: 'red.500',
_icon: { // Not working
as: Feather,
name: 'check',
color: 'white',
size: 'sm',
},
startIcon: { // Not working
as: Feather,
name: 'check',
color: 'white',
size: 'sm',
},
_startIcon: { // Not working
as: Feather,
name: 'check',
color: 'white',
size: 'sm',
},
},
},
},
```
The button will render with no icon. (see Snack)
### NativeBase Version
3.4.25
### Platform
- [ ] Android
- [ ] CRA
- [X] Expo
- [ ] iOS
- [ ] Next
### Other Platform
_No response_
### Additional Information
Adding a custom `_icon` to an `IconButton` variant works fine, so I would expect it to work here too. May be related to #5369
Contributor guide
Research direction
Start with the linked Expo Snack and reproduce the custom Button variant using startIcon, _startIcon, and _icon. Trace how Button variants handle icon configuration, then verify that the chosen icon renders with the configured Feather properties in the Snack.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native, typescript
- Domain
- frontend, mobile
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100