import * as React from 'react';
import SwiperCore from 'swiper';
import './Instructions.scss';
export declare const pictureAlignTypes: {
    readonly LEFT: "left";
    readonly RIGHT: "right";
};
export declare const pictureVerticalAlignTypes: {
    CENTER: string;
    TOP: string;
    UNSET: string;
};
export declare const pictureMaskTypes: {
    readonly ANDROID: "android";
    readonly ANDROID_CROPPED: "android-cropped";
    readonly IPHONE: "iphone";
    readonly IPHONE_CROPPED: "iphone-cropped";
    readonly LAPTOP: "laptop";
    readonly NONE: "none";
};
export declare const pictureBackgroundColorTypes: {
    readonly SPB_SKY_0: "spbSky0";
    readonly SPB_SKY_1: "spbSky1";
    readonly BASE: "base";
    readonly VIOLET: "violet";
    readonly TRANSPARENT: "transparent";
};
export declare const pictureOverlayTypes: {
    readonly LOGO_BASE: "logo-base";
    readonly LOGO_SPB_SKY_0: "logo-spb-sky-0";
    readonly LOGO_CROPPED_BASE_WITH_OPACITY: "logo-cropped-base-with-opacity";
    readonly LOGO_CROPPED_SPB_SKY_3: "logo-cropped-spb-sky-3";
    readonly NONE: "none";
};
export declare const sizeTypes: {
    readonly DEFAULT: "default";
    readonly BIG: "big";
};
export declare const arrowTheme: {
    readonly PURPLE: "purple";
    readonly DARK: "dark";
};
export declare const elementOrderTypes: {
    readonly DEFAULT: "default";
    readonly REVERSED: "reversed";
};
type PictureAlignTypesType = (typeof pictureAlignTypes)[keyof typeof pictureAlignTypes];
type PictureVerticalAlignTypesType = (typeof pictureVerticalAlignTypes)[keyof typeof pictureVerticalAlignTypes];
type PictureMaskTypesType = (typeof pictureMaskTypes)[keyof typeof pictureMaskTypes];
type PictureBackgroundColorsType = (typeof pictureBackgroundColorTypes)[keyof typeof pictureBackgroundColorTypes];
export type PictureOverlayType = (typeof pictureOverlayTypes)[keyof typeof pictureOverlayTypes];
type SizeType = (typeof sizeTypes)[keyof typeof sizeTypes];
type ArrowThemeType = (typeof arrowTheme)[keyof typeof arrowTheme];
type ElementOrderType = (typeof elementOrderTypes)[keyof typeof elementOrderTypes];
export type InstructionItemType = {
    title: string | React.ReactNode | React.ReactNode[];
    mediaUrl: string;
    isVideo: boolean;
    imageAlt?: string;
    /** Ссылка на изображение с QR-кодом */
    qrCode?: string;
    /** Текст для плашки с изображением QR-кода */
    qrCodeText?: string | React.ReactNode | React.ReactNode[];
};
export type ButtonType = {
    title: string;
    type?: 'primary' | 'outline';
    icon?: React.JSX.Element;
    href?: string;
    target?: '_self' | '_blank' | '_parent' | '_top';
    rel?: string;
    onClick?: (e: React.SyntheticEvent<EventTarget>) => void;
};
export interface IInstructionsProps {
    /** Дополнительные data атрибуты к внутренним элементам */
    dataAttrs?: {
        root?: Record<string, string>;
        item?: Record<string, string>;
        image?: Record<string, string>;
        mobileItemText?: Record<string, string>;
        wrapper?: Record<string, string>;
        arrowPrev?: Record<string, string>;
        arrowNext?: Record<string, string>;
        button?: Record<string, string>;
    };
    /** Ссылка на корневой элемент */
    rootRef?: React.Ref<HTMLDivElement>;
    /** Дополнительные классы для внутренних элементов */
    classes?: {
        instructionItem?: string;
        desktopInstructionItem?: string;
        mobileInstructionItem?: string;
        activeInstructionItem?: string;
        desktopItemTitle?: string;
        mobileItemTitle?: string;
        instructionItemImg?: string;
        additionalText?: string;
        arrowPrev?: string;
        arrowNext?: string;
        button?: string;
    };
    /** Заголовок инструкции */
    title?: string;
    /** Пункты инструкции */
    instructionItems: InstructionItemType[];
    /** Описание после инструкции */
    additionalText?: string;
    /** Расположение изображения по горизонтали */
    pictureAlign?: PictureAlignTypesType;
    /** Расположение изображения по вертикали */
    pictureVerticalAlign?: PictureVerticalAlignTypesType;
    /** Маска изображения */
    pictureMask?: PictureMaskTypesType;
    /** Цвет фона изображения */
    pictureBackgroundColor?: PictureBackgroundColorsType;
    /** * Оверлей поверх цвета фона */
    pictureOverlay?: PictureOverlayType;
    /** Размер картинки или маски */
    size?: SizeType;
    /** Показать стрелки для смены пунктов инструкции */
    showArrows?: boolean;
    /** Цветовая тема стрелок навигации */
    arrowsTheme?: ArrowThemeType;
    /** Вертикальный порядок элементов на мобильных устройствах и планшетах */
    elementOrder?: ElementOrderType;
    /** Показать нумерацию пунктов инструкции на мобильных устройствах */
    showMobileNumeration?: boolean;
    /** Кнопка */
    button?: ButtonType;
    /** Ref на swiper */
    getSwiper?: (instance: SwiperCore) => void;
}
declare const Instructions: React.FC<React.PropsWithChildren<IInstructionsProps>>;
export default Instructions;
