@foxford/navigation-ui 1.0.1 → 1.1.0

package/header/atoms/user-profile/index.js

@@ -1,5 +1,25 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import { Text } from "@foxford/ui";
 import { Root, Avatar, Content, Name, UserName, Chevron } from "./styled.js";
+import { buttonProps } from "../../../shared/a11y.js";
 import { SELECTOR_IDS } from "../../../shared/constants.js";
 import { jsxs, jsx } from "preact/jsx-runtime";
 function UserProfile({
@@ -9,37 +29,42 @@ function UserProfile({
   onClick,
   role
 }) {
-  return jsxs(Root, {
-    id: SELECTOR_IDS.TOP_MENU_PROFILE,
-    onClick,
-    children: [jsx(Avatar, {
-      preset: "brand",
-      size: "l",
-      src: avatarUrl,
-      text: name
-    }), jsxs(Content, {
-      children: [jsxs(Name, {
-        children: [jsx(UserName, {
-          lineHeight: "s",
-          size: 14,
-          weight: "bold",
-          whiteSpace: "nowrap",
-          children: name
-        }), jsx(Text, {
-          color: "content-onmain-secondary",
-          lineHeight: "s",
-          size: 12,
-          whiteSpace: "nowrap",
-          children: role
+  return (
+    // Кнопка раскрытия меню профиля: без роли и `tabIndex` до неё не дойти с клавиатуры.
+    jsxs(Root, __spreadProps(__spreadValues({
+      "aria-expanded": active,
+      id: SELECTOR_IDS.TOP_MENU_PROFILE,
+      onClick
+    }, buttonProps(onClick)), {
+      children: [jsx(Avatar, {
+        preset: "brand",
+        size: "l",
+        src: avatarUrl,
+        text: name
+      }), jsxs(Content, {
+        children: [jsxs(Name, {
+          children: [jsx(UserName, {
+            lineHeight: "s",
+            size: 14,
+            weight: "bold",
+            whiteSpace: "nowrap",
+            children: name
+          }), jsx(Text, {
+            color: "content-onmain-secondary",
+            lineHeight: "s",
+            size: 12,
+            whiteSpace: "nowrap",
+            children: role
+          })]
+        }), jsx(Chevron, {
+          marginLeft: 8,
+          name: "chevronUp",
+          rotate: active ? "0deg" : "-180deg",
+          size: 12
         })]
-      }), jsx(Chevron, {
-        marginLeft: 8,
-        name: "chevronUp",
-        rotate: active ? "0deg" : "-180deg",
-        size: 12
       })]
-    })]
-  });
+    }))
+  );
 }
 export {
   UserProfile

package/header/molecules/cart-button/index.d.ts

@@ -5,5 +5,7 @@ export interface CartButtonProps {
     onClick?: () => void;
     showText?: boolean;
 }
+/** Имя корзины для скринридера: точка-маркер на ней значит «есть товары», а не «новое». */
+export declare function cartLabel(title: string, count: number): string;
 export declare function CartButton({ active, cartItemsCount, filled, onClick, showText, }: CartButtonProps): import("preact").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/header/molecules/cart-button/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/cart-button/index.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,eAAe;IAC9B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,wBAAgB,UAAU,CAAC,EACzB,MAAc,EACd,cAAkB,EAClB,MAAc,EACd,OAAO,EACP,QAAgB,GACjB,EAAE,eAAe,gCAcjB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/cart-button/index.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,eAAe;IAC9B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,2FAA2F;AAC3F,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAE9D;AAED,wBAAgB,UAAU,CAAC,EACzB,MAAc,EACd,cAAkB,EAClB,MAAc,EACd,OAAO,EACP,QAAgB,GACjB,EAAE,eAAe,gCAejB"}

package/header/molecules/cart-button/index.js

@@ -1,6 +1,9 @@
 import { Cart } from "./styled.js";
 import { SELECTOR_IDS } from "../../../shared/constants.js";
 import { jsx } from "preact/jsx-runtime";
+function cartLabel(title, count) {
+  return count > 0 ? `${title}, товаров: ${String(count)}` : title;
+}
 function CartButton({
   active = false,
   cartItemsCount = 0,
@@ -11,6 +14,7 @@ function CartButton({
   return jsx(Cart, {
     active,
     $filled: filled,
+    "aria-label": cartLabel("Корзина", cartItemsCount),
     hideTextInMobile: true,
     icon: "cart",
     id: SELECTOR_IDS.TOP_MENU_CART,
@@ -21,5 +25,6 @@ function CartButton({
   });
 }
 export {
-  CartButton
+  CartButton,
+  cartLabel
 };

package/header/molecules/container/index.d.ts

@@ -7,9 +7,11 @@ export interface NavigationContainerProps {
     children: ReactNode;
     /** Влияет на броню высоты до замера: одноклик-меню — это ещё одна строка шапки. */
     hasOneClickMenu?: boolean;
+    /** Объявить контейнер ориентиром `banner` — см. `NavigationProps.landmarks`. */
+    landmark?: boolean;
     /** Клик по затемнению закрывает открытое меню — как в легаси. */
     onBackgroundClick?: () => void;
     showBackground: boolean;
 }
-export declare function Container({ aboveMenu, belowMenu, children, hasOneClickMenu, onBackgroundClick, showBackground, }: NavigationContainerProps): import("preact").JSX.Element;
+export declare function Container({ aboveMenu, belowMenu, children, hasOneClickMenu, landmark, onBackgroundClick, showBackground, }: NavigationContainerProps): import("preact").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/header/molecules/container/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/container/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,MAAM,WAAW,wBAAwB;IACvC,iFAAiF;IACjF,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,qBAAqB;IACrB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,QAAQ,EAAE,SAAS,CAAA;IACnB,mFAAmF;IACnF,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,iEAAiE;IACjE,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC9B,cAAc,EAAE,OAAO,CAAA;CACxB;AAED,wBAAgB,SAAS,CAAC,EACxB,SAAS,EACT,SAAS,EACT,QAAQ,EACR,eAAuB,EACvB,iBAAiB,EACjB,cAAc,GACf,EAAE,wBAAwB,gCAwC1B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/container/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,MAAM,WAAW,wBAAwB;IACvC,iFAAiF;IACjF,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,qBAAqB;IACrB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,QAAQ,EAAE,SAAS,CAAA;IACnB,mFAAmF;IACnF,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iEAAiE;IACjE,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC9B,cAAc,EAAE,OAAO,CAAA;CACxB;AAED,wBAAgB,SAAS,CAAC,EACxB,SAAS,EACT,SAAS,EACT,QAAQ,EACR,eAAuB,EACvB,QAAgB,EAChB,iBAAiB,EACjB,cAAc,GACf,EAAE,wBAAwB,gCAyC1B"}

package/header/molecules/container/index.js

@@ -7,6 +7,7 @@ function Container({
   belowMenu,
   children,
   hasOneClickMenu = false,
+  landmark = false,
   onBackgroundClick,
   showBackground
 }) {
@@ -26,6 +27,7 @@ function Container({
     $showBackground: showBackground,
     $underlayHeight: underlayHeight,
     id: SELECTOR_IDS.NAVIGATION,
+    role: landmark ? "banner" : void 0,
     onClick: (event) => {
       if (showBackground && event.target === event.currentTarget) onBackgroundClick == null ? void 0 : onBackgroundClick();
     },

package/header/molecules/externat-buttons/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/externat-buttons/index.tsx"],"names":[],"mappings":"AAUA,MAAM,WAAW,oBAAoB;IACnC,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAA;CAC/B;AAED,wBAAgB,eAAe,CAAC,EAC9B,cAAc,EACd,MAAc,EACd,eAAe,EACf,iBAAiB,GAClB,EAAE,oBAAoB,gCA0BtB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/externat-buttons/index.tsx"],"names":[],"mappings":"AAWA,MAAM,WAAW,oBAAoB;IACnC,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAA;CAC/B;AAED,wBAAgB,eAAe,CAAC,EAC9B,cAAc,EACd,MAAc,EACd,eAAe,EACf,iBAAiB,GAClB,EAAE,oBAAoB,gCA8BtB"}

package/header/molecules/externat-buttons/index.js

@@ -1,4 +1,24 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import { ExternatButtonsMobile, DesktopOnlyButton, CallBackButtonMobile, FreeAccessButtonMobile, ExternatButtonsDesktop, CallBackButtonDesktop, FreeAccessButtonDesktop } from "./styled.js";
+import { buttonProps } from "../../../shared/a11y.js";
 import { jsxs, jsx } from "preact/jsx-runtime";
 function ExternatButtons({
   freeAccessLink,
@@ -9,10 +29,11 @@ function ExternatButtons({
   if (mobile) {
     return jsxs(ExternatButtonsMobile, {
       children: [jsx(DesktopOnlyButton, {
-        children: jsx(CallBackButtonMobile, {
-          onClick: onCallbackClick,
+        children: jsx(CallBackButtonMobile, __spreadProps(__spreadValues({
+          onClick: onCallbackClick
+        }, buttonProps(onCallbackClick)), {
           children: "Обратный звонок"
-        })
+        }))
       }), freeAccessLink && jsx(FreeAccessButtonMobile, {
         href: freeAccessLink,
         onClick: onFreeAccessClick,
@@ -21,10 +42,11 @@ function ExternatButtons({
     });
   }
   return jsxs(ExternatButtonsDesktop, {
-    children: [jsx(CallBackButtonDesktop, {
-      onClick: onCallbackClick,
+    children: [jsx(CallBackButtonDesktop, __spreadProps(__spreadValues({
+      onClick: onCallbackClick
+    }, buttonProps(onCallbackClick)), {
       children: "Обратный звонок"
-    }), freeAccessLink && jsx(FreeAccessButtonDesktop, {
+    })), freeAccessLink && jsx(FreeAccessButtonDesktop, {
       href: freeAccessLink,
       onClick: onFreeAccessClick,
       children: "Бесплатный доступ"

package/header/molecules/menu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/menu/index.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,QAAQ,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AACtE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAErD,MAAM,WAAW,SAAS;IACxB,UAAU,EAAE,eAAe,CAAA;IAC3B,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC9B,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IAC7C,IAAI,EAAE,OAAO,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,EAAE,WAAW,EAAE,CAAA;IACvB,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAA;CAC1B;AAKD,wBAAgB,IAAI,CAAC,EACnB,UAAU,EACV,uBAA+B,EAC/B,OAAe,EACf,OAAO,EACP,iBAAiB,EACjB,kBAAkB,EAClB,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,SAAgB,GACjB,EAAE,SAAS,gCA8HX;AAED,YAAY,EAAE,QAAQ,EAAE,gBAAgB,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/menu/index.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,QAAQ,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AACtE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAErD,MAAM,WAAW,SAAS;IACxB,UAAU,EAAE,eAAe,CAAA;IAC3B,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC9B,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IAC7C,IAAI,EAAE,OAAO,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,EAAE,WAAW,EAAE,CAAA;IACvB,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAA;CAC1B;AAQD,wBAAgB,IAAI,CAAC,EACnB,UAAU,EACV,uBAA+B,EAC/B,OAAe,EACf,OAAO,EACP,iBAAiB,EACjB,kBAAkB,EAClB,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,SAAgB,GACjB,EAAE,SAAS,gCAoJX;AAED,YAAY,EAAE,QAAQ,EAAE,gBAAgB,EAAE,WAAW,EAAE,CAAA"}

package/header/molecules/menu/index.js

@@ -19,6 +19,7 @@ import { Media, Spinner } from "@foxford/ui";
 import { Root, Inner, Top, Logo, Sidebar } from "./panel-styled.js";
 import { SegmentContent } from "./segment-content.js";
 import { BodyScrollLock, SpinnerWrapper, Content, ContentControl, SegmentPane, Bottom } from "./styled.js";
+import { useReturnFocus, useFocusOnKeyboardOpen, segmentPaneId } from "../../../shared/a11y.js";
 import { SELECTOR_IDS } from "../../../shared/constants.js";
 import { BackButton } from "../../atoms/back-button/index.js";
 import { CloseButton } from "../../atoms/close-button/index.js";
@@ -27,6 +28,7 @@ import { AdaptiveButton } from "../adaptive-button/index.js";
 import { EntryPanel } from "../entry-panel/index.js";
 import { SegmentList } from "../segment-list/index.js";
 import { jsx, jsxs, Fragment } from "preact/jsx-runtime";
+const FIRST_SEGMENT = `#${SELECTOR_IDS.SEGMENT_LIST} [role="button"]`;
 function Menu({
   entryPanel,
   isOnboardingButtonShown = false,
@@ -43,6 +45,8 @@ function Menu({
   const [selectedSegmentId, setSelectedSegmentId] = useState(void 0);
   const [wasOpen, setWasOpen] = useState(open);
   const [measuredTop, setMeasuredTop] = useState(null);
+  useReturnFocus(open, SELECTOR_IDS.MENU, SELECTOR_IDS.MENU_BUTTON);
+  useFocusOnKeyboardOpen(open, SELECTOR_IDS.MENU_BUTTON, FIRST_SEGMENT);
   if (open !== wasOpen) {
     setWasOpen(open);
     if (!open) {
@@ -82,81 +86,97 @@ function Menu({
     document.addEventListener("keydown", onKeyDown);
     return () => document.removeEventListener("keydown", onKeyDown);
   }, [open, onClose]);
-  return jsx(Root, {
-    $isMenuOpen: open,
-    $isOnboardingButtonShown: isOnboardingButtonShown,
-    $top: topOffset != null ? topOffset : measuredTop,
-    children: jsxs(Inner, {
+  return (
+    // Большое меню — ориентир `navigation`: закрытое оно спрятано `visibility: hidden`, и
+    // скринридер его вместе с ориентиром не видит, а открытое — видит сразу по имени.
+    jsx(Root, {
       $isMenuOpen: open,
-      children: [jsx(Media, {
-        max: "S",
-        children: jsx(Fragment, {
-          children: open && jsxs(Fragment, {
-            children: [jsx(BodyScrollLock, {}), jsxs(Top, {
-              children: [jsx(Logo, {
-                origin
-              }), jsx(EntryPanel, __spreadValues({}, entryPanel))]
-            })]
-          })
-        })
-      }), loading ? jsx(SpinnerWrapper, {
+      $isOnboardingButtonShown: isOnboardingButtonShown,
+      $top: topOffset != null ? topOffset : measuredTop,
+      "aria-label": "Меню",
+      id: SELECTOR_IDS.MENU,
+      role: "navigation",
+      children: jsxs(Inner, {
         $isMenuOpen: open,
-        children: jsx(Spinner, {
-          size: "l"
-        })
-      }) : jsxs(Fragment, {
-        children: [jsx(Sidebar, {
+        children: [jsx(Media, {
+          max: "S",
+          children: jsx(Fragment, {
+            children: open && jsxs(Fragment, {
+              children: [jsx(BodyScrollLock, {}), jsxs(Top, {
+                children: [jsx(Logo, {
+                  origin
+                }), jsx(EntryPanel, __spreadValues({}, entryPanel))]
+              })]
+            })
+          })
+        }), loading ? jsx(SpinnerWrapper, {
           $isMenuOpen: open,
-          $showSeparator: contentOpen || selectedSegmentId !== void 0,
-          children: jsxs(Scrollbar, {
-            children: [jsx(SegmentList, {
-              onSelect: handleSegmentSelect,
-              segments,
-              selectedSegmentId
-            }), jsx(Media, {
-              min: "M",
+          "aria-label": "Меню загружается",
+          role: "status",
+          children: jsx(Spinner, {
+            size: "l"
+          })
+        }) : jsxs(Fragment, {
+          children: [jsx(Sidebar, {
+            $isMenuOpen: open,
+            $showSeparator: contentOpen || selectedSegmentId !== void 0,
+            children: jsxs(Scrollbar, {
+              children: [jsx(SegmentList, {
+                onSelect: handleSegmentSelect,
+                segments,
+                selectedSegmentId
+              }), jsx(Media, {
+                min: "M",
+                children: jsx(AdaptiveButton, {
+                  onOnboardingClick,
+                  show: isOnboardingButtonShown
+                })
+              })]
+            })
+          }), jsxs(Content, {
+            $isOpen: contentOpen,
+            children: [jsx(Media, {
+              max: "M",
+              children: jsxs(ContentControl, {
+                children: [jsx(BackButton, {
+                  onClick: handleBack
+                }), jsx(Media, {
+                  max: "S",
+                  children: jsx(EntryPanel, __spreadValues({}, entryPanel))
+                })]
+              })
+            }), segments.map((segment) => (
+              // Панель — цель `aria-controls` кнопки сегмента. Невыбранные спрятаны
+              // `display: none`, а значит и для скринридера их нет.
+              jsx(SegmentPane, {
+                $hidden: segment.id !== selectedSegmentId,
+                "aria-label": segment.title,
+                id: segmentPaneId(segment.id),
+                role: "region",
+                children: jsx(SegmentContent, {
+                  onItemClick: onSegmentItemClick,
+                  segment
+                })
+              }, segment.id)
+            ))]
+          })]
+        }), jsx(Media, {
+          max: "S",
+          children: jsxs(Bottom, {
+            children: [jsx(Media, {
+              max: "XS",
               children: jsx(AdaptiveButton, {
                 onOnboardingClick,
                 show: isOnboardingButtonShown
               })
+            }), jsx(CloseButton, {
+              onClick: onClose
             })]
           })
-        }), jsxs(Content, {
-          $isOpen: contentOpen,
-          children: [jsx(Media, {
-            max: "M",
-            children: jsxs(ContentControl, {
-              children: [jsx(BackButton, {
-                onClick: handleBack
-              }), jsx(Media, {
-                max: "S",
-                children: jsx(EntryPanel, __spreadValues({}, entryPanel))
-              })]
-            })
-          }), segments.map((segment) => jsx(SegmentPane, {
-            $hidden: segment.id !== selectedSegmentId,
-            children: jsx(SegmentContent, {
-              onItemClick: onSegmentItemClick,
-              segment
-            })
-          }, segment.id))]
         })]
-      }), jsx(Media, {
-        max: "S",
-        children: jsxs(Bottom, {
-          children: [jsx(Media, {
-            max: "XS",
-            children: jsx(AdaptiveButton, {
-              onOnboardingClick,
-              show: isOnboardingButtonShown
-            })
-          }), jsx(CloseButton, {
-            onClick: onClose
-          })]
-        })
-      })]
+      })
     })
-  });
+  );
 }
 export {
   Menu

package/header/molecules/menu-button/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/menu-button/index.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,OAAO,CAAA;IACf,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,eAAe,gCAU9D"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/menu-button/index.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,OAAO,CAAA;IACf,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,eAAe,gCAmB9D"}

package/header/molecules/menu-button/index.js

@@ -7,6 +7,9 @@ function MenuButton({
 }) {
   return jsxs(Root, {
     $active: active,
+    "aria-controls": SELECTOR_IDS.MENU,
+    "aria-expanded": active,
+    "aria-label": "Меню",
     id: SELECTOR_IDS.MENU_BUTTON,
     onClick,
     type: "button",

package/header/molecules/oneclick-menu/index.js

@@ -13,8 +13,11 @@ function OneClickMenu({
   return jsx(Root, {
     $hide: hide,
     $isMenuOpen: isMenuOpen,
+    "aria-label": "Меню в один клик",
+    role: "navigation",
     children: items.map((item) => item.id === selectedItemId ? jsx(CurrentItem, {
       $hide: hide,
+      "aria-current": "page",
       children: item.title
     }, item.id) : jsx(Item, {
       href: item.url,

package/header/molecules/profile-menu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/profile-menu/index.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAA;AACzE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,MAAM,WAAW,gBAAgB;IAC/B;;;;OAIG;IACH,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,4DAA4D;IAC5D,SAAS,CAAC,EAAE,oBAAoB,EAAE,CAAA;IAClC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,KAAK,EAAE,oBAAoB,EAAE,CAAA;IAC7B,IAAI,EAAE,OAAO,CAAA;IACb,eAAe,CAAC,EAAE,SAAS,CAAA;IAC3B,eAAe,CAAC,EAAE,SAAS,CAAA;CAC5B;AAID,wBAAgB,WAAW,CAAC,EAC1B,WAAW,EACX,SAAc,EACd,WAAgB,EAChB,KAAK,EACL,IAAI,EACJ,eAAe,EACf,eAAe,GAChB,EAAE,gBAAgB,gCA2DlB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/profile-menu/index.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAA;AACzE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,MAAM,WAAW,gBAAgB;IAC/B;;;;OAIG;IACH,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,4DAA4D;IAC5D,SAAS,CAAC,EAAE,oBAAoB,EAAE,CAAA;IAClC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,KAAK,EAAE,oBAAoB,EAAE,CAAA;IAC7B,IAAI,EAAE,OAAO,CAAA;IACb,eAAe,CAAC,EAAE,SAAS,CAAA;IAC3B,eAAe,CAAC,EAAE,SAAS,CAAA;CAC5B;AAID,wBAAgB,WAAW,CAAC,EAC1B,WAAW,EACX,SAAc,EACd,WAAgB,EAChB,KAAK,EACL,IAAI,EACJ,eAAe,EACf,eAAe,GAChB,EAAE,gBAAgB,gCA8DlB"}

package/header/molecules/profile-menu/index.js

@@ -47,27 +47,34 @@ function ProfileMenu({
     observed.forEach((node) => observer.observe(node));
     return () => observer.disconnect();
   }, []);
-  return jsxs(Root, {
-    $isOpen: open,
-    id: SELECTOR_IDS.PROFILE_MENU,
-    children: [jsx("div", {
-      ref: pupilSelectRef,
-      children: pupilSelectSlot
-    }), jsx("div", {
-      ref: profileInfoRef,
-      children: profileInfoSlot
-    }), jsxs(Scrollable, {
-      autoHeight: true,
-      autoHeightMax: maxHeight,
-      autoHide: true,
-      universal: true,
-      children: [headItems.map((item) => jsx(ProfileMenuItem, __spreadValues({}, item), item.id)), jsx(Spacer, {
-        marginBottom: headSpacing
-      }), items.map((item) => item.id === SELECTOR_IDS.PROFILE_MENU_BONUSES && bonusesSlot !== void 0 ? jsx(Fragment, {
-        children: bonusesSlot
-      }, item.id) : jsx(ProfileMenuItem, __spreadValues({}, item), item.id))]
-    })]
-  });
+  return (
+    // Закрытое меню спрятано только прозрачностью (`opacity: 0`, ради анимации), и без атрибутов
+    // его ссылки читались бы скринридером и ловили Tab невидимыми. `inert` снимает фокус и клики,
+    // `aria-hidden` — дерево доступности; стили при этом не меняются.
+    jsxs(Root, {
+      $isOpen: open,
+      "aria-hidden": open ? void 0 : true,
+      id: SELECTOR_IDS.PROFILE_MENU,
+      inert: !open,
+      children: [jsx("div", {
+        ref: pupilSelectRef,
+        children: pupilSelectSlot
+      }), jsx("div", {
+        ref: profileInfoRef,
+        children: profileInfoSlot
+      }), jsxs(Scrollable, {
+        autoHeight: true,
+        autoHeightMax: maxHeight,
+        autoHide: true,
+        universal: true,
+        children: [headItems.map((item) => jsx(ProfileMenuItem, __spreadValues({}, item), item.id)), jsx(Spacer, {
+          marginBottom: headSpacing
+        }), items.map((item) => item.id === SELECTOR_IDS.PROFILE_MENU_BONUSES && bonusesSlot !== void 0 ? jsx(Fragment, {
+          children: bonusesSlot
+        }, item.id) : jsx(ProfileMenuItem, __spreadValues({}, item), item.id))]
+      })]
+    })
+  );
 }
 export {
   ProfileMenu

package/header/molecules/segment-list/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/segment-list/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAEhD,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAA;IACrC,QAAQ,EAAE,WAAW,EAAE,CAAA;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B;AASD,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,iBAAiB,EAAE,EAAE,gBAAgB,gCAUtF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/segment-list/index.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAEhD,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAA;IACrC,QAAQ,EAAE,WAAW,EAAE,CAAA;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B;AAaD,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,iBAAiB,EAAE,EAAE,gBAAgB,gCAiBtF"}

package/header/molecules/segment-list/index.js

@@ -1,5 +1,25 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import { Menu } from "react-aim-menu";
 import { Item } from "./styled.js";
+import { buttonProps, segmentPaneId } from "../../../shared/a11y.js";
 import { SELECTOR_IDS } from "../../../shared/constants.js";
 import { SegmentListItem } from "../../atoms/segment-list-item/index.js";
 import { jsx } from "preact/jsx-runtime";
@@ -15,16 +35,19 @@ function SegmentList({
       id,
       title,
       url
-    }) => jsx(Item, {
+    }) => jsx(Item, __spreadProps(__spreadValues({
       $spacer: bottomSpace,
+      "aria-controls": segmentPaneId(id),
+      "aria-expanded": selectedSegmentId === id,
       onClick: () => onSelect(id),
-      onHover: () => onSelect(id),
+      onHover: () => onSelect(id)
+    }, buttonProps(() => onSelect(id))), {
       children: jsx(SegmentListItem, {
         active: selectedSegmentId === id,
         title,
         url
       })
-    }, id))
+    }), id))
   });
 }
 export {

package/header/molecules/support-button/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/support-button/index.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAGjD,YAAY,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAwClE,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,aAAqB,EAAE,EAAE,kBAAkB,gCAqB1G;AAED,wBAAgB,mBAAmB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,aAAqB,EAAE,EAAE,kBAAkB,gCA2BzG"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/support-button/index.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAGjD,YAAY,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AA2ClE,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,aAAqB,EAAE,EAAE,kBAAkB,gCAuB1G;AAED,wBAAgB,mBAAmB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,aAAqB,EAAE,EAAE,kBAAkB,gCA6BzG"}

package/header/molecules/support-button/index.js

@@ -3,6 +3,7 @@ import { Button, Icon, Indicator } from "@foxford/ui";
 import { Root, TabletRoot, TabletButton, IndicatorRoot } from "./styled.js";
 import { SupportTheme } from "./theme.js";
 import { jsx, jsxs, Fragment } from "preact/jsx-runtime";
+const SUPPORT_LABEL = "Поддержка";
 function OpenIndicator() {
   return jsx(IndicatorRoot, {
     children: jsx(Indicator, {
@@ -42,6 +43,8 @@ function SupportButtonDesktop({
   return jsx(SupportTheme, {
     children: jsxs(Root, {
       children: [jsx(Button, {
+        "aria-haspopup": "dialog",
+        "aria-label": SUPPORT_LABEL,
         base: true,
         icon: "messageCircleQuestion",
         iconProps: {
@@ -78,6 +81,8 @@ function SupportButtonTablet({
   return jsx(SupportTheme, {
     children: jsxs(TabletRoot, {
       children: [jsx(TabletButton, {
+        "aria-haspopup": "dialog",
+        "aria-label": SUPPORT_LABEL,
         icon: jsxs(Fragment, {
           children: [jsx(Icon, {
             name: "messageCircleQuestion",

package/header/molecules/support-button/modal.js

@@ -18,7 +18,7 @@ var __spreadValues = (a, b) => {
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import { Button, Text, IconButton } from "@foxford/ui";
-import { SupportDialog, ModalFooter, SocialButtons } from "./styled.js";
+import { SupportDialog, ModalFooter, SocialButtons } from "./modal.styled.js";
 import { formatPhone } from "../../../shared/phone.js";
 import { BASE_ZINDEX } from "../../../shared/z-index.js";
 import { jsxs, jsx, Fragment } from "preact/jsx-runtime";

package/header/molecules/support-button/modal.styled.d.ts

@@ -0,0 +1,12 @@
+export declare const ModalFooter: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("preact").JSX.HTMLAttributes<HTMLDivElement>, "style"> & {
+    style?: string | import("styled-components/dist/types").CSSPropertiesWithVars | import("preact").JSX.CSSProperties | import("preact").JSX.SignalLike<string | import("preact").JSX.CSSProperties | undefined> | undefined;
+}> & string;
+export declare const SocialButtons: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("preact").JSX.HTMLAttributes<HTMLDivElement>, "style"> & {
+    style?: string | import("styled-components/dist/types").CSSPropertiesWithVars | import("preact").JSX.CSSProperties | import("preact").JSX.SignalLike<string | import("preact").JSX.CSSProperties | undefined> | undefined;
+}> & string;
+export declare const SupportDialog: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("@foxford/ui").DialogProps, "style"> & {
+    style?: string | import("styled-components/dist/types").CSSPropertiesWithVars | import("preact").JSX.CSSProperties | import("preact").JSX.SignalLike<string | import("preact").JSX.CSSProperties | undefined> | undefined;
+}> & string & Omit<import("react-dom/src").ForwardRefExoticComponent<import("@foxford/ui").DialogProps> & {
+    Component: import("react-dom/src").ForwardRefExoticComponent<import("@foxford/ui").DialogComponentProps>;
+}, keyof import("preact").Component<any, {}>>;
+//# sourceMappingURL=modal.styled.d.ts.map

package/header/molecules/support-button/modal.styled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal.styled.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/support-button/modal.styled.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,WAAW;;WAIvB,CAAA;AAED,eAAO,MAAM,aAAa;;WAGzB,CAAA;AAQD,eAAO,MAAM,aAAa;;;;6CAEzB,CAAA"}