<StreamCall call={call}>
<CallContent CallTopView={CustomCallTopView} /> {/* Removed */}
</StreamCall>1.4.0
Summary
We're excited to announce version 1.4.0 of our react-native library, bringing significant improvements and features. This update includes breaking changes, so please review the migration guide before upgrading.
✨ New Features
- Theme System Overhaul
- Added comprehensive theme support for:
- Button sizes
- Icon sizes
- Avatar sizes
- Font sizes
- Spacing sizes
- Border radius sizes
- Insets
- Introduced new color system (see Migration Guide)
- Added comprehensive theme support for:
- New Component
- Speech Indicator: Visual feedback for active speaker states
- Updated icons
- Mic, MicOff, Video, VideoSlash, CameraSwitch, Phone, PhoneDown, ScreenShare, StopScreenShare
- New default emojis
- 🤣 Rolling on the floor laughing
- 👍 Like
- 🚀 Rocket
- 👎 Dislike
- 🎉 Fireworks
- 🙌 Raised hands
- ✋ Raised hand
- Safe Area Improvements
- Added theme-based inset support for better safe area handling
- See our Safe Area Guide for implementation details
🔨 Enhancements
- Design updates for most of the components
🚨 Breaking Changes
- The following SDK components have been deprecated and removed:
- CallTopView.tsx
- ChatButton.tsx
- ParticipantsInfoBadge.tsx
CallTopView Removal
The CallTopView prop in CallContent component has been removed. Instead, you can now render your custom top view component as a sibling to CallContent. This provides more flexibility and better composition of UI elements.
Old Design with the deprecated CallTopView:
New Design without the CallTopView:
Before:
After:
<StreamCall call={call}>
<CustomCallTopView /> {/* Render as separate component */}
<CallContent />
</StreamCall>Colors migration guide
| Old | New |
|---|---|
| primary | primary or buttonPrimary or iconPrimary |
| error | iconWarning or buttonWarning |
| info | iconSuccess |
| static_black | sheetPrimary or iconPrimary |
| static_white | textPrimary or iconPrimary |
| static_grey | sheetPrimary or sheetSecondary or sheetTertiary |
| static_overlay | sheetOverlay |
| overlay | sheetOverlay |
| darkGray | sheetPrimary or sheetTertiary or buttonSecondary |
| disabled | sheetTertiary or buttonDisabled |
| bars | textPrimary |
| text_high_emphasis | textPrimary |
| text_low_emphasis | textSecondary |
| controls_bg | textPrimary |
| borders | primary or secondary |
| overlay_dark | sheetOverlay |
| content_bg | sheetPrimary |
| dark_gray | sheetPrimary |