@foxford/navigation-ui 1.0.0

package/header/molecules/pupil-select-button/index.js

@@ -0,0 +1,54 @@
+import { Button, Spacer } from "@foxford/ui";
+import { jsxs, jsx } from "preact/jsx-runtime";
+function PupilSelectButton({
+  isViewingAsPupil = false,
+  onOpenPupilList,
+  onSignOutFromPupil,
+  pupilCount = 0
+}) {
+  if (pupilCount > 0 && pupilCount < 7) {
+    return jsxs("div", {
+      children: [jsx(Button, {
+        base: true,
+        black: true,
+        fluid: true,
+        icon: "switchVertical",
+        id: "pupil-select-button",
+        onClick: onOpenPupilList,
+        preset: "brand",
+        size: "s",
+        textProps: {
+          size: 14,
+          weight: "normal"
+        },
+        children: "Войти как ученик"
+      }), jsx(Spacer, {
+        bottom: 20
+      })]
+    });
+  }
+  if (isViewingAsPupil) {
+    return jsxs("div", {
+      children: [jsx(Button, {
+        base: true,
+        black: true,
+        fluid: true,
+        icon: "switchVertical",
+        onClick: onSignOutFromPupil,
+        preset: "brand",
+        size: "s",
+        textProps: {
+          size: 14,
+          weight: "normal"
+        },
+        children: "Войти как родитель"
+      }), jsx(Spacer, {
+        bottom: 20
+      })]
+    });
+  }
+  return null;
+}
+export {
+  PupilSelectButton
+};

package/header/molecules/pupil-select-menu/index.d.ts

@@ -0,0 +1,15 @@
+export interface Pupil {
+    avatarUrl: string;
+    firstName: string;
+    grade: string;
+    id: number;
+    lastName: string;
+}
+export interface PupilSelectMenuProps {
+    onClose: () => void;
+    onSelectPupil: (id: number) => void;
+    open: boolean;
+    pupils: Pupil[];
+}
+export declare function PupilSelectMenu({ onClose, onSelectPupil, open, pupils }: PupilSelectMenuProps): import("preact").JSX.Element | null;
+//# sourceMappingURL=index.d.ts.map

package/header/molecules/pupil-select-menu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/pupil-select-menu/index.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,KAAK;IACpB,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,EAAE,MAAM,CAAA;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,EAAE,EAAE,MAAM,CAAA;IACV,QAAQ,EAAE,MAAM,CAAA;CACjB;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,IAAI,EAAE,OAAO,CAAA;IACb,MAAM,EAAE,KAAK,EAAE,CAAA;CAChB;AAED,wBAAgB,eAAe,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,oBAAoB,uCA2B7F"}

package/header/molecules/pupil-select-menu/index.js

@@ -0,0 +1,59 @@
+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 { Icon, ListItem, Text, Avatar } from "@foxford/ui";
+import { Root, BackButton } from "./styled.js";
+import { jsxs, jsx } from "preact/jsx-runtime";
+function PupilSelectMenu({
+  onClose,
+  onSelectPupil,
+  open,
+  pupils
+}) {
+  if (!open) {
+    return null;
+  }
+  return jsxs(Root, {
+    children: [jsxs(BackButton, {
+      onClick: onClose,
+      type: "button",
+      children: [jsx(Icon, {
+        name: "chevronUp",
+        preset: "brand",
+        rotate: "-90deg",
+        size: 20
+      }), "Назад"]
+    }), pupils.map((pupil) => jsx(ListItem, {
+      addonLeft: jsx(Avatar, {
+        size: "s",
+        src: pupil.avatarUrl
+      }),
+      borderRadius: 8,
+      caption: (props) => jsx(Text, __spreadProps(__spreadValues({}, props), {
+        color: "content-onmain-tertiary",
+        children: pupil.grade
+      })),
+      onClick: () => onSelectPupil(pupil.id),
+      text: `${pupil.firstName} ${pupil.lastName}`
+    }, pupil.id))]
+  });
+}
+export {
+  PupilSelectMenu
+};

package/header/molecules/pupil-select-menu/styled.d.ts

@@ -0,0 +1,7 @@
+export declare const Root: 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 BackButton: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("preact").JSX.ButtonHTMLAttributes<HTMLButtonElement>, "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;
+//# sourceMappingURL=styled.d.ts.map

package/header/molecules/pupil-select-menu/styled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/pupil-select-menu/styled.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,IAAI;;WAkBhB,CAAA;AAID,eAAO,MAAM,UAAU;;WAatB,CAAA"}

package/header/molecules/pupil-select-menu/styled.js

@@ -0,0 +1,26 @@
+import { styled } from "styled-components";
+import { screenMaxM } from "@foxford/ui";
+import { BASE_ZINDEX } from "../../../shared/z-index.js";
+const PROFILE_MENU_OFFSET_TOP = 32;
+const PROFILE_MENU_OFFSET_BOTTOM = 15;
+const Root = styled.div.withConfig({
+  displayName: "styled__Root",
+  componentId: "sc-to904m-0"
+})(["position:absolute;top:calc(100% + ", "px);right:0;border-radius:10px;box-shadow:0px 6px 20px rgba(0,0,0,0.1);width:290px;z-index:", ";overflow:hidden;padding:20px 8px;background-color:", ";", ""], PROFILE_MENU_OFFSET_TOP, BASE_ZINDEX.NAVIGATION + 3, ({
+  theme
+}) => theme.colors.white, screenMaxM()`
+    position: fixed;
+    bottom: ${PROFILE_MENU_OFFSET_BOTTOM}px;
+    right: 10px;
+    top: initial;
+  `);
+const BackButton = styled.button.withConfig({
+  displayName: "styled__BackButton",
+  componentId: "sc-to904m-1"
+})(["display:inline-flex;align-items:center;gap:8px;margin-left:8px;margin-bottom:16px;padding:0;border:none;background:none;font:inherit;font-size:16px;cursor:pointer;color:", ";"], ({
+  theme
+}) => theme.colors["content-onmain-primary"]);
+export {
+  BackButton,
+  Root
+};

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

@@ -0,0 +1,8 @@
+import type { MenuSegment } from '../menu/types';
+export interface SegmentListProps {
+    onSelect: (segmentId: string) => void;
+    segments: MenuSegment[];
+    selectedSegmentId?: string;
+}
+export declare function SegmentList({ onSelect, segments, selectedSegmentId }: SegmentListProps): import("preact").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +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"}

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

@@ -0,0 +1,32 @@
+import { Menu } from "react-aim-menu";
+import { Item } from "./styled.js";
+import { SELECTOR_IDS } from "../../../shared/constants.js";
+import { SegmentListItem } from "../../atoms/segment-list-item/index.js";
+import { jsx } from "preact/jsx-runtime";
+function SegmentList({
+  onSelect,
+  segments,
+  selectedSegmentId
+}) {
+  return jsx(Menu, {
+    id: SELECTOR_IDS.SEGMENT_LIST,
+    children: segments.map(({
+      bottomSpace,
+      id,
+      title,
+      url
+    }) => jsx(Item, {
+      $spacer: bottomSpace,
+      onClick: () => onSelect(id),
+      onHover: () => onSelect(id),
+      children: jsx(SegmentListItem, {
+        active: selectedSegmentId === id,
+        title,
+        url
+      })
+    }, id))
+  });
+}
+export {
+  SegmentList
+};

package/header/molecules/segment-list/styled.d.ts

@@ -0,0 +1,14 @@
+export declare const Item: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Merged<Omit<{
+    onHover?: () => any;
+    onLeave?: () => any;
+    children: import("preact").ComponentChild;
+} & import("react-dom/src").HTMLAttributes<HTMLDivElement> & import("react-dom/src").RefAttributes<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;
+}, {
+    $spacer?: boolean;
+}>> & string & Omit<import("react-dom/src").ForwardRefExoticComponent<{
+    onHover?: () => any;
+    onLeave?: () => any;
+    children: import("preact").ComponentChild;
+} & import("react-dom/src").HTMLAttributes<HTMLDivElement> & import("react-dom/src").RefAttributes<HTMLDivElement>>, keyof import("preact").Component<any, {}>>;
+//# sourceMappingURL=styled.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/segment-list/styled.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,IAAI;;;;;;;cAAgC,OAAO;;;;;+JAcvD,CAAA"}

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

@@ -0,0 +1,20 @@
+import { MenuItem } from "react-aim-menu";
+import { styled } from "styled-components";
+import { screenMinS, screenMinL } from "@foxford/ui";
+const Item = styled(MenuItem).withConfig({
+  displayName: "styled__Item",
+  componentId: "sc-19a0p7l-0"
+})(["cursor:pointer;&:not(:last-child){margin-bottom:", ";", " ", "}"], ({
+  $spacer
+}) => $spacer ? "20px" : "12px", screenMinS()`
+      margin-bottom: ${({
+  $spacer
+}) => $spacer ? "23px" : "6px"};
+    `, screenMinL()`
+      margin-bottom: ${({
+  $spacer
+}) => $spacer ? "20px" : "8px"};
+    `);
+export {
+  Item
+};

package/header/molecules/user-panel/index.d.ts

@@ -0,0 +1,32 @@
+import type { ProfileMenuProps } from '../profile-menu';
+import type { Pupil } from '../pupil-select-menu';
+import type { IconName } from '@foxford/ui';
+export interface UserPanelTopMenuItem {
+    icon?: IconName;
+    id: string;
+    onClick?: () => void;
+    title: string;
+    url: string;
+}
+export interface UserPanelProps {
+    cartItemsCount?: number;
+    highlightedTopMenuItemId?: string;
+    onProfileMenuClose: () => void;
+    onProfileMenuToggle: () => void;
+    onPupilSelectMenuClose: () => void;
+    onSelectPupil: (id: number) => void;
+    profileButtonMarker?: boolean;
+    profileMenu: Omit<ProfileMenuProps, 'open'>;
+    profileMenuOpen: boolean;
+    pupils?: Pupil[];
+    pupilSelectMenuOpen: boolean;
+    tooltipText?: string;
+    topMenuItems?: UserPanelTopMenuItem[];
+    user: {
+        avatarUrl: string;
+        name: string;
+        role: string;
+    };
+}
+export declare function UserPanel({ cartItemsCount, highlightedTopMenuItemId, onProfileMenuClose, onProfileMenuToggle, onPupilSelectMenuClose, onSelectPupil, profileButtonMarker, profileMenu, profileMenuOpen, pupils, pupilSelectMenuOpen, tooltipText, topMenuItems, user, }: UserPanelProps): import("preact").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/header/molecules/user-panel/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/user-panel/index.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AACvD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAA;AACjD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAE3C,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,EAAE,EAAE,MAAM,CAAA;IACV,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,GAAG,EAAE,MAAM,CAAA;CACZ;AAED,MAAM,WAAW,cAAc;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,wBAAwB,CAAC,EAAE,MAAM,CAAA;IACjC,kBAAkB,EAAE,MAAM,IAAI,CAAA;IAC9B,mBAAmB,EAAE,MAAM,IAAI,CAAA;IAC/B,sBAAsB,EAAE,MAAM,IAAI,CAAA;IAClC,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC,CAAA;IAC3C,eAAe,EAAE,OAAO,CAAA;IACxB,MAAM,CAAC,EAAE,KAAK,EAAE,CAAA;IAChB,mBAAmB,EAAE,OAAO,CAAA;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,oBAAoB,EAAE,CAAA;IACrC,IAAI,EAAE;QAAE,SAAS,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;CACxD;AAID,wBAAgB,SAAS,CAAC,EACxB,cAAkB,EAClB,wBAAwB,EACxB,kBAAkB,EAClB,mBAAmB,EACnB,sBAAsB,EACtB,aAAa,EACb,mBAA2B,EAC3B,WAAW,EACX,eAAe,EACf,MAAW,EACX,mBAAmB,EACnB,WAAW,EACX,YAAiB,EACjB,IAAI,GACL,EAAE,cAAc,gCAgFhB"}

package/header/molecules/user-panel/index.js

@@ -0,0 +1,114 @@
+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 { useRef, useEffect } from "react";
+import { Root, Inner, ProfileMenuWrapper, MobileOnly, DesktopOnly } from "./styled.js";
+import { SELECTOR_IDS } from "../../../shared/constants.js";
+import { useOutsideClick } from "../../../shared/use-outside-click.js";
+import { ActionButton } from "../../atoms/action-button/index.js";
+import { Avatar } from "../../atoms/avatar/index.js";
+import { UserProfile } from "../../atoms/user-profile/index.js";
+import { ProfileMenu } from "../profile-menu/index.js";
+import { ProfileMenuButtonTooltip } from "../profile-menu-button-tooltip/index.js";
+import { PupilSelectMenu } from "../pupil-select-menu/index.js";
+import { jsx, jsxs } from "preact/jsx-runtime";
+function UserPanel({
+  cartItemsCount = 0,
+  highlightedTopMenuItemId,
+  onProfileMenuClose,
+  onProfileMenuToggle,
+  onPupilSelectMenuClose,
+  onSelectPupil,
+  profileButtonMarker = false,
+  profileMenu,
+  profileMenuOpen,
+  pupils = [],
+  pupilSelectMenuOpen,
+  tooltipText,
+  topMenuItems = [],
+  user
+}) {
+  const profileMenuWrapperRef = useRef(null);
+  useOutsideClick(profileMenuWrapperRef, onProfileMenuClose, profileMenuOpen);
+  useOutsideClick(profileMenuWrapperRef, onPupilSelectMenuClose, pupilSelectMenuOpen);
+  useEffect(() => {
+    if (!profileMenuOpen && !pupilSelectMenuOpen) {
+      return;
+    }
+    const onKeyUp = (event) => {
+      if (event.key !== "Escape" && event.key !== "Esc") {
+        return;
+      }
+      onPupilSelectMenuClose();
+      onProfileMenuClose();
+    };
+    document.addEventListener("keyup", onKeyUp);
+    return () => document.removeEventListener("keyup", onKeyUp);
+  }, [onProfileMenuClose, onPupilSelectMenuClose, profileMenuOpen, pupilSelectMenuOpen]);
+  return jsx(Root, {
+    id: SELECTOR_IDS.USER_PANEL,
+    children: jsxs(Inner, {
+      children: [topMenuItems.map((item) => jsx(ActionButton, {
+        active: highlightedTopMenuItemId === item.id,
+        icon: item.icon,
+        id: item.id,
+        // Корзина в этой раскладке — такая же кнопка, как остальные, с точкой-маркером при
+        // непустой корзине; отдельный `CartButton` легаси использует только в раскладках
+        // elementary и new.
+        marker: item.id === SELECTOR_IDS.TOP_MENU_CART && cartItemsCount > 0,
+        onClick: item.onClick,
+        text: item.title,
+        url: item.url
+      }, item.id)), jsxs(ProfileMenuWrapper, {
+        ref: profileMenuWrapperRef,
+        children: [jsx(MobileOnly, {
+          children: jsx(ActionButton, {
+            avatar: jsx(Avatar, {
+              avatarUrl: user.avatarUrl
+            }),
+            id: SELECTOR_IDS.TOP_MENU_PROFILE,
+            marker: profileButtonMarker,
+            onClick: onProfileMenuToggle,
+            text: "Профиль"
+          })
+        }), jsx(DesktopOnly, {
+          children: jsx(UserProfile, {
+            active: profileMenuOpen || pupilSelectMenuOpen,
+            avatarUrl: user.avatarUrl,
+            name: user.name,
+            onClick: onProfileMenuToggle,
+            role: user.role
+          })
+        }), jsx(ProfileMenuButtonTooltip, {
+          text: tooltipText
+        }), jsx(ProfileMenu, __spreadProps(__spreadValues({}, profileMenu), {
+          open: profileMenuOpen
+        })), jsx(PupilSelectMenu, {
+          onClose: onPupilSelectMenuClose,
+          onSelectPupil,
+          open: pupilSelectMenuOpen,
+          pupils
+        })]
+      })]
+    })
+  });
+}
+export {
+  UserPanel
+};

package/header/molecules/user-panel/styled.d.ts

@@ -0,0 +1,16 @@
+export declare const Root: 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 Inner: 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 ProfileMenuWrapper: 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 MobileOnly: 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 DesktopOnly: 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;
+//# sourceMappingURL=styled.d.ts.map

package/header/molecules/user-panel/styled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/user-panel/styled.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,IAAI;;WAEhB,CAAA;AAED,eAAO,MAAM,KAAK;;WAmBjB,CAAA;AAED,eAAO,MAAM,kBAAkB;;WAE9B,CAAA;AAID,eAAO,MAAM,UAAU;;WAMtB,CAAA;AAED,eAAO,MAAM,WAAW;;WAMvB,CAAA"}

package/header/molecules/user-panel/styled.js

@@ -0,0 +1,41 @@
+import { styled } from "styled-components";
+import { screenMinS, screenMinM } from "@foxford/ui";
+const Root = styled.div.withConfig({
+  displayName: "styled__Root",
+  componentId: "sc-2ik4wt-0"
+})(["width:100%;"]);
+const Inner = styled.div.withConfig({
+  displayName: "styled__Inner",
+  componentId: "sc-2ik4wt-1"
+})(["display:flex;flex-direction:row;justify-content:space-between;align-items:center;svg{fill:currentColor;}", ""], screenMinS()`
+    & > :not(:first-child) {
+      margin-left: 8px;
+    }
+
+    & > :last-child {
+      margin-left: 36px;
+    }
+  `);
+const ProfileMenuWrapper = styled.div.withConfig({
+  displayName: "styled__ProfileMenuWrapper",
+  componentId: "sc-2ik4wt-2"
+})(["position:relative;"]);
+const MobileOnly = styled.div.withConfig({
+  displayName: "styled__MobileOnly",
+  componentId: "sc-2ik4wt-3"
+})(["display:contents;", ""], screenMinM()`
+    display: none;
+  `);
+const DesktopOnly = styled.div.withConfig({
+  displayName: "styled__DesktopOnly",
+  componentId: "sc-2ik4wt-4"
+})(["display:none;", ""], screenMinM()`
+    display: contents;
+  `);
+export {
+  DesktopOnly,
+  Inner,
+  MobileOnly,
+  ProfileMenuWrapper,
+  Root
+};

package/header/molecules/user-panel-mobile/index.d.ts

@@ -0,0 +1,3 @@
+import type { UserPanelProps } from '../user-panel';
+export declare function UserPanelMobile({ topMenuItems, ...props }: UserPanelProps): import("preact").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/header/molecules/user-panel-mobile/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/user-panel-mobile/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAInD,wBAAgB,eAAe,CAAC,EAAE,YAAiB,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,gCAQ9E"}

package/header/molecules/user-panel-mobile/index.js

@@ -0,0 +1,56 @@
+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));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { UserPanelWrapperMobile } from "./styled.js";
+import { SELECTOR_IDS } from "../../../shared/constants.js";
+import { useScrollDirection } from "../../../shared/use-scroll-direction.js";
+import { UserPanel } from "../user-panel/index.js";
+import { jsx } from "preact/jsx-runtime";
+function UserPanelMobile(_a) {
+  var _b = _a, {
+    topMenuItems = []
+  } = _b, props = __objRest(_b, [
+    "topMenuItems"
+  ]);
+  const {
+    scrollDirection
+  } = useScrollDirection();
+  return jsx(UserPanelWrapperMobile, {
+    $hidePanel: scrollDirection === "down",
+    id: SELECTOR_IDS.USER_PANEL_WRAPPER_MOBILE,
+    children: jsx(UserPanel, __spreadProps(__spreadValues({}, props), {
+      topMenuItems: topMenuItems.filter((item) => item.id !== SELECTOR_IDS.TOP_MENU_REFERRALS)
+    }))
+  });
+}
+export {
+  UserPanelMobile
+};

package/header/molecules/user-panel-mobile/styled.d.ts

@@ -0,0 +1,6 @@
+export declare const UserPanelWrapperMobile: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Merged<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;
+}, {
+    $hidePanel: boolean;
+}>> & string;
+//# sourceMappingURL=styled.d.ts.map

package/header/molecules/user-panel-mobile/styled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../../../src/header/molecules/user-panel-mobile/styled.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,sBAAsB;;;gBAA4B,OAAO;YAmBrE,CAAA"}

package/header/molecules/user-panel-mobile/styled.js

@@ -0,0 +1,16 @@
+import { styled } from "styled-components";
+import { NAVIGATION_BOTTOM_MENU_MOBILE_HEIGHT, TRANSFORM_NAVIGATION_TIME } from "../../../shared/constants.js";
+import { BASE_ZINDEX } from "../../../shared/z-index.js";
+const UserPanelWrapperMobile = styled.div.withConfig({
+  displayName: "styled__UserPanelWrapperMobile",
+  componentId: "sc-15q9ggz-0"
+})(["box-sizing:border-box;display:flex;align-items:center;position:fixed;bottom:0;left:0;width:100%;height:", "px;transform:", ";visibility:", ";transition:transform ", "s ease-in,visibility ", "s ease-in;padding-right:20px;padding-left:20px;background-color:", ";box-shadow:0px 0px 20px rgba(0,0,0,0.1);z-index:", ";"], NAVIGATION_BOTTOM_MENU_MOBILE_HEIGHT, ({
+  $hidePanel
+}) => `translate(0, ${$hidePanel ? NAVIGATION_BOTTOM_MENU_MOBILE_HEIGHT : 0}px)`, ({
+  $hidePanel
+}) => $hidePanel ? "hidden" : "visible", TRANSFORM_NAVIGATION_TIME, TRANSFORM_NAVIGATION_TIME, ({
+  theme
+}) => theme.colors.white, BASE_ZINDEX.NAVIGATION + 1);
+export {
+  UserPanelWrapperMobile
+};

package/header/navigation.d.ts

@@ -0,0 +1,3 @@
+import type { NavigationProps } from './types';
+export declare function Navigation(props: NavigationProps): import("preact").JSX.Element;
+//# sourceMappingURL=navigation.d.ts.map

package/header/navigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation.d.ts","sourceRoot":"","sources":["../../src/header/navigation.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAS9C,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,gCAsChD"}

package/header/navigation.js

@@ -0,0 +1,64 @@
+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 { HeaderDesktop } from "./header-desktop.js";
+import { HeaderMobile } from "./header-mobile.js";
+import { Container } from "./molecules/container/index.js";
+import { Menu } from "./molecules/menu/index.js";
+import { UserPanelMobile } from "./molecules/user-panel-mobile/index.js";
+import { Header, HeaderInner, MobileOnly } from "./styled.js";
+import { NavigationTheme } from "../shared/theme-provider.js";
+import { jsxs, jsx } from "preact/jsx-runtime";
+function Navigation(props) {
+  const {
+    entryPanel,
+    isLoggedIn,
+    menu,
+    menuOpen,
+    offsetTop,
+    onMenuToggle,
+    origin,
+    userPanel
+  } = props;
+  const showBackground = menuOpen || (userPanel == null ? void 0 : userPanel.profileMenuOpen) === true || (userPanel == null ? void 0 : userPanel.pupilSelectMenuOpen) === true;
+  return jsxs(NavigationTheme, {
+    children: [jsxs(Container, {
+      hasOneClickMenu: props.hasOneClickMenu,
+      onBackgroundClick: menuOpen ? onMenuToggle : void 0,
+      showBackground,
+      children: [jsx(Header, {
+        id: "header",
+        children: jsxs(HeaderInner, {
+          children: [jsx(HeaderMobile, __spreadValues({}, props)), jsx(HeaderDesktop, __spreadValues({}, props))]
+        })
+      }), jsx(Menu, __spreadProps(__spreadValues({}, menu), {
+        entryPanel,
+        onClose: onMenuToggle,
+        open: menuOpen,
+        origin,
+        topOffset: offsetTop != null ? offsetTop : null
+      }))]
+    }), isLoggedIn && userPanel && jsx(MobileOnly, {
+      children: jsx(UserPanelMobile, __spreadValues({}, userPanel))
+    })]
+  });
+}
+export {
+  Navigation
+};