@sap-ux/ui-components/dist/components/UIDialog/UIDialog.d.ts

SAP UI Components Library

import React from 'react';
import type { IDialogProps } from '@fluentui/react';
import '../../styles/_shadows.scss';
export interface DialogProps extends IDialogProps {
    acceptButtonText?: string;
    cancelButtonText?: string;
    acceptButtonId?: string;
    cancelButtonId?: string;
    onAccept?: () => void;
    onCancel?: () => void;
    scrollArea?: UIDialogScrollArea;
    closeButtonVisible?: boolean;
    footer?: React.ReactElement | React.ReactElement[];
    multiLineTitle?: boolean;
    /**
     * The title text to display at the top of the dialog.
     */
    title?: string | JSX.Element;
    isOpenAnimated?: boolean;
}
export declare const DIALOG_MAX_HEIGHT_OFFSET = 32;
export declare const DIALOG_STYLES: {
    background: string;
    boxShadow: string;
    borderColor: string;
    borderRadius: string;
    vPadding: number;
    vPaddingHalf: number;
    hPadding: number;
    title: {
        color: string;
    };
    contentText: {
        fontSize: number;
        color: string;
    };
    modalOverlay: {
        background: string;
        opacity: number;
    };
};
export interface DialogState {
    resizeMaxHeight?: number;
    isMounted?: boolean;
}
export declare enum UIDialogScrollArea {
    Content = "Content",
    Dialog = "Dialog"
}
/**
 * UIDialog component.
 * based on https://developer.microsoft.com/en-us/fluentui#/controls/web/dialog
 * and https://app.abstract.com/projects/42046ab5-889d-4a59-88e6-1089e98cba67/branches/master/commits/f1fcd77447bb2b32aab3498311c1c39517e47e49/files/1455D538-559B-48EF-8D9F-1C2884ED540B/layers/AFDAAFD3-BFA6-4E96-BB6D-057DD13753E5
 *
 * @exports
 * @class UIDialog
 * @extends {React.Component<IDialogProps, {}>}
 */
export declare class UIDialog extends React.Component<DialogProps, DialogState> {
    static readonly defaultProps: {
        isOpenAnimated: boolean;
    };
    /**
     * Initializes component properties.
     *
     * @param {DialogProps} props
     */
    constructor(props: DialogProps);
    /**
     * Called when component is rerendered.
     *
     * @param {Readonly<DialogProps>} prevProps
     */
    componentDidUpdate(prevProps: Readonly<DialogProps>): void;
    /**
     * Method handles modal dialog mount event.
     */
    private onModalLayerMount;
    /**
     * Method handles modal dialog unmount event.
     */
    private onModalLayerUnmount;
    /**
     * Method attaches to window resize event.
     */
    private attachResize;
    /**
     * Method detaches from window resize event.
     */
    private detachResize;
    /**
     * Method handles window resizer event to update calculation for content scrollarea size.
     */
    private onResize;
    /**
     * Method returns maximal height for dialog content "scrollArea=Content" mode.
     *
     * @returns {number} Max size of dialog.
     */
    private getResizeMaxHeight;
    /**
     * Method returns footer element depending in component props.
     * Three states.
     * 1. Accept/Decline buttons.
     * 2. Custom content of footer.
     * 3. No footer.
     *
     * @returns {JSX.Element | null} Footer element to render.
     */
    getFooter(): JSX.Element | undefined;
    /**
     * Method handles mousedown event for dialog header area.
     * Method added to handle scenario when we open dropdown menu and move dialog.
     * Code in method sets focus to focuszone's placeholder - it triggers close for opened dropdown menu.
     *
     * @param {React.MouseEvent} event Mousedown event
     */
    onHeaderMouseDown(event: React.MouseEvent): void;
    /**
     * @returns {JSX.Element}
     */
    render(): JSX.Element;
}
//# sourceMappingURL=UIDialog.d.ts.map