@cloud-ru/ds-uikit-product-header 1.0.1-preview-7665e9c3.0

package/dist/esm/components/MainMenu/utils/resolveInnerLinksByIds.js

@@ -0,0 +1,8 @@
+import { flatLinksGroups } from './flatLinksGroups.js';
+export function resolveInnerLinksByIds(ids, groups) {
+    if (!ids.length) {
+        return [];
+    }
+    const itemsById = new Map(flatLinksGroups(groups).map(item => [item.id, item]));
+    return ids.map(id => itemsById.get(id)).filter((item) => Boolean(item));
+}

package/dist/esm/components/MainMenu/utils/search.d.ts

@@ -0,0 +1 @@
+export declare function toggleLayout(text: string): string;

package/dist/esm/components/MainMenu/utils/search.js

@@ -0,0 +1,24 @@
+import { enToRuMap, ruToEnMap } from '../constants.js';
+function convertLayout(text, direction = 'en-ru') {
+    const map = direction === 'en-ru' ? enToRuMap : ruToEnMap;
+    return text
+        .split('')
+        .map(ch => map[ch] ?? ch)
+        .join('');
+}
+function isCyrillic(text) {
+    return /[а-яё]/i.test(text);
+}
+function isLatin(text) {
+    return /[a-z]/i.test(text);
+}
+export function toggleLayout(text) {
+    const lowercaseValue = text.toLowerCase();
+    if (isCyrillic(lowercaseValue)) {
+        return convertLayout(lowercaseValue, 'ru-en');
+    }
+    if (isLatin(lowercaseValue)) {
+        return convertLayout(lowercaseValue, 'en-ru');
+    }
+    return text;
+}

package/dist/esm/components/PathBreadcrumbs/PathBreadcrumbs.d.ts

@@ -0,0 +1,7 @@
+import { BreadcrumbsProps } from '@cloud-ru/ds-breadcrumbs';
+type PathBreadcrumbsProps = {
+    items: BreadcrumbsProps['items'];
+    isMobile?: boolean;
+};
+export declare function PathBreadcrumbs({ isMobile, items }: PathBreadcrumbsProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/components/PathBreadcrumbs/PathBreadcrumbs.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Breadcrumbs } from '@cloud-ru/ds-breadcrumbs';
+import styles from './styles.module.css';
+export function PathBreadcrumbs({ isMobile, items }) {
+    return (_jsx(Breadcrumbs, { items: items, className: styles.breadcrumbs, inactiveLastItem: items.length > 1, separator: '/', size: isMobile ? 'xs' : 's', "data-test-id": 'header__breadcrumbs' }));
+}

package/dist/esm/components/PathBreadcrumbs/index.d.ts

@@ -0,0 +1 @@
+export * from './PathBreadcrumbs.js';

package/dist/esm/components/PathBreadcrumbs/index.js

@@ -0,0 +1 @@
+export * from './PathBreadcrumbs.js';

package/dist/esm/components/PathBreadcrumbs/styles.module.css

@@ -0,0 +1,4 @@
+.breadcrumbs{
+  min-width:0;
+  padding:0 var(--sn-primitive-dimension-8, 8px) !important;
+}

package/dist/esm/components/PlatformLogo/Container.d.ts

@@ -0,0 +1,12 @@
+import { WithSupportProps } from '@cloud-ru/ds-utils';
+import { JSXElementConstructor, PropsWithChildren } from 'react';
+export type ContainerProps = PropsWithChildren<WithSupportProps<{
+    className?: string;
+}>>;
+export declare function Container({ children, ...otherProps }: ContainerProps): import("react/jsx-runtime").JSX.Element;
+export type IconComponentProps = {
+    className?: string;
+};
+export declare const getPlatformIconComponent: (Icon: JSXElementConstructor<{
+    size: number;
+}>) => (props: IconComponentProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PlatformLogo/Container.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import styled from './styles.module.css';
+export function Container({ children, ...otherProps }) {
+    return (_jsx("div", { className: styled.container, ...otherProps, children: children }));
+}
+export const getPlatformIconComponent = (Icon) => function IconComponent(props) {
+    return (_jsx(Container, { ...props, children: _jsx(Icon, { size: 24 }) }));
+};

package/dist/esm/components/PlatformLogo/index.d.ts

@@ -0,0 +1,6 @@
+export declare const AdvancedPlatformLogo: (props: import("./Container").IconComponentProps) => import("react/jsx-runtime").JSX.Element;
+export declare const EnterprisePlatformLogo: (props: import("./Container").IconComponentProps) => import("react/jsx-runtime").JSX.Element;
+export declare const EvolutionPlatformLogo: (props: import("./Container").IconComponentProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MLSpacePlatformLogo: (props: import("./Container").IconComponentProps) => import("react/jsx-runtime").JSX.Element;
+export declare const PartnerPlatformLogo: (props: import("./Container").IconComponentProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MarketplacePlatformLogo: (props: import("./Container").IconComponentProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/PlatformLogo/index.js

@@ -0,0 +1,8 @@
+import { AdvancedSVG, EvolutionSVG, MarketplaceSVG, MlSpaceSVG, PartnerAccountSVG, VmwareSVG, } from '@cloud-ru/ds-icons/services';
+import { getPlatformIconComponent } from './Container.js';
+export const AdvancedPlatformLogo = getPlatformIconComponent(AdvancedSVG);
+export const EnterprisePlatformLogo = getPlatformIconComponent(VmwareSVG);
+export const EvolutionPlatformLogo = getPlatformIconComponent(EvolutionSVG);
+export const MLSpacePlatformLogo = getPlatformIconComponent(MlSpaceSVG);
+export const PartnerPlatformLogo = getPlatformIconComponent(PartnerAccountSVG);
+export const MarketplacePlatformLogo = getPlatformIconComponent(MarketplaceSVG);

package/dist/esm/components/PlatformLogo/styles.module.css

@@ -0,0 +1,9 @@
+.container{
+  display:flex;
+  align-items:center;
+  justify-content:center;
+  width:var(--sn-primitive-dimension-24, 24px);
+  height:var(--sn-primitive-dimension-24, 24px);
+  border-radius:var(--sn-density-radius-2xs, var(--sn-primitive-dimension-4, 4px));
+  background:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
+}

package/dist/esm/components/UserMenu/UserMenu.d.ts

@@ -0,0 +1,14 @@
+import { BaseItemProps, ListProps } from '@cloud-ru/ds-list';
+import { ThemeProps, UserProfileProps } from './types.js';
+export type UserMenuProps = {
+    profile?: UserProfileProps;
+    theme?: ThemeProps;
+    items?: ListProps['items'];
+    settingItems?: BaseItemProps[];
+    onLogout?(): void;
+    open?: boolean;
+    setOpen?(open: boolean): void;
+    triggerTooltip?: string;
+    onClick?(): void;
+};
+export declare function UserMenu({ profile, open: openProp, setOpen: setOpenProp, onLogout, items, settingItems, theme, onClick, triggerTooltip, }: UserMenuProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/UserMenu/UserMenu.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { isMobileLayout, useAdaptiveLayout } from '@cloud-ru/ds-adaptive';
+import { Avatar } from '@cloud-ru/ds-avatar';
+import { Droplist } from '@cloud-ru/ds-list';
+import { useValueControl } from '@cloud-ru/ds-utils';
+import { useMemo } from 'react';
+import { headerLocale } from '../../locale/index.js';
+import { HeaderButton } from '../HeaderButton/index.js';
+import { useUserMenuItems } from './hooks/useUserMenuItems.js';
+import styles from './styles.module.css';
+export function UserMenu({ profile = {}, open: openProp, setOpen: setOpenProp, onLogout, items, settingItems, theme, onClick, triggerTooltip, }) {
+    const { t } = headerLocale.useTranslations();
+    const { layoutType } = useAdaptiveLayout();
+    const isMobile = isMobileLayout(layoutType);
+    const [open = false, setOpen] = useValueControl({ value: openProp, onChange: setOpenProp });
+    const { fullName = '', inviteCount } = profile;
+    const userMenuItems = useUserMenuItems({
+        isMobile,
+        profile,
+        theme,
+        items,
+        settingItems,
+        onClose: () => {
+            setOpen(false);
+        },
+        onLogout,
+    });
+    const trigger = useMemo(() => (_jsx(HeaderButton, { tooltip: { tip: triggerTooltip }, isMobile: isMobile, onClick: () => {
+            setOpen?.(true);
+            onClick?.();
+        }, counter: Number(inviteCount)
+            ? {
+                value: Number(inviteCount),
+            }
+            : undefined, "data-test-id": 'header__user-menu__button', icon: _jsx(Avatar, { appearance: 'red', size: 's', name: fullName, showTwoSymbols: true }), "data-pressed": open })), [fullName, inviteCount, onClick, open, setOpen, isMobile, triggerTooltip]);
+    return (_jsx(Droplist, { open: open, onOpenChange: setOpen, size: 'm', items: userMenuItems, selection: {
+            mode: 'single',
+            value: 'null',
+        }, trigger: 'click', placement: 'bottom-end', className: styles.userMenuDroplist, closeOnPopstate: true, "data-test-id": 'header__user-menu', label: t('user'), children: trigger }));
+}

package/dist/esm/components/UserMenu/hooks/useLogoutItem.d.ts

@@ -0,0 +1,4 @@
+import { ListProps } from '@cloud-ru/ds-list';
+export declare function useLogoutItem({ onLogout }: {
+    onLogout?(): void;
+}): ListProps['items'];

package/dist/esm/components/UserMenu/hooks/useLogoutItem.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ExitSVG } from '@cloud-ru/ds-icons/interface/product';
+import { useMemo } from 'react';
+import { headerLocale } from '../../../locale/index.js';
+export function useLogoutItem({ onLogout }) {
+    const { t } = headerLocale.useTranslations();
+    return useMemo(() => [
+        {
+            beforeContent: _jsx(ExitSVG, {}),
+            content: {
+                label: t('logout'),
+            },
+            onClick: onLogout,
+            'data-test-id': 'header__user-menu__logout',
+        },
+    ], [onLogout, t]);
+}

package/dist/esm/components/UserMenu/hooks/useProfileItem.d.ts

@@ -0,0 +1,3 @@
+import { BaseItemProps } from '@cloud-ru/ds-list';
+import { UserProfileProps } from '../types.js';
+export declare function useProfileItem({ fullName, email, itemWrapRender, onClick, }: UserProfileProps): BaseItemProps;

package/dist/esm/components/UserMenu/hooks/useProfileItem.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Avatar } from '@cloud-ru/ds-avatar';
+import { SettingsSVG } from '@cloud-ru/ds-icons/interface/system';
+import { useMemo } from 'react';
+export function useProfileItem({ fullName = '', email = '', itemWrapRender, onClick, }) {
+    return useMemo(() => ({
+        content: {
+            label: fullName,
+            description: email,
+            truncate: {
+                description: 1,
+            },
+        },
+        onClick,
+        beforeContent: _jsx(Avatar, { appearance: 'red', size: 's', name: fullName, showTwoSymbols: true }),
+        afterContent: _jsx(SettingsSVG, {}),
+        itemWrapRender,
+        id: 'header__user-menu__button',
+        'data-test-id': 'header__user-menu__manage-profile',
+    }), [email, fullName, itemWrapRender, onClick]);
+}

package/dist/esm/components/UserMenu/hooks/useThemeItem.d.ts

@@ -0,0 +1,6 @@
+import { DroplistProps } from '@cloud-ru/ds-list';
+import { ThemeProps } from '../types.js';
+export declare function useThemeItem({ value: themeMode, onChange, isMobile, onClose, }: ThemeProps & {
+    isMobile?: boolean;
+    onClose?(): void;
+}): DroplistProps['items'][0];

package/dist/esm/components/UserMenu/hooks/useThemeItem.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DaySVG, LaptopPhoneSVG, NightSVG, ThemeContrastSVG } from '@cloud-ru/ds-icons/interface/system';
+import { useCallback, useMemo } from 'react';
+import { headerLocale } from '../../../locale/index.js';
+import { THEME_MODE } from '../types.js';
+export function useThemeItem({ value: themeMode, onChange, isMobile, onClose, }) {
+    const { t } = headerLocale.useTranslations();
+    const handleClick = useCallback((themeMode) => () => {
+        onChange?.(themeMode);
+        !isMobile && onClose?.();
+    }, [isMobile, onChange, onClose]);
+    const themeModeOptions = useMemo(() => [
+        {
+            beforeContent: _jsx(DaySVG, {}),
+            content: {
+                label: t('themeModeLight'),
+            },
+            onClick: handleClick(THEME_MODE.Light),
+            checked: themeMode === THEME_MODE.Light,
+            'data-test-id': 'header__user-menu__theme-mode__light-option',
+        },
+        {
+            beforeContent: _jsx(NightSVG, {}),
+            content: {
+                label: t('themeModeDark'),
+            },
+            checked: themeMode === THEME_MODE.Dark,
+            onClick: handleClick(THEME_MODE.Dark),
+            'data-test-id': 'header__user-menu__theme-mode__dark-option',
+        },
+        {
+            beforeContent: _jsx(LaptopPhoneSVG, {}),
+            content: {
+                label: t('themeModeSystem'),
+            },
+            checked: themeMode === THEME_MODE.System,
+            onClick: handleClick(THEME_MODE.System),
+            'data-test-id': 'header__user-menu__theme-mode__system-option',
+        },
+    ], [handleClick, t, themeMode]);
+    return useMemo(() => ({
+        type: 'next-list',
+        content: {
+            label: t('themeModeLabel'),
+        },
+        placement: 'left-start',
+        beforeContent: _jsx(ThemeContrastSVG, {}),
+        'data-test-id': 'header__user-menu__theme-mode',
+        items: themeModeOptions,
+    }), [t, themeModeOptions]);
+}

package/dist/esm/components/UserMenu/hooks/useUserMenuItems.d.ts

@@ -0,0 +1,87 @@
+import { BaseItemProps, ListProps } from '@cloud-ru/ds-list';
+import { MouseEvent } from 'react';
+import { ThemeProps, UserProfileProps } from '../types.js';
+type UseMenuItems = {
+    profile: UserProfileProps;
+    theme?: ThemeProps;
+    items?: ListProps['items'];
+    settingItems?: BaseItemProps[];
+    onLogout?(): void;
+    onClose?(): void;
+    isMobile?: boolean;
+};
+export declare function useUserMenuItems({ profile, theme, onLogout, items: itemsProp, isMobile, onClose, settingItems, }: UseMenuItems): (import("@cloud-ru/ds-list").AccordionItem | import("@cloud-ru/ds-list").NextListItem | import("@cloud-ru/ds-list").GroupItem | import("@cloud-ru/ds-list").GroupSelectItem | {
+    onClick: (e: MouseEvent<HTMLElement>) => void;
+    'data-test-id'?: string;
+    "aria-activedescendant"?: string | undefined;
+    "aria-atomic"?: (boolean | "true" | "false") | undefined;
+    "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
+    "aria-braillelabel"?: string | undefined;
+    "aria-brailleroledescription"?: string | undefined;
+    "aria-busy"?: (boolean | "true" | "false") | undefined;
+    "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
+    "aria-colcount"?: number | undefined;
+    "aria-colindex"?: number | undefined;
+    "aria-colindextext"?: string | undefined;
+    "aria-colspan"?: number | undefined;
+    "aria-controls"?: string | undefined;
+    "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
+    "aria-describedby"?: string | undefined;
+    "aria-description"?: string | undefined;
+    "aria-details"?: string | undefined;
+    "aria-disabled"?: (boolean | "true" | "false") | undefined;
+    "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
+    "aria-errormessage"?: string | undefined;
+    "aria-expanded"?: (boolean | "true" | "false") | undefined;
+    "aria-flowto"?: string | undefined;
+    "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+    "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
+    "aria-hidden"?: (boolean | "true" | "false") | undefined;
+    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
+    "aria-keyshortcuts"?: string | undefined;
+    "aria-label"?: string | undefined;
+    "aria-labelledby"?: string | undefined;
+    "aria-level"?: number | undefined;
+    "aria-live"?: "off" | "assertive" | "polite" | undefined;
+    "aria-modal"?: (boolean | "true" | "false") | undefined;
+    "aria-multiline"?: (boolean | "true" | "false") | undefined;
+    "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined;
+    "aria-owns"?: string | undefined;
+    "aria-placeholder"?: string | undefined;
+    "aria-posinset"?: number | undefined;
+    "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
+    "aria-readonly"?: (boolean | "true" | "false") | undefined;
+    "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
+    "aria-required"?: (boolean | "true" | "false") | undefined;
+    "aria-roledescription"?: string | undefined;
+    "aria-rowcount"?: number | undefined;
+    "aria-rowindex"?: number | undefined;
+    "aria-rowindextext"?: string | undefined;
+    "aria-rowspan"?: number | undefined;
+    "aria-selected"?: (boolean | "true" | "false") | undefined;
+    "aria-setsize"?: number | undefined;
+    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
+    "aria-valuemax"?: number | undefined;
+    "aria-valuemin"?: number | undefined;
+    "aria-valuenow"?: number | undefined;
+    "aria-valuetext"?: string | undefined;
+    beforeContent?: import("react").ReactNode;
+    afterContent?: import("react").ReactNode;
+    content?: import("@cloud-ru/ds-list").ItemContentProps | import("react").ReactNode;
+    onMouseDown?(e: MouseEvent<HTMLElement>): void;
+    onKeyDown?(e: import("react").KeyboardEvent<HTMLElement>): void;
+    onFocus?(e: import("react").FocusEvent<HTMLElement>): void;
+    onBlur?(e: import("react").FocusEvent<HTMLElement>): void;
+    id?: import("@cloud-ru/ds-list").ItemId;
+    disabled?: boolean;
+    hidden?: boolean;
+    itemRef?: import("react").RefObject<HTMLElement>;
+    className?: string;
+    inactive?: boolean;
+    switch?: boolean;
+    showSwitchIcon?: boolean;
+    itemWrapRender?(item: import("react").ReactNode): import("react").ReactNode;
+    checked?: boolean;
+})[];
+export {};

package/dist/esm/components/UserMenu/hooks/useUserMenuItems.js

@@ -0,0 +1,42 @@
+import { isBaseItemProps } from '@cloud-ru/ds-list';
+import { useMemo } from 'react';
+import { shouldBeOpenedInNewTab } from '../../../utils/shouldBeOpenedInNewTab.js';
+import { useLogoutItem } from './useLogoutItem.js';
+import { useProfileItem } from './useProfileItem.js';
+import { useThemeItem } from './useThemeItem.js';
+const DIVIDER_ITEM = {
+    type: 'group',
+    divider: true,
+    items: [],
+};
+export function useUserMenuItems({ profile, theme, onLogout, items: itemsProp = [], isMobile, onClose, settingItems = [], }) {
+    const profileItem = useProfileItem(profile);
+    const themeItem = useThemeItem({ ...(theme || {}), isMobile, onClose });
+    const logoutItem = useLogoutItem({ onLogout });
+    const items = useMemo(() => {
+        let items = [profileItem];
+        if (themeItem) {
+            items = items.concat([DIVIDER_ITEM, themeItem]);
+        }
+        items = items.concat(itemsProp);
+        items = items.concat(logoutItem);
+        if (isMobile && Boolean(settingItems?.length)) {
+            items = items.concat([DIVIDER_ITEM, ...settingItems]);
+        }
+        return items.map(item => {
+            if (isBaseItemProps(item)) {
+                return {
+                    ...item,
+                    onClick: (e) => {
+                        item.onClick?.(e);
+                        if (!shouldBeOpenedInNewTab(e)) {
+                            onClose?.();
+                        }
+                    },
+                };
+            }
+            return item;
+        });
+    }, [isMobile, itemsProp, logoutItem, onClose, profileItem, settingItems, themeItem]);
+    return items;
+}

package/dist/esm/components/UserMenu/index.d.ts

@@ -0,0 +1,2 @@
+export * from './UserMenu.js';
+export * from './types.js';

package/dist/esm/components/UserMenu/index.js

@@ -0,0 +1,2 @@
+export * from './UserMenu.js';
+export * from './types.js';

package/dist/esm/components/UserMenu/styles.module.css

@@ -0,0 +1,7 @@
+.userMenuDroplist{
+  width:272px;
+}
+
+.userMenuTrigger{
+  display:block;
+}

package/dist/esm/components/UserMenu/types.d.ts

@@ -0,0 +1,20 @@
+import { MouseEvent, ReactNode } from 'react';
+export type UserProfileProps = {
+    fullName?: string;
+    email?: string;
+    inviteCount?: number;
+    onClick?(e: MouseEvent<HTMLElement>): void;
+    itemWrapRender?(node: ReactNode): ReactNode;
+};
+type ValueOf<T> = T[keyof T];
+export declare const THEME_MODE: {
+    readonly Light: "light";
+    readonly Dark: "dark";
+    readonly System: "system";
+};
+export type ThemeMode = ValueOf<typeof THEME_MODE>;
+export type ThemeProps = {
+    value?: ThemeMode;
+    onChange?(themeMode: ThemeMode): void;
+};
+export {};

package/dist/esm/components/UserMenu/types.js

@@ -0,0 +1,5 @@
+export const THEME_MODE = {
+    Light: 'light',
+    Dark: 'dark',
+    System: 'system',
+};

package/dist/esm/components/index.d.ts

@@ -0,0 +1,7 @@
+export * from './HeaderButton/index.js';
+export * from './HeaderLayout/index.js';
+export * from './MainMenu/index.js';
+export * from './UserMenu/index.js';
+export * from './Logo/index.js';
+export * from './PathBreadcrumbs/index.js';
+export * from './PlatformLogo/index.js';

package/dist/esm/components/index.js

@@ -0,0 +1,7 @@
+export * from './HeaderButton/index.js';
+export * from './HeaderLayout/index.js';
+export * from './MainMenu/index.js';
+export * from './UserMenu/index.js';
+export * from './Logo/index.js';
+export * from './PathBreadcrumbs/index.js';
+export * from './PlatformLogo/index.js';

package/dist/esm/constants.d.ts

@@ -0,0 +1,20 @@
+export declare const TEST_IDS: {
+    readonly headerLayout: {
+        readonly root: "header-layout";
+    };
+    readonly mainMenu: {
+        readonly root: "header";
+        readonly drawerButton: "header__drawer-menu-button";
+        readonly drawer: "header__drawer-menu";
+        readonly drawerMobile: "header__drawer-menu-mobile";
+        readonly search: "header__drawer-menu__search";
+    };
+    readonly userMenu: {
+        readonly root: "header__user-menu";
+        readonly button: "header__user-menu__button";
+        readonly mobile: "header__user-menu-mobile";
+    };
+    readonly breadcrumbs: {
+        readonly root: "header__breadcrumbs";
+    };
+};

package/dist/esm/constants.js

@@ -0,0 +1,20 @@
+export const TEST_IDS = {
+    headerLayout: {
+        root: 'header-layout',
+    },
+    mainMenu: {
+        root: 'header',
+        drawerButton: 'header__drawer-menu-button',
+        drawer: 'header__drawer-menu',
+        drawerMobile: 'header__drawer-menu-mobile',
+        search: 'header__drawer-menu__search',
+    },
+    userMenu: {
+        root: 'header__user-menu',
+        button: 'header__user-menu__button',
+        mobile: 'header__user-menu-mobile',
+    },
+    breadcrumbs: {
+        root: 'header__breadcrumbs',
+    },
+};

package/dist/esm/index.d.ts

@@ -0,0 +1,4 @@
+export * from './components/index.js';
+export * from './constants.js';
+export * from './locale/index.js';
+export { useLocalStorage } from '@cloud-ru/ds-utils';

package/dist/esm/index.js

@@ -0,0 +1,4 @@
+export * from './components/index.js';
+export * from './constants.js';
+export * from './locale/index.js';
+export { useLocalStorage } from '@cloud-ru/ds-utils';