-
-
Notifications
You must be signed in to change notification settings - Fork 2.2k
Description
Current behaviour
When dismissing a Dialog (via any method — Cancel button inside Dialog.Actions, swipe-back gesture, or tapping outside the dialog), React Native 0.81 (with React 19.1.0) throws the following console error:
Invalid prop compact
supplied to React.Fragment
.
React.Fragment can only have key
and children
props.
Expected behaviour
Dismissing a Dialog should not cause console errors. Props like compact should not be passed to React.Fragment.
How to reproduce?
-
Create a Dialog with Dialog.Actions containing two Buttons, e.g.:
`
`
<Dialog.Title>Title</Dialog.Title>
<Dialog.Content>
Message
</Dialog.Content>
<Dialog.Actions>
<>
Cancel
OK
</>
</Dialog.Actions> -
Open the dialog.
-
Dismiss the dialog by:
- Pressing the Cancel button
- Swiping back (Android)
- Tapping outside the dialog container
- Observe the console error.
Preview
Console error log on dismiss:
console.js:661 Invalid prop compact
supplied to React.Fragment
.
React.Fragment can only have key
and children
props.
What have you tried so far?
- Replaced <>...</> with <View style={{ flexDirection: 'row' }}>... → fixes the issue.
- Verified no compact prop is explicitly passed from my code.
- Confirmed that error appears only after upgrading to React Native 0.81.0 (React 19.1.0).
- Tried using React.Fragment explicitly → same error.
- This suggests Dialog.Actions is injecting compact into children.
Your Environment
software | version |
---|---|
ios | x |
android | 10 |
react-native | 0.81.0 |
react-native-paper | ^5.13.1 |
node | 22.11.0 |
npm or yarn | 1.22.22(yarn) |
expo sdk | Not using Expo(using rn-cli) |