[Accordion] a11y not valid when content contains focusable elements

[titouanmathis]

When an accordion component has its content hidden, an aria-hidden="true" attribute is added to its container. If the content includes links, buttons or other focusable elements, testing tools such as Lighthouse or Axe will report an error as content hidden with aria-hidden="true" should not contain focusable elements.

Report from Lighthouse

More info here: https://dequeuniversity.com/rules/axe/4.4/aria-hidden-focus

This should be fixed by using hidden (which is the correct value) instead of invisible for the visibility CSS property of the container:

diff --git a/packages/ui/molecules/Accordion/AccordionItem.ts b/packages/ui/molecules/Accordion/AccordionItem.ts
index a0cf6a5..e55bed2 100644
--- a/packages/ui/molecules/Accordion/AccordionItem.ts
+++ b/packages/ui/molecules/Accordion/AccordionItem.ts
@@ -119,7 +119,7 @@ export class AccordionItem<T extends BaseProps = BaseProps> extends Base<
    * Update the refs' attributes according to the given type.
    */
   updateAttributes(isOpen:boolean) {
-    this.$refs.container.style.visibility = isOpen ? '' : 'invisible';
+    this.$refs.container.style.visibility = isOpen ? '' : 'hidden';
     this.$refs.container.style.height = isOpen ? '' : '0';
     this.$refs.content.setAttribute('aria-hidden', isOpen ? 'false' : 'true');
     this.$refs.btn.setAttribute('aria-expanded', isOpen ? 'true' : 'false');

Some tests might need to be done when adding transitions to the component.