diff --git a/documentation-site/components/yard/config/file-uploader.ts b/documentation-site/components/yard/config/file-uploader.ts index dc3d503e8a..29aefa69a5 100644 --- a/documentation-site/components/yard/config/file-uploader.ts +++ b/documentation-site/components/yard/config/file-uploader.ts @@ -86,6 +86,12 @@ const FileUploaderConfig: TConfig = { description: 'Name attribute.', hidden: true, }, + ['aria-describedby']: { + value: undefined, + type: PropTypes.String, + description: `Sets aria-describedby attribute.`, + hidden: true, + }, overrides: { value: undefined, type: PropTypes.Custom, diff --git a/src/file-uploader/file-uploader.js b/src/file-uploader/file-uploader.js index eb0ce8a89f..0e4e447982 100644 --- a/src/file-uploader/file-uploader.js +++ b/src/file-uploader/file-uploader.js @@ -182,6 +182,9 @@ function FileUploader(props: PropsT) { onClick={() => { props.onRetry && props.onRetry(); }} + aria-invalid={Boolean(props.errorMessage)} + aria-describedby={props['aria-describedby']} + aria-errormessage={props.errorMessage} overrides={{ BaseButton: { style: {outline: null, fontWeight: 'normal'}, @@ -196,6 +199,7 @@ function FileUploader(props: PropsT) { onClick={() => { props.onCancel && props.onCancel(); }} + aria-describedby={props['aria-describedby']} overrides={{ BaseButton: { style: {outline: null, fontWeight: 'normal'}, @@ -210,6 +214,9 @@ function FileUploader(props: PropsT) { mixed, preventDropOnDocument?: boolean, + 'aria-describedby'?: string, // Error message to be displayed errorMessage?: string,