Дизайн Артёма

2026-09-22 14:09:02 +03:00
parent cae64639bd
commit 8b12760dde
40 changed files with 3114 additions and 5008 deletions
@@ -110,7 +110,7 @@ export function createDropdownMenu({
        event.preventDefault();
        event.stopPropagation();
        if (button.disabled) return;
-        close();
+        close({ focusAnchor: true });
        await item.action?.();
      });
      menuEl.append(button);
@@ -154,6 +154,7 @@ export function createDropdownMenu({
    setAnchorOpen(true);
    onOpen?.();
    position();
+    menuEl.querySelector('button:not(:disabled)')?.focus();
  };

  const toggle = () => {
@@ -172,8 +173,19 @@ export function createDropdownMenu({
    close();
  };
  const onKeydown = (event) => {
-    if (event.key !== 'Escape' || !portal) return;
-    close({ focusAnchor: true });
+    if (!portal) return;
+    if (event.key === 'Escape' || event.key === 'Tab') {
+      if (event.key === 'Escape') event.preventDefault();
+      close({ focusAnchor: true });
+      return;
+    }
+    if (!['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) return;
+    const buttons = [...menuEl.querySelectorAll('button:not(:disabled)')];
+    if (!buttons.length) return;
+    event.preventDefault();
+    const index = buttons.indexOf(document.activeElement);
+    const next = event.key === 'Home' ? 0 : event.key === 'End' ? buttons.length - 1 : (index + (event.key === 'ArrowUp' ? -1 : 1) + buttons.length) % buttons.length;
+    buttons[next].focus();
  };
  const onNavigation = () => close();
  const onViewportChange = () => position();