github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

[a11y] Dashboard Details page missing aria-label (#215292)

Browse source 
## Summary

Replace EuiTooltip with EuiCallout to fix an a11y issue:
Title and Description fields are missing accessible label on Dashboard details
page
This commit is contained in:
Paulina Shakirova 2025-03-21 14:39:53 +01:00 • committed by GitHub
parent 9cf3bea759
commit a95d84d6ff
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 22 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

56
src/platform/packages/shared/content-management/content_editor/src/components/metadata_form.tsx
View file

@ -16,7 +16,7 @@ import {
EuiFormRow,
EuiSpacer,
EuiTextArea,
EuiToolTip,
EuiCallOut,
} from '@elastic/eui';
import { ContentEditorFlyoutWarningsCallOut } from './editor_flyout_warnings';
@ -61,7 +61,7 @@ export const MetadataForm: FC<React.PropsWithChildren<Props>> = ({
return (
<EuiForm isInvalid={isSubmitted && !isValid} error={getErrors()} data-test-subj="metadataForm">
<ContentEditorFlyoutWarningsCallOut warningMessages={getWarnings()} />
{isReadonly && <EuiCallOut size="s" title={readonlyReason} iconType="iInCircle" />}
<EuiFormRow
label={i18n.translate('contentManagement.contentEditor.metadataForm.nameInputLabel', {
defaultMessage: 'Name',
@ -70,22 +70,16 @@ export const MetadataForm: FC<React.PropsWithChildren<Props>> = ({
isInvalid={!isFormFieldValid(title)}
fullWidth
>
<EuiToolTip
position="top"
content={isReadonly ? readonlyReason : undefined}
display="block"
>
<EuiFieldText
isInvalid={!isFormFieldValid(title)}
value={title.value}
onChange={(e) => {
setTitle(e.target.value);
}}
fullWidth
data-test-subj="nameInput"
readOnly={isReadonly}
/>
</EuiToolTip>
<EuiFieldText
isInvalid={!isFormFieldValid(title)}
value={title.value}
onChange={(e) => {
setTitle(e.target.value);
}}
fullWidth
data-test-subj="nameInput"
readOnly={isReadonly}
/>
</EuiFormRow>
<EuiSpacer />
@ -101,22 +95,16 @@ export const MetadataForm: FC<React.PropsWithChildren<Props>> = ({
isInvalid={!isFormFieldValid(description)}
fullWidth
>
<EuiToolTip
position="top"
content={isReadonly ? readonlyReason : undefined}
display="block"
>
<EuiTextArea
isInvalid={!isFormFieldValid(description)}
value={description.value}
onChange={(e) => {
setDescription(e.target.value);
}}
fullWidth
data-test-subj="descriptionInput"
readOnly={isReadonly}
/>
</EuiToolTip>
<EuiTextArea
isInvalid={!isFormFieldValid(description)}
value={description.value}
onChange={(e) => {
setDescription(e.target.value);
}}
fullWidth
data-test-subj="descriptionInput"
readOnly={isReadonly}
/>
</EuiFormRow>
{TagList && isReadonly && tagsReferences.length > 0 && (