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

New/Updated Icon Glyphs & Tokens #7727

Merged
merged 3 commits into from
May 6, 2024
Merged

Conversation

MichaelMarcialis
Copy link
Contributor

@MichaelMarcialis MichaelMarcialis commented May 2, 2024

Summary

Added/updated the following new icon glyphs and tokens:

  • clickLeft (new)
  • clickRight (new)
  • clockCounter (new)
  • error (updated)
  • errorFilled (new)
  • warningFilled (new)
  • tokenDimension (new)
  • tokenMetricCounter (updated)
  • tokenMetricGauge (updated)

CleanShot 2024-05-02 at 16 15 49

Note that merging these changes and updating Kibana will cause all current usages of the error icon to received the updated unfilled version of the icon. Should any consumer wish to keep the filled version for whatever reason, they will need to update their icon type to the new errorFilled icon.

CCing @stratoula for use of clockCounter in elastic/kibana#180220.

CCing @dej611 for use of tokenDimension in #7232.

Closes #7232.

QA

  • Browser QA
    • Checked in both light and dark modes
    • Checked in Chrome, Safari, Edge, and Firefox
  • Docs site QA
  • Code quality checklist
  • Release checklist
    • A changelog entry exists and is marked appropriately.
  • Designer checklist
    • Updated the Figma library counterpart

@MichaelMarcialis MichaelMarcialis requested a review from a team as a code owner May 2, 2024 20:24
@stratoula
Copy link
Contributor

Ah looks nice Michael!

@cee-chen cee-chen enabled auto-merge (squash) May 6, 2024 02:23
@kibanamachine
Copy link

Preview staging links for this PR:

@cee-chen cee-chen merged commit f7b46ab into elastic:main May 6, 2024
5 checks passed
@elasticmachine
Copy link
Collaborator

💚 Build Succeeded

History

jbudz pushed a commit to elastic/kibana that referenced this pull request May 10, 2024
`v94.2.1-backport.0` ⏩ `v94.3.0`

_[Questions? Please see our Kibana upgrade
FAQ.](https://github.com/elastic/eui/blob/main/wiki/eui-team-processes/upgrading-kibana.md#faq-for-kibana-teams)_

---

## [`v94.3.0`](https://github.com/elastic/eui/releases/v94.3.0)

- Updated `launch` glyph for `EuiIcon`
([#7670](elastic/eui#7670))
- Updated `EuiComboBox`'s `options` to support including tooltip details
for selectable options. Use `toolTipContent` to render tooltip
information, and `toolTipProps` to optionally customize the tooltip
rendering behavior ([#7700](elastic/eui#7700))
- Updated the following existing glyphs in `EuiIcon`:
([#7727](elastic/eui#7727))
  - `error` (now an outlined version instead of filled) 
  - `tokenMetricCounter`
  - `tokenMetricGauge` 
- Added the following new glyphs to `EuiIcon`:
([#7727](elastic/eui#7727))
  - `tokenDimension`
  - `clickLeft`
  - `clickRight`
  - `clockCounter`
  - `errorFilled` (the previous `error` glyph design)
  - `warningFilled`

**Bug fixes**

- Fixed a visual layout bug for `EuiComboBox` with `isLoading` in mobile
views ([#7700](elastic/eui#7700))
- Fixed missing styles on header cells of `EuiDataGrid` that prevented
content text alignment styles to apply
([#7720](elastic/eui#7720))
- Fixed `EuiFlexGroup` and `EuiFlexItem` `ref` prop typing to support
refs of the same type as the passed `component` type and allow
`displayName` to be defined for easy component naming when using
component wrappers like `styled()`
([#7724](elastic/eui#7724))

---

Most of the code changes you'll see in this PR are caused by the recent
EuiFlex* changes making it generic. This, unfortunately, is something
that `styled()` doesn't always like. I replaced the failing usages of
`styled(EuiFlexGroup)` and `styled(EuiFlexItem)` to use `component` and
other native EuiFlex* props, resulting in the same output but being
better typed.

We plan to add more props to EuiFlex* components giving developers
control over properties like `flex-grow` and `flex-shring`, and reducing
the need for writing any custom CSS when using these components. This
should reduce the number of `styled()` wrappers needed even further

---------

Co-authored-by: kibanamachine <[email protected]>
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.

[EuiIcon] Add tokenDimension
5 participants