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

Create a EuiBadgeGroup component #2871

Closed
cchaos opened this issue Feb 19, 2020 · 2 comments · Fixed by #2942
Closed

Create a EuiBadgeGroup component #2871

cchaos opened this issue Feb 19, 2020 · 2 comments · Fixed by #2942

Comments

@cchaos
Copy link
Contributor

cchaos commented Feb 19, 2020

Badges are kind of complicated when you start laying them out in flex groups because of truncation issues. I had to do a lot of custom styles in Kibana to get the global filter pills to wrap and truncate properly. Now we're having the same issue in Kibana Graph (elastic/kibana#57859).

We should just create EuiBadgeGroup that will handle the proper layout of multiple badges.

@cchaos
Copy link
Contributor Author

cchaos commented Feb 19, 2020

Part of the custom code in Kibana:

https://github.com/elastic/kibana/blob/0340fac14967d1e9b072517c4c09d64476b67d89/src/plugins/data/public/ui/filter_bar/_global_filter_item.scss#L1-L15

The component should probably allow altering similar properties to EuiFlexGroup like:

  • gutterSize
  • wrap

@anishagg17
Copy link
Contributor

@cchaos I want to work on this issue

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 a pull request may close this issue.

2 participants