a11y modal

assets/js/theme/design-system/modal.js

@@ -36,7 +36,8 @@ class Modal {
             if (event.keyCode === 27 || event.key === 'Escape') {
                 this.toggle(false);
             } else if (event.key === "Tab") {
-                this.innerFocus(event);
+                // TODO fix a11y inner focus
+                // this.innerFocus(event);
             }
         });
 
@@ -55,6 +56,7 @@ class Modal {
         const firstFocusable = focusableInDialog[0];
         const lastFocusable = focusableInDialog.at(-1);
 
+        console.log(firstFocusable, lastFocusable)
         if (!this.state.isOpened) {
             return;
         }
@@ -65,6 +67,8 @@ class Modal {
         else if (!this.element.contains(event.target)) {
             firstFocusable.focus();
         }
+
+        this.closeButtons[0].focus();
     }
 
     toggle(open = !this.state.isOpened) {

assets/sass/_theme/design-system/layout.sass

@@ -127,5 +127,6 @@ details
                 @include button-reset
                 @include icon-block(close, before)
                 position: absolute
+                padding: 0
                 right: 0
                 top: 0
\ No newline at end of file