@yandex/ui
Version:
Yandex UI components
85 lines (84 loc) • 2.83 kB
TypeScript
import { RefObject, ReactNode, FC, CSSProperties, ReactElement, Ref, MouseEventHandler } from 'react';
import { OnClose } from '../LayerManager/LayerManager';
import './Popup.css';
export interface IPopupProps {
/**
* Дополнительный контент после содержимого попапа
*/
addonAfter?: ReactNode;
/**
* Дополнительный контент перед содержимым попапа
*/
addonBefore?: ReactNode;
/**
* Включает/отключает хвостик у попапа
*/
hasTail?: boolean;
/**
* Ссылка на корневой DOM-элемент компонента
*/
innerRef?: Ref<HTMLDivElement>;
/**
* Сохраняет контейнер в DOM после создания
*
* @default true
*/
keepMounted?: boolean;
/**
* Ссылка на DOM-элемент, в котором размещается попап
*
* Важно, чтобы контейнер имел `position: relative` для корректного позиционирования.
*
* @default document.body
*/
scope?: RefObject<HTMLElement>;
/**
* Ссылка на DOM-элемент хвостика
*/
tailRef?: Ref<HTMLDivElement>;
/**
* Задает размер хвостика
*/
tailSize?: number;
/**
* Делает попап видимым
*/
visible?: boolean;
/**
* Задает слой `z-index`
*/
zIndex?: number;
/**
* Дополнительный класс
*/
className?: string;
/**
* Html атрибут `style`
*/
style?: CSSProperties;
/**
* Функция, вызывающаяся при отрисовке хвостика.
* Вызывается вне зависимости от наличия флага `hasTail`.
*/
unstable_onRenderTail?: (tail: ReactElement) => ReactElement;
/**
* Содержимое попапа
*/
children?: ReactNode | ((props: {
tailRef?: Ref<HTMLDivElement>;
}) => ReactNode);
/**
* Обработчик, вызывающийся после нажатия на клавишу esc либо мышкой на область вне контейнера
*/
onClose?: OnClose;
/**
* Обработчик, вызываемый при срабатывании события click
*/
onClick?: MouseEventHandler<HTMLDivElement>;
}
export declare const cnPopup: import("@bem-react/classname").ClassNameFormatter;
/**
* Компонент для создания всплывающего окна (попапа).
* @param {IPopupProps} props
*/
export declare const Popup: FC<IPopupProps>;