New [EuiLoaderLogo] and other loader updates#4835
Conversation
| if (icon) { | ||
| iconNode = ( | ||
| <> | ||
| {icon} | ||
| <EuiSpacer size="m" /> | ||
| </> | ||
| ); | ||
| } else if (iconType) { | ||
| iconNode = ( |
There was a problem hiding this comment.
This is the only major change (adding the icon prop) the rest just fixes the spacing.
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_4835/ |
1 similar comment
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_4835/ |
cchaos
added
the
deprecations
elizabetdev
left a comment
elizabetdev
left a comment
There was a problem hiding this comment.
LGTM! 🎉
Tested in Chrome, Safari, Edge, and Firefox.
| /** | ||
| * While this component should be restricted to using logo icons, it works with any IconType | ||
| */ | ||
| logo?: IconType; |
There was a problem hiding this comment.
Should the logo prop be required rather than optional? This would make consumers always question the right logo to use rather than just using the default.
There was a problem hiding this comment.
Good question. Let me check what happens if its required but has a default. Because the Kibana one might be ok and would be redundant if they have to supply it.
There was a problem hiding this comment.
Yeah, unfortunately, even with a default value TS complains.
thompsongl
left a comment
thompsongl
left a comment
There was a problem hiding this comment.
Just the one type change, otherwise LGTM.
FWIW, I'm ok with the logo prop being optional and having logoKibana as the default.
# Conflicts: # CHANGELOG.md
|
Whoops, sorry, forgot to push last week. Merging upstream now too. |
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_4835/ |
|
Erg, a11y issues stemming from the new example using EuiPageTemplate. I'll get that fixed then merge. |
In EuiPageTemplate when `centeredContent` and no sidebar
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_4835/ |
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_4835/ |
4 participants
EuiLoadingLogo
This essentially replaces the old EuiLoadingKibana (now set for deprecation) component with a more generic one that accepts a
logo: IconType.Pausing animations with
prefers-reduced-motionis onThere may be more ways to enhance these loaders when the animations have been turned off, but for now it is important that we just pause them while users have this setting turned on.
You can test this yourself on Mac using the feature in the Accessibility settings:
Updated text content loader color to be lighter
Closes #3472
[EuiEmptyPrompt] Added
iconprop passing a custom icon... And cleaned up spacing. I also updated the docs to present how this component can also be used for loading and error states, including how to use them with EuiPageTemplate.
Checklist
[ ] Checked for breaking changes and labeled appropriately[ ] Checked for accessibility including keyboard-only and screenreader modes([EuiLoading] Accessibility props #4814 has ideas to address a11y, should be a follow-up)