-
Notifications
You must be signed in to change notification settings - Fork 2.9k
ThemeProvider: support V7 theme #14398
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
ThemeProvider: support V7 theme #14398
Conversation
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit fdda8e8:
|
Asset size changes
Baseline commit: 12b2fde208a5df3340a4538f93e9745a8d45e340 (build) |
3135e6e to
5f42a4d
Compare
Perf AnalysisNo significant results to display. All results
Perf Analysis (Fluent)Perf comparison
Perf tests with no regressions
|
ecffa5b to
9da2d93
Compare
9da2d93 to
6ebcd17
Compare
| theme={{ | ||
| semanticColors: { | ||
| primaryButtonBackground: '#FFF', | ||
| primaryButtonText: 'red', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
why is createTheme used elsewhere but not here?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
so ThemeProvider supports partial theme, but Customizer actually doesn't. If we see places i use createTheme, it's for creating a full theme to pass to Customizer. (This is an improvement for ThemeProvider compared to Customizer)
| import { PartialTheme } from '@fluentui/react-theme-provider'; | ||
|
|
||
| export const FluentTheme: Theme = { | ||
| export const FluentTheme: PartialTheme = { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
we should really consider renaming this package to @fluentui/storybook-addons or something that doesn't seem like a fork of storybook.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I agree, will take that as a follow-up!
55a1ba6 to
fdda8e8
Compare
|
🎉 Handy links: |
|
🎉 Handy links: |
|
🎉 Handy links: |
Pull request checklist
$ yarn changeDescription of changes
ITheme) toThemeProvidercomponentsprop inThemeto support passing component-level styles (similar to<Customizer scopeSettings={ Component: { styles: { // styles prop }}} />)ThemeProvidernow should be able to do everything theming-related thatCustomizercan doThemeProviderrespects global theme (fromloadThem) and theme withinCustomizerContext. All supported scenarios are covered by new screener tests inapps/vr-tests/src/stories/ThemeProvider.stories.tsx.Customizershimmer previously added inreact-next. We no longer need it for V8. For converged components (e.g. button),ThemeProviderwill be required for be functional. For all other V8 components (scoped to only contains FC changes, withoutscssconversion), currentCustomizeris sufficient.lib/compatinsidereact-theme-provider. We might need to havelib/nextlater based on work beyond v8.Upcoming
react-button: insidegetTokens, complete mappingThemetoTokenswhich are used by buttonsFocus areas to test
Screener tests inside
apps/vr-tests/src/stories/ThemeProvider.stories.tsx