Skip to content

fix(PointAnnotation): fix nested children not rendering on New Architecture (Fabric)#4231

Merged
mfazekas merged 2 commits into
mainfrom
fix/point-annotation-nested-children-new-arch
Jun 21, 2026
Merged

fix(PointAnnotation): fix nested children not rendering on New Architecture (Fabric)#4231
mfazekas merged 2 commits into
mainfrom
fix/point-annotation-nested-children-new-arch

Conversation

@mfazekas

Copy link
Copy Markdown
Contributor

Fixes #3682

In React Native's New Architecture (Fabric), a View inside PointAnnotation can get its children lifted up to become direct siblings in the native child list. This triggers the "supports max 1 subview other than a callout" error and causes the bitmap snapshot to only capture the empty outer View — nested content (e.g. Text labels) disappears.

Root cause: Fabric's view flattening optimization removes collapsable Views from the native hierarchy and reparents their children to the nearest non-flattened ancestor — in this case, PointAnnotation itself.

Fix: Wrap content children in a View collapsable={false} inside PointAnnotation.tsx. The native layer always sees exactly one content child regardless of how deeply the user nests views. Callout children are kept as direct native siblings (the native side identifies them by type).

Also removes the manual collapsable={false} workaround that was added to the PointAnnotationAnchors example — the library now handles this internally.

Reproducer (before fix)
<Mapbox.PointAnnotation id="test" coordinate={[0, 0]}>
  <View style={{ backgroundColor: 'blue', width: 50, height: 50 }}>
    <Text>label</Text>
  </View>
</Mapbox.PointAnnotation>

On RN 0.76+ with New Architecture: only the blue box renders, Text is missing, and the console logs PointAnnotation supports max 1 subview other than a callout.

…bric view flattening

In React Native's New Architecture (Fabric), a View inside PointAnnotation
can get its children lifted up to become direct siblings in the native child
list. This triggers the "supports max 1 subview" error and causes the bitmap
snapshot to miss nested children (text labels disappear, only the empty outer
View is captured).

Wrapping content children in a View with collapsable={false} prevents Fabric
from flattening the user's View, so the native layer always sees a single
content child regardless of nesting depth.

Also removes the manual collapsable={false} workaround from the
PointAnnotationAnchors example, since the library now handles it.

Fixes #3682
@mfazekas mfazekas merged commit 19ead7f into main Jun 21, 2026
7 checks passed
@mfazekas mfazekas deleted the fix/point-annotation-nested-children-new-arch branch June 21, 2026 11:53
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug]: PointAnnotation Throwing an Error with Nested Children on RN 0.76 with New Architecture

1 participant