You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
docs: track react v14 reactions and icon changes (#3085)
### 🎯 Goal
Keep the internal React v14 migration trackers aligned with the latest
confirmed SDK changes so the public docs work stays grounded in
source-verified evidence.
### 🛠 Implementation details
- bump the audited SDK head to `241209e8`
- add `BC-058` for the removed reaction-detail comparator props/types
and the narrowed `MessageReactions` surface
- expand the icon migration bucket with the latest public icon renames
and selector/theming fallout
- reopen and then resolve the matching docs-plan items for the reactions
and icon/header follow-up pass
- point future mining at `241209e8..HEAD`
### 🎨 UI Changes
No screenshots. Tracker-only update.
### Linked work
- paired docs PR: docs-content PR for
`docs/react-v14-reactions-icons-followup`
### Validation
- `git diff --check`
Copy file name to clipboardExpand all lines: ai-docs/breaking-changes.md
+76-5Lines changed: 76 additions & 5 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,6 @@
1
1
# React v14 Breaking Changes
2
2
3
-
Last updated: 2026-03-28
3
+
Last updated: 2026-03-31
4
4
5
5
## Scope
6
6
@@ -13,8 +13,8 @@ This file tracks confirmed v13 to v14 breaking changes for `stream-chat-react`.
13
13
## Audit Reference
14
14
15
15
- Baseline tag: `v13.14.2`
16
-
- Current audited SDK head: `f06846da4d492c0fb9ca375ee049682e6f9e48ba` (`f06846da`, `2026-03-27`, `fix: clean up CSS build output (#3072)`)
17
-
- Future mining starting point: diff `f06846da4d492c0fb9ca375ee049682e6f9e48ba..HEAD` first, then compare any newly confirmed changes back to the original v13 baseline before adding them here
16
+
- Current audited SDK head: `241209e8059ce767fe5bc3500466aa73f53618e3` (`241209e8`, `2026-03-31`, `fix: use link icon for link-type attachments (#3083)`)
17
+
- Future mining starting point: diff `241209e8059ce767fe5bc3500466aa73f53618e3..HEAD` first, then compare any newly confirmed changes back to the original v13 baseline before adding them here
18
18
19
19
Only confirmed items should move from this file into the migration guide.
20
20
@@ -810,6 +810,8 @@ Only confirmed items should move from this file into the migration guide.
810
810
- User impact:
811
811
- imports using the removed helper utilities or standalone status/input icons no longer compile
812
812
- low-level customization patterns built on those exports need to move to the new `Icons` set, newer helper names, or higher-level components
813
+
- imports using the older pre-Phosphor icon constant names no longer compile
814
+
- custom CSS and snapshots that targeted icon-specific auto classes can break after the icon-catalog refresh
813
815
- Confirmed removed exports:
814
816
-`ActionsIcon`
815
817
-`CloseIcon`
@@ -827,6 +829,20 @@ Only confirmed items should move from this file into the migration guide.
-`f06846da:src/components/Icons/icons.tsx` still exported the older icon constant names such as `IconCrossMedium`, `IconPaperPlane`, `IconLayoutAlignLeft`, and `IconThunder`
-`src/components/index.ts:21` exports the shared `Icons` set
863
+
-`src/components/Icons/icons.tsx:408`, `:577`, `:626`, `:651`, `:831`, and `:849` now export `IconXmark`, `IconSidebar`, `IconVoice`, `IconSend`, `IconBolt`, and `IconDelete`
846
864
-`src/components/Message/MessageStatus.tsx:122` and `:138` render `IconCheckmark1Small` and `IconDoubleCheckmark1Small`
847
865
-`src/components/Threads/ThreadList/ThreadListItemUI.tsx:14` now builds thread previews around `SummarizedMessagePreview`
848
866
- Replacement:
849
867
- move emoji-only checks to `countEmojis()` / `messageTextHasEmojisOnly()`
850
868
- stop relying on `showMessageActionsBox()` / `shouldRenderMessageActions()` and instead customize the new `MessageActions` action-set flow
851
869
- replace direct icon imports with the public `Icons` components or with higher-level components like `MessageStatus`, `SendButton`, `MessageActions`, and thread preview components
870
+
- rename direct imports that still use the pre-Phosphor icon names
852
871
- if you used `attachmentTypeIconMap`, inline your own map or switch to the new thread preview components
853
872
- Evidence:
854
873
- current `MessageComposer/index.ts` and `Message/index.ts` still re-export their `icons.tsx` files, but the removed icon symbols are no longer present there
855
874
- current `MessageStatus` and thread-list UIs rely on the shared icon library and new summary components instead of the old standalone exports
875
+
- commit `30c1beeae feat(Icons): migrate SDK icons to Phosphor icon set (#3075)` renamed the remaining public icon constants and removed the unused icon catalog entries
876
+
- commit `9472f7b35 fix(Icons): sync icon catalog with refreshed Line SVGs (#3080)` completed the `IconLayoutAlignLeft` -> `IconSidebar` and `IconThunder` -> `IconBolt` rename sweep
### BC-024: `MessageInput` attachment preview customization changed, and voice recordings moved into a dedicated slot
@@ -1022,6 +1044,7 @@ Only confirmed items should move from this file into the migration guide.
1022
1044
- apps with custom CSS targeting old channel-list, channel-preview, thread-list, send-to-channel, or loading-placeholder DOM can lose styling after upgrading
1023
1045
- tests and accessibility hooks that relied on the old sidebar/list selection semantics (`aria-selected`) or `*-react` classnames can break
1024
1046
- snapshot and interaction tests that expected the old channel-preview action buttons or preview content layout can break
1047
+
- custom icon sizing and selector-based theming that assumed the old `16x16``BaseIcon` default or older `str-chat__icon--*` auto classes can break
1025
1048
- selector-based theming against internal wrappers needs an audit before release adoption
1026
1049
- teams should expect to rebalance custom theme work around the new tokenized styling layer
1027
1050
- Old API:
@@ -1046,16 +1069,19 @@ Only confirmed items should move from this file into the migration guide.
1046
1069
-`src/components/Loading/LoadingChannels.tsx:3` through `:25` now render loading placeholders with `str-chat__channel-preview-container` / `str-chat__channel-preview--loading`
1047
1070
-`src/components/MessageComposer/WithDragAndDropUpload.tsx:134` through `:165` now add `str-chat__dropzone-root` and `str-chat__dropzone-container__content` around the default drag-and-drop overlay
1048
1071
-`src/components/Message/MessageUI.tsx:275` through `:277` now render `str-chat__message-error-indicator` with the shared `ErrorBadge` instead of the removed `str-chat__message-error-icon` wrapper
1072
+
-`src/components/Icons/BaseIcon.tsx:6` now defaults to `viewBox='0 0 20 20'` instead of `0 0 16 16`
1049
1073
-`src/styling/index.scss:1` now assembles a new styling entrypoint, and `src/styling/variables.css:5` introduces a tokenized variable layer under `.str-chat`
1050
1074
- Replacement:
1051
1075
- audit custom CSS selectors against current rendered markup before upgrading
1052
1076
- prefer current component variables and current selectors over legacy internal wrappers
1053
1077
- re-test any layout code that styled the old header, sidebar/list, or message-input internals directly
1054
1078
- update selector-based tests that depended on `str-chat__channel-list-messenger-react__main`, old channel-preview DOM/action buttons, `aria-selected` sidebar items, or the older loading skeleton DOM
1055
1079
- update any selector-based styling or tests that relied on `str-chat__message-error-icon`; the default error badge now renders under `str-chat__message-error-indicator`
1080
+
- re-baseline custom icon CSS against the renamed `str-chat__icon--*` classes and the new default `20x20` icon box
1056
1081
- Evidence:
1057
1082
- the class structure changed across header, composer, avatar, channel-preview, sidebar/list, and loading surfaces
1058
1083
- the message-send error badge also switched from the removed `MessageErrorIcon` wrapper class to the new `str-chat__message-error-indicator`
1084
+
- the icon catalog refresh renamed several icon constants, which also changed their generated CSS class names
1059
1085
- current docs still contain stale selectors like `.str-chat__header-hamburger`, `.str-chat__channel-list-messenger-react__main`, and `aria-selected` thread-item examples
1060
1086
- v14 now ships a centralized styling/token layer alongside those markup changes
1061
1087
- Docs impact:
@@ -1956,10 +1982,9 @@ Only confirmed items should move from this file into the migration guide.
1956
1982
-`stream-chat-react/dist/css/index.layout.css`
1957
1983
- Replacement:
1958
1984
- remove the `/v2` segment from CSS import paths
1959
-
- if you import SCSS entrypoints, use the root `dist/scss/*` paths as well so examples stay aligned with the package exports
1960
1985
- Evidence:
1961
1986
- commit `f06846da fix: clean up CSS build output (#3072)` explicitly marks `stream-chat-react/dist/css/v2/*` imports as a breaking change
1962
-
- current `package.json` exports `./dist/css/*`, `./dist/scss/*`, `./css/*`, and `./scss/*`, with no `v2` subpath exports
1987
+
- current package exports styles from the root `dist/css/*` paths, with no `v2` subpath exports
1963
1988
- current build scripts output styles directly under `dist/css/*`
1964
1989
- Docs impact:
1965
1990
- migration guide
@@ -1968,6 +1993,49 @@ Only confirmed items should move from this file into the migration guide.
### BC-058: deprecated reaction-detail comparator props were removed from message, list, and reactions surfaces
1997
+
1998
+
- Status: confirmed
1999
+
- Area: reactions and message-list props
2000
+
- User impact:
2001
+
- TypeScript code passing `sortReactionDetails` no longer type-checks on `Message`, `MessageContext`, `MessageList`, `VirtualizedMessageList`, `MessageReactions`, or `MessageReactionsDetail`
2002
+
- imports of `ReactionDetailsComparator` no longer compile
2003
+
-`MessageReactions` no longer accepts the deprecated `reaction_counts` or direct `reactionOptions` props
2004
+
- custom reaction UIs that still pass `reactionOptions` straight into `MessageReactions` must move that configuration to `WithComponents` / `ComponentContext`
-`f06846da:src/components/MessageList/MessageList.tsx:503` and `src/components/MessageList/VirtualizedMessageList.tsx:90` still forwarded `sortReactionDetails`
2009
+
-`f06846da:src/components/Reactions/MessageReactions.tsx:39`, `:46`, and `:54` still accepted `reaction_counts`, `reactionOptions`, and `sortReactionDetails`
2010
+
-`f06846da:src/components/Reactions/MessageReactionsDetail.tsx:25` still accepted `sortReactionDetails?: ReactionDetailsComparator`
2011
+
-`f06846da:src/components/Reactions/hooks/useProcessReactions.tsx:12` through `:14` still accepted `reaction_counts` and `reactionOptions`
2012
+
-`f06846da:src/components/Reactions/types.ts:14` still exported `ReactionDetailsComparator`
2013
+
- New API:
2014
+
-`src/components/Message/types.ts:83` and `src/context/MessageContext.tsx:107` now expose `reactionDetailsSort?: ReactionSort`
2015
+
-`src/components/MessageList/MessageList.tsx:496` and `src/components/MessageList/VirtualizedMessageList.tsx:86` now forward `reactionDetailsSort`
2016
+
-`src/components/Reactions/MessageReactions.tsx:26` through `:40` accept `reaction_groups`, `reactionDetailsSort`, and the narrowed current props only
2017
+
-`src/components/Reactions/MessageReactionsDetail.tsx:19` through `:26` accept `reactionDetailsSort` and `reactionGroups`, with no `sort` / `sortReactionDetails` migration path
2018
+
-`src/components/Reactions/hooks/useProcessReactions.tsx:10` through `:13` now accept only `own_reactions`, `reaction_groups`, `reactions`, and `sortReactions`
2019
+
-`src/components/Reactions/types.ts` no longer exports `ReactionDetailsComparator`
2020
+
- Replacement:
2021
+
- replace `sortReactionDetails` with `reactionDetailsSort` and pass a server-side `ReactionSort` object instead of a client comparator
2022
+
- replace `reaction_counts` with `reaction_groups`
2023
+
- move `reactionOptions` configuration to `<WithComponents overrides={{ reactionOptions }}>`
2024
+
- update any custom `useProcessReactions` wrappers to the narrower parameter type
2025
+
- Evidence:
2026
+
- commit `a82bdcb20 fix: post-review MessageReactionsDetail adjustments (#3082)` explicitly removed the deprecated props and type export
2027
+
- current source keeps `reactionDetailsSort` as the supported sort customization path across message, list, and reactions surfaces
2028
+
- current `MessageReactions` reads `reactionOptions` from `ComponentContext`, not from its own props
@@ -1990,6 +2058,9 @@ Only confirmed items should move from this file into the migration guide.
1990
2058
-`MessageReactionsDetail` loading/toggle refinements (`cab3ffd3`): investigated; current source adds `MessageReactionsDetailLoadingIndicator`, allows toggling the selected reaction type back to `null`, and improves the unfiltered reactions view, but these are additive/current-behavior changes rather than a distinct migration bucket.
1991
2059
- audio/player, scrolling, and layout polish (`7914e516`, `91eba1b4`, `8d25ead3`, `55dd2e81`, `fdf0e155`, `221aa0d4`): investigated; these commits refine playback reset behavior, initial bottom-pinning, mobile-nav click detection, message-list width, reactions alignment, and voice-recording attachment layout, but they do not remove or rename a documented public API beyond the separately tracked `useChannelListContext()` signature cleanup.
1992
2060
- type-safety and stale-prop cleanup in tests (`277bc417`): investigated; this commit removes stale props from test fixtures and tightens mock typing, but it does not change the current public runtime API beyond what was already documented in earlier migration buckets.
2061
+
- link-type attachment preview icon swap (`241209e8`): investigated; current summarized-preview and latest-message preview UIs now use the shared link icon for link attachments, but this is a visual/current-behavior adjustment rather than a removed or renamed public API.
2062
+
- assorted UI/UX fixes (`6c06e043`, `a47981ff`, `3f093622`): investigated; Giphy editability, dialog layering, composer state restoration, centered headers, message-list width, and channel-list dialog-portal cleanup changed runtime behavior, but they did not introduce new removed exports or renamed public override surfaces beyond the separately tracked reactions and icon buckets.
2063
+
- example-app refreshes (`86ada37e`, `887a326a`): investigated; these only update example apps and do not change the public SDK surface.
0 commit comments