elastic/kibana

[Detection Engine] EUI Chore - Remove usage of styled-components

Open

#211,119 opened on 2025年2月13日

GitHub で見る
 (5 comments) (0 reactions) (0 assignees)TypeScript (19,065 stars) (8,021 forks)batch import
EUI Visual RefreshTeam: SecuritySolutionTeam:Detection Engineeffort:lowgood first issuevalue:high

説明

Summary

As part of the recent EUI Refresh, many instances of our usage of styled-components were removed necessarily as they referenced either outdated or static EUI theme variables. However, there are still several (65, at the time of creating this issue) uses of styled-components that need to be updated.

Why?

The motivation is described well here. Essentially, we are moving toward @emotion for its ability to aggregate styles from multiple component levels, and we cannot use both styled-components and @emotion in the same file.

コントリビューターガイド

技術スタック
typescriptreact
領域
frontend
Issue 種別
refactor
難度新しい貢献者にとっての実装難度です。1 は非常に小さな変更、5 は専門的な作業です。
3
推定時間経験ある貢献者が調査、実装、テスト、pull request 準備にかけるおおよその時間範囲です。
1-2 days
活動状況Issue が今どれだけ取り組みやすいかを示します。新しい、活発、古い、ブロック中、またはメンテナー入力待ちなどです。
fresh
明確さ期待される変更、受け入れ条件、次の手順がどれだけ明確かを示します。
mostly clear
前提条件
ReactTypeScriptStyled components
初心者向け度初回貢献者にどれだけ取り組みやすいかを 1-100 で推定したスコアです。
50
調査方針
Identify all files in the Detection Engine plugin that use styled components. The issue mentions 65 instances, likely under x pack/plugins/security solution/public/detections/. For each, replace with @emotion's css prop or styled API following EUI migration patterns. Ensure styles render correctly and no regressions. Consult EUI migration guide and existing examples in Kibana.
[Detection Engine] EUI Chore - Remove usage of styled-components · elastic/kibana#211119 | Good First Issue