0

I'm trying to use FluentUI Northstar for a React app for Microsoft Teams, but there does not seem to be a well-documented solution to work out what theme to apply, or how to respond when the user changes the theme.

As far as I can see, the theme is passed into the Provider, e.g.

<Provider theme={themes.teams}>...</Provider>

But while I could pass themes.teamsDark, for example, I am at a loss as to how to get this theme from Teams itself, or how to set up an onChange notification.

Is this possible, and (even better), is there any official MS documentation I have missed here?

Darren Oster
  • 9,146
  • 10
  • 48
  • 66

1 Answers1

2

To get notified of theme changes while your app/tab is in view you can use the microsoftTeams.registerOnThemeChangeHandler API documented here: https://learn.microsoft.com/en-us/microsoftteams/platform/tabs/how-to/access-teams-context#theme-change-handling

There is a useful community-built helper out there that can help you glue this all together: https://github.com/wictorwilen/msteams-react-base-component

Yuri Dogandjiev
  • 178
  • 1
  • 8