Skip to content

Fix inactive Modal title bar contrast - #16434

Open
anuagragith wants to merge 2 commits into
microsoft:mainfrom
anuagragith:fix/modal-inactive-title-contrast
Open

Fix inactive Modal title bar contrast#16434
anuagragith wants to merge 2 commits into
microsoft:mainfrom
anuagragith:fix/modal-inactive-title-contrast

Conversation

@anuagragith

@anuagragith anuagragith commented Sep 8, 2026

Copy link
Copy Markdown
Contributor

Summary

Fixes ADO 63976889, where a native Modal title and close button had insufficient contrast after the Modal window became inactive.

Root cause

RNW PR #16108 introduced title-bar and DWM state resetting for Modal windows. The restored default inactive caption colors caused the title and close button to become difficult to read.

The previous attempted fix forced WM_NCACTIVATE to render the window as active. That incorrectly represented the window activation state.

Fix

  • Configure supported AppWindowTitleBar active, inactive, hover, and pressed colors.
  • Resolve colors from RNW's inherited light, dark, and high-contrast theme.
  • Precompose translucent semantic colors because title-bar APIs ignore alpha.
  • Update colors when the Windows theme changes at runtime.
  • Preserve the real active/inactive window state.
  • Prevent queued theme updates from applying after a Modal is unmounted or remounted.
  • Skip customization when the title bar is hidden or unsupported.

Validation

  • RNW formatting verification passed.
  • RNW lint passed.
  • RNW Debug x64 native build passed.
  • Patched RNW 0.85 native build passed.
  • Gallery Debug x64 build and deployment passed.
  • Manually validated active and inactive states in light, dark, and high-contrast modes.
  • Validated runtime theme switching while the Modal remained open.
Microsoft Reviewers: Open in CodeFlow

Anukrati Agrawal added 2 commits September 8, 2026 14:32
Use theme-aware AppWindowTitleBar colors for active and inactive Modal caption states while preserving true window activation and runtime theme updates.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

Copilot-Session: 8f4dac7d-4a14-4053-bd3b-a7cda2967006
@anuagragith
anuagragith requested a review from a team as a code owner September 8, 2026 23:11
Copilot AI balanced review requested due to automatic review settings September 8, 2026 23:11

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟡 Changes recommended

The newly inherited theme must be applied immediately when remounting an existing Modal.

Once you've addressed the issues Copilot identified, you can request another Copilot review.

Pull request overview

Fixes inactive native Modal title-bar contrast while preserving activation state and theme behavior.

Changes:

  • Adds theme-aware title-bar and caption-button colors.
  • Handles runtime theme changes and queued updates.
  • Adds a prerelease change record.
File summaries
File Description
vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.cpp Implements title-bar theming; remounts may retain stale colors until another theme event.
change/react-native-windows-580ee5e2-c630-4ce8-a1a3-14ee5a18a571.json Records the Modal contrast fix.
Review details
  • Files reviewed: 2/2 changed files
  • Comments generated: 1
  • Review effort level: Balanced

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Comment on lines +208 to +210
m_themeSource = winrt::make_weak(themeSource);
m_theme = themeSource.Theme();
const auto themeSubscriptionGeneration = m_themeSubscriptionGeneration;
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.

2 participants