Add aria-label attributes to indexed fields table, and use EuiIconTip #17427
Conversation
jen-huang
added
WIP
💔 Build Failed |
💔 Build Failed |
💚 Build Succeeded |
jen-huang
changed the title
| <EuiIconTip | ||
| type="clock" | ||
| color="primary" | ||
| aria-label="Info" |
There was a problem hiding this comment.
I would rather suggest using a short version of the description here as a label, like "Primary time field".
That way a screenreader would read out:
🗣️ Primary time field -pause- This field represents the time that events occurred.
vs:
🗣️ Info -pause- This field represents the time that events occurred.
That way a screen reader user once familiar to what the time field means, can immediately jump to the next element, once she heard "primary time field", instead of needing to wait for the long explanation.
There was a problem hiding this comment.
makes sense! updating
| <EuiIconTip | ||
| type="alert" | ||
| color="warning" | ||
| aria-label="Warning" |
There was a problem hiding this comment.
Same as above, I would suggest using something like "Multiple type field" instead of "Warning".
There was a problem hiding this comment.
makes sense! updating
💚 Build Succeeded |
…elastic#17427) * Add aria-label attributes to indexed fields table, and use EuiIconTip * Use EUI 0.0.35 * Add `Apache License, Version 2.0` to list
Fixes #17410
Fixes #17411
Improve accessibility of indexed fields table by adding
aria-labelto the boolean indicators (green dots), and replace<EuiToolTip><EuiIcon/></EuiToolTip>with<EuiIconTip/>.Bump EUI to 0.0.35 to support color prop for EuiIconTip.