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.

Sign up for GitHub

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

Jump to bottom

[Infra] Migrate infra from styled-components to @emotion #202255

Closed
1 task done
MiriamAparicio opened this issue Nov 29, 2024 · 1 comment · Fixed by #202405
Closed
1 task done

[Infra] Migrate infra from styled-components to @emotion #202255

MiriamAparicio opened this issue Nov 29, 2024 · 1 comment · Fixed by #202405
Assignees
@MiriamAparicio
Labels
Team:obs-ux-infra_services Observability Infrastructure & Services User Experience Team v9.0.0

Comments

@MiriamAparicio
Copy link
Contributor

MiriamAparicio commented Nov 29, 2024 •
edited
Loading

Part of #200580

Summary

While working on the visual refresh for the new EUI theme Borealis we figured that was a good time to do the recommended migration from styled-components to @emotion
References for the migration

What need to be done

Guide for the migration

  • Add euiTheme globally to emotion.d.ts so it can be use out of the box with the migration
@MiriamAparicio MiriamAparicio added Team:obs-ux-infra_services Observability Infrastructure & Services User Experience Team v9.0.0 labels Nov 29, 2024
@elasticmachine
Copy link
Contributor

Pinging @elastic/obs-ux-infra_services-team (Team:obs-ux-infra_services)

@smith smith assigned smith and MiriamAparicio and unassigned smith Dec 2, 2024
This was referenced Dec 3, 2024
Merged
Closed
@crespocarlos crespocarlos changed the title [ObsUX] [POC] Migrate infra from styled-components to @emotion [Infra] Migrate infra from styled-components to @emotion Dec 12, 2024
CAWilson94 pushed a commit to CAWilson94/kibana that referenced this issue Dec 12, 2024
@MiriamAparicio @CAWilson94
[POC] Migrate infra from styled-components to @emotion (elastic#202405)
8878af6 
Closes elastic#202255

### Summary
While working on the visual refresh for the new EUI theme Borealis we
figured that was a good time to do the recommended migration from
styled-components to @emotion

### What has been done

- Migrate infra plugin from styled-components to @emotion
- Eui Visual Refresh for Borealis new theme
- All usage of color palette tokens and functions now pull from the
theme, and correctly update to use new colors when the theme changes
from Borealis to Amsterdam and vice versa
- All references to renamed tokens have been updated to use the new
token name
- Remove usage of deprecated `useEuiBackgroundColor`
- All usages of "success" colors have been updated to `accentSecondary`
and `textAccentSecondary` as needed


### How to test

#### Running Kibana with the Borealis theme
In order to run Kibana with Borealis, you'll need to do the following:

- Set the following in kibana.dev.yml:
`uiSettings.experimental.themeSwitcherEnabled: true`
- Run Kibana with the following environment variable set:
`KBN_OPTIMIZER_THEMES="borealislight,borealisdark,v8light,v8dark" yarn
start`
- This will expose a toggle under Stack Management > Advanced Settings >
Theme version, which you can use to toggle between Amsterdam and
Borealis.
@MiriamAparicio MiriamAparicio mentioned this issue Dec 18, 2024
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@MiriamAparicio MiriamAparicio

Labels
Team:obs-ux-infra_services Observability Infrastructure & Services User Experience Team v9.0.0
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

[Infra] Migrate infra from styled-components to @emotion MiriamAparicio/kibana
3 participants
@smith @elasticmachine @MiriamAparicio