Skip to content
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

[useEuiTheme] Update colorMode return types #5639

Merged
merged 5 commits into from
Feb 15, 2022

Conversation

thompsongl
Copy link
Contributor

@thompsongl thompsongl commented Feb 15, 2022

Summary

The accepted input and expected output values are (intentionally) different for colorMode values. inverse is an acceptable input value, but the output value accessible via useEuiTheme is the processed version of light or dark for consumer understanding.
The two types were incorrectly conflated and overly permissive. Now the consumer values will always be either light or dark, which will simplify creating component styles that take advantage of color mode switching.

Also note the change in EuiThemeColorMode that removes string as an option, instead adding the convenience lowercase versions of LIGHT, DARK, and INVERSE. We had left the door open for custom color modes, which flat out will not work with the light/dark concept foundational to EUI components. This is kind of a breaking change, but is more of bugfix in that attempting to use something like <EuiThemeProvider colorMode="custom" /> would break global styles.

All of this becomes more clear if reviewed alongside upcoming changes in #4575.

Checklist

  • Check against all themes for compatibility in both light and dark modes
  • Added or updated jest and cypress tests
  • Checked for breaking changes and labeled appropriately
  • A changelog entry exists and is marked appropriately

@kibanamachine
Copy link

Preview documentation changes for this PR: https://eui.elastic.co/pr_5639/

@thompsongl thompsongl marked this pull request as ready for review February 15, 2022 19:16
Copy link
Contributor

@chandlerprall chandlerprall left a comment

Choose a reason for hiding this comment

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

Changes LGTM

This is kind of a breaking change, but is more of bugfix in that attempting to use something like <EuiThemeProvider colorMode="custom" /> would break global styles.

👍

@kibanamachine
Copy link

Preview documentation changes for this PR: https://eui.elastic.co/pr_5639/

1 similar comment
@kibanamachine
Copy link

Preview documentation changes for this PR: https://eui.elastic.co/pr_5639/

@thompsongl thompsongl enabled auto-merge (squash) February 15, 2022 21:17
@thompsongl thompsongl merged commit ff4d306 into elastic:main Feb 15, 2022
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.

3 participants