[MM-63007][MM-63004][MM-63020][MM-63009][MM-63008] More accessibility fixes around Search (#31409)

* [MM-63008] Make collapse button on search bar an actual button

* [MM-63004][MM-63020] Convert search box to floating-ui, fix some of the roles and labels that were incorrect

* [MM-63009] Add radiogroup and radio roles to the search box types

* [MM-63007] Ensure search box reads out number of results with suggestion items

* Fix playwright tests

* PR feedback

* Remove floating ui overlay

* Remove unnecessary .first() by being more specific about the search box

---------

Co-authored-by: Mattermost Build <build@mattermost.com>

e2e-tests/cypress/tests/integration/channels/messaging/center_channel_rhs_overlap_spec.js

@@ -720,7 +720,7 @@ describe('Messaging', () => {
         cy.getLastPostId().then((postId) => {
             // # Search for the posted message
             cy.uiGetSearchContainer().click();
-            cy.uiGetSearchBox().should('be.visible').first().type(messageX).type('{enter}').wait(TIMEOUTS.HALF_SEC);
+            cy.uiGetSearchBox().should('be.visible').type(messageX).type('{enter}').wait(TIMEOUTS.HALF_SEC);
 
             // # Click on post dot menu so we can edit
             cy.clickPostDotMenu(postId, 'SEARCH');

e2e-tests/cypress/tests/integration/channels/messaging/channel_and_posts_links_spec.js

@@ -55,7 +55,7 @@ describe('Message permalink', () => {
 
         // # Search for a message in the current channel
         cy.uiGetSearchContainer().click();
-        cy.uiGetSearchBox().first().clear().type('in:town-square').wait(TIMEOUTS.HALF_SEC).type('{enter}{enter}');
+        cy.uiGetSearchBox().clear().type('in:town-square').wait(TIMEOUTS.HALF_SEC).type('{enter}{enter}');
 
         // # Jump to first permalink view (most recent message)
         cy.get('.search-item__jump').first().click();
@@ -73,7 +73,7 @@ describe('Message permalink', () => {
 
         // # Search for a message in the current channel
         cy.uiGetSearchContainer().click();
-        cy.uiGetSearchBox().first().clear().type('in:town-square').wait(TIMEOUTS.HALF_SEC).type('{enter}{enter}');
+        cy.uiGetSearchBox().clear().type('in:town-square').wait(TIMEOUTS.HALF_SEC).type('{enter}{enter}');
 
         // # Jump to first permalink view (most recent message)
         cy.get('.search-item__jump').first().click();

e2e-tests/cypress/tests/integration/channels/messaging/permalink_message_edit_spec.js

@@ -71,7 +71,7 @@ describe('Permalink message edit', () => {
 
             // # Find searchWord and verify edited post
             cy.uiGetSearchContainer().click();
-            cy.uiGetSearchBox().should('be.visible').first().type(searchWord).type('{enter}');
+            cy.uiGetSearchBox().should('be.visible').type(searchWord).type('{enter}');
             cy.get('.search-item__jump').first().click();
 
             // # Check if url include the permalink

e2e-tests/cypress/tests/integration/channels/messaging/post_pre_header_spec.js

@@ -187,7 +187,7 @@ describe('Post PreHeader', () => {
 
             // # Search for the channel.
             cy.uiGetSearchContainer().click();
-            cy.uiGetSearchBox().first().type('test both pinned and saved {enter}');
+            cy.uiGetSearchBox().type('test both pinned and saved {enter}');
 
             // * Check that the post pre-header has both pinned and saved links in RHS search results
             cy.get('#searchContainer').should('be.visible').within(() => {