import React, { ReactNode, PureComponent, CSSProperties, Ref } from 'react'; import { RenderOverride } from '../lib/render-override'; import { IMenuItemProps as MenuItemProps } from './Item/Menu-Item'; import './Menu.css'; export type { MenuItemProps }; export declare type ItemSimple = { /** * Значение, которое соответствует пункту меню. Это значение передается в обработчик, который указан в `onChange` */ value: any; /** * Содержимое пункта меню. Например: строка с названием пункта меню или иконка */ content: ReactNode; /** * Неактивное состояние элемента */ disabled?: boolean; /** * Идентификатор компонента */ id?: string; }; export declare type ItemGroup = { /** * Заголовок группы */ title?: string; /** * Набор элементов в группе */ items: ItemSimple[]; }; export declare type MixedItem = ItemSimple | ItemGroup; export declare type ChangeEvent = React.ChangeEvent; export declare type ChangeEventHandler = (event: ChangeEvent) => void; export interface IMenuProps { /** * Состояние фокуса на меню. Необходимо для активации клавиатурной навигации */ focused?: boolean; /** * Список пунктов меню */ items: MixedItem[]; /** * Обработчик изменения значения */ onChange?: ChangeEventHandler; /** * Обработчик изменения активного значения в меню */ onActiveItemChange?: (id: string) => void; /** * Пункт меню или список пунктов, которые выбраны по умолчанию. * Значения должны совпадать со значениями `value`, которые указаны в `items` */ value?: any; /** * Неактивное состояние компонента. * Состояние, при котором меню отображается, но недоступно для действий пользователя */ disabled?: boolean; /** * Ссылка на корневой DOM-элемент компонента */ innerRef?: Ref; /** * Дополнительный класс */ className?: string; /** * Html атрибут `style` */ style?: CSSProperties; /** * Переопределяет компонент `Item` */ renderItem?: RenderOverride; } export declare const cnMenu: import("@bem-react/classname").ClassNameFormatter; /** * Компонент для создания меню. * @param {IMenuProps} props */ export declare class Menu extends PureComponent { static displayName: string; readonly state: { hoveredIndex: number; }; /** * Контейнер с ссылкой на корневой DOM элемент меню. */ private readonly innerRef; /** * Массив ссылок на пункты меню для правильного подскролла. */ private itemsRef; private uniqId; componentDidMount(): void; componentDidUpdate(prevProps: IMenuProps): void; componentWillUnmount(): void; render(): JSX.Element; private forwardRefs; private mapChildren; private onKeyDown; private static scrollToItem; private onMenuItemClick; private subscribeToEvents; private unsubscribeFromEvents; private setHoveredOnMouseEnter; private setHoveredOnMouseLeave; private hoverAndScrollToFirstSelectedElement; /** * Возвращает следующий индекс активного элемента для выделения в меню. * * @param direction Направление, может быть `1` — down, либо `-1` — up. */ private getNextNotDisabledIndex; /** * Вызывает событие onActiveItemChange. */ private triggerOnMenuItemChange; /** * Вызывает событие onChange. */ private triggerOnChange; }