From daeff64434e24e33182d9758816178a2ee8c6632 Mon Sep 17 00:00:00 2001
From: Rebecca Alpert <ralpert@redhat.com>
Date: Fri, 7 Feb 2025 11:43:48 -0500
Subject: [PATCH] fix(AttachButton): Hide input from screenreaders (#426)

There is a required input for react-dropzone. We should hide it from screenreaders since it's not something users can interact with.
---
 .../extensions/chatbot/examples/UI/ChatbotMessageBarAttach.tsx  | 2 +-
 .../extensions/chatbot/examples/demos/ChatbotAttachmentMenu.tsx | 2 +-
 packages/module/src/MessageBar/AttachButton.tsx                 | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotMessageBarAttach.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotMessageBarAttach.tsx
index 0a00d404..9046e5bd 100644
--- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotMessageBarAttach.tsx
+++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotMessageBarAttach.tsx
@@ -126,7 +126,7 @@ export const ChatbotMessageBarDefaultAttachExample: React.FunctionComponent = ()
   return (
     <>
       {/* this is required for react-dropzone to work in Safari and Firefox */}
-      <input {...getInputProps()} />
+      <input {...getInputProps()} hidden />
       <MessageBar
         onSendMessage={handleSend}
         attachMenuProps={{
diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotAttachmentMenu.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotAttachmentMenu.tsx
index 5467d567..a5abf095 100644
--- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotAttachmentMenu.tsx
+++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotAttachmentMenu.tsx
@@ -209,7 +209,7 @@ export const AttachmentMenuDemo: React.FunctionComponent = () => {
   return (
     <>
       {/* this is required for react-dropzone to work in Safari and Firefox */}
-      <input {...getInputProps()} />
+      <input {...getInputProps()} hidden />
       <ChatbotToggle
         tooltipLabel="Chatbot"
         isChatbotVisible={chatbotVisible}
diff --git a/packages/module/src/MessageBar/AttachButton.tsx b/packages/module/src/MessageBar/AttachButton.tsx
index 1f89be5b..f5275b7c 100644
--- a/packages/module/src/MessageBar/AttachButton.tsx
+++ b/packages/module/src/MessageBar/AttachButton.tsx
@@ -46,7 +46,7 @@ const AttachButtonBase: React.FunctionComponent<AttachButtonProps> = ({
   return (
     <>
       {/* this is required for react-dropzone to work in Safari and Firefox */}
-      <input data-testid={inputTestId} {...getInputProps()} />
+      <input data-testid={inputTestId} {...getInputProps()} hidden />
       <Tooltip
         id="pf-chatbot__tooltip--attach"
         content={tooltipContent}