From 947f0f8a157d0c9ce38d9b0ed925a8ea110da06a Mon Sep 17 00:00:00 2001 From: speshkar-c Date: Mon, 23 Jun 2025 16:16:49 +0530 Subject: [PATCH 1/3] fix: removed ariaDescribedby on conditionally joined ariadescribedBy --- src/components/Inputs/TextInput/TextInput.tsx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/src/components/Inputs/TextInput/TextInput.tsx b/src/components/Inputs/TextInput/TextInput.tsx index 7933b689e..40ef43ce6 100644 --- a/src/components/Inputs/TextInput/TextInput.tsx +++ b/src/components/Inputs/TextInput/TextInput.tsx @@ -131,10 +131,9 @@ export const TextInput: FC = React.forwardRef( } = useContext(FormItemInputContext); const mergedStatus = getMergedStatus(contextStatus, status); const ariaInvalid = ariaInvalidProp || mergedStatus === 'error'; - const ariaDescribedBy = - mergedStatus === 'error' - ? ariaDescribedByProp || errorMessageId - : undefined; + const ariaDescribedBy = [ariaDescribedByProp, errorMessageId] + .filter(Boolean) + .join(' '); // Needed for form error scroll-into-view by id const mergedFormItemInput: boolean = isFormItemInput || formItemInput; From ecc32d4d710cef05c4478bc9a1a4e6fa641bfba4 Mon Sep 17 00:00:00 2001 From: speshkar-c Date: Thu, 3 Jul 2025 15:36:58 +0530 Subject: [PATCH 2/3] fix: added props for aria-describedby and aria-labelledby --- src/components/Inputs/TextInput/TextInput.tsx | 7 ++++--- src/components/Upload/Upload.tsx | 13 ++++++++++++- src/components/Upload/Upload.types.tsx | 4 ++++ 3 files changed, 20 insertions(+), 4 deletions(-) diff --git a/src/components/Inputs/TextInput/TextInput.tsx b/src/components/Inputs/TextInput/TextInput.tsx index 200c3f23a..43725d965 100644 --- a/src/components/Inputs/TextInput/TextInput.tsx +++ b/src/components/Inputs/TextInput/TextInput.tsx @@ -132,9 +132,10 @@ export const TextInput: FC = React.forwardRef( } = useContext(FormItemInputContext); const mergedStatus = getMergedStatus(contextStatus, status); const ariaInvalid = ariaInvalidProp || mergedStatus === 'error'; - const ariaDescribedBy = [ariaDescribedByProp, errorMessageId] - .filter(Boolean) - .join(' '); + const ariaDescribedBy = + mergedStatus === 'error' + ? [ariaDescribedByProp, errorMessageId].filter(Boolean).join(' ') + : ariaDescribedByProp; // Needed for form error scroll-into-view by id const mergedFormItemInput: boolean = isFormItemInput || formItemInput; diff --git a/src/components/Upload/Upload.tsx b/src/components/Upload/Upload.tsx index 6884d53c3..cc3bb7e5d 100644 --- a/src/components/Upload/Upload.tsx +++ b/src/components/Upload/Upload.tsx @@ -47,6 +47,8 @@ const InternalUpload: React.ForwardRefRenderFunction = ( accept = '', acceptedFileTypesText: defaultAcceptedFileTypesText, action = '', + 'aria-describedby': ariaDescribedBy, + 'aria-labelledby': ariaLabelledBy, children, classNames, configContextProps = { @@ -92,6 +94,7 @@ const InternalUpload: React.ForwardRefRenderFunction = ( type = 'select', uploadErrorText: defaultUploadErrorText, uploadingText: defaultUploadingText, + ...rest } = props; const contextuallyDisabled: Disabled = useContext(DisabledContext); @@ -475,6 +478,7 @@ const InternalUpload: React.ForwardRefRenderFunction = ( onProgress, onSuccess, ...props, + ...rest, accept, action, beforeUpload: mergedBeforeUpload, @@ -577,6 +581,8 @@ const InternalUpload: React.ForwardRefRenderFunction = ( ); const renderButton = (): JSX.Element => (