@fluentui/react-northstar/dist/es/components/Alert/Alert.d.ts

A themable React component library.

import { Accessibility, AlertBehaviorProps } from '@fluentui/accessibility';
import * as PropTypes from 'prop-types';
import * as React from 'react';
import { UIComponentProps, ContentComponentProps } from '../../utils';
import { ComponentEventHandler, ShorthandValue, ShorthandCollection, FluentComponentStaticProps } from '../../types';
import { BoxProps } from '../Box/Box';
import { ButtonProps } from '../Button/Button';
import { TextProps } from '../Text/Text';
import { ButtonGroupProps } from '../Button/ButtonGroup';
import { AlertDismissAction, AlertDismissActionProps } from './AlertDismissAction';
export interface AlertSlotClassNames {
    content: string;
    actions: string;
    icon: string;
    header: string;
    body: string;
}
export interface AlertProps extends UIComponentProps, ContentComponentProps<ShorthandValue<BoxProps>> {
    /**
     * Accessibility behavior if overridden by the user.
     * @available alertWarningBehavior
     */
    accessibility?: Accessibility<AlertBehaviorProps>;
    /** An alert can contain action buttons. */
    actions?: ShorthandValue<ButtonGroupProps> | ShorthandCollection<ButtonProps>;
    /** An alert may contain an icon. */
    icon?: ShorthandValue<BoxProps>;
    /** An alert may contain a header. */
    header?: ShorthandValue<TextProps>;
    /** An alert's position relative to neighboring items. */
    attached?: boolean | 'top' | 'bottom';
    /** An alert can only take up the width of its content. */
    fitted?: boolean;
    /** An alert may be formatted to display a danger message. */
    danger?: boolean;
    /** A default value for the `visible` prop. */
    defaultVisible?: boolean;
    /** An alert can be dismissible. */
    dismissible?: boolean;
    /**
     * A button shorthand for the dismiss action slot. To use this slot the alert should be
     * dismissible.
     */
    dismissAction?: ShorthandValue<AlertDismissActionProps>;
    /** An alert may be formatted to display information. */
    info?: boolean;
    /**
     * Called after user will dismiss the alert.
     * @param event - React's original SyntheticEvent.
     * @param data - All props.
     */
    onVisibleChange?: ComponentEventHandler<AlertProps>;
    /**
     * Called after the alert is focused.
     * @param event - React's original SyntheticEvent.
     * @param data - All props.
     */
    onFocus?: ComponentEventHandler<AlertProps>;
    /** An alert can be formatted to display a successful message. */
    success?: boolean;
    /** An alert can be set to visible to force itself to be shown. */
    visible?: boolean;
    /** An alert can be formatted to display a warning message. */
    warning?: boolean;
    /** An alert can have a body that contains header and content elements. */
    body?: ShorthandValue<BoxProps>;
}
export declare type AlertStylesProps = Required<Pick<AlertProps, 'danger' | 'warning' | 'info' | 'success' | 'attached' | 'fitted' | 'dismissible' | 'visible'>>;
export declare const alertClassName = "ui-alert";
export declare const alertSlotClassNames: AlertSlotClassNames;
/**
 * An Alert displays a brief, important message to attract a user's attention without interrupting their current task.
 *
 * @accessibility
 * Implements [ARIA Alert](https://www.w3.org/TR/wai-aria-practices-1.1/#alert) design pattern.
 */
export declare const Alert: (<TExtendedElementType extends React.ElementType<any> = "div">(props: React.RefAttributes<HTMLDivElement> & Omit<import("@fluentui/react-bindings").PropsOfElement<TExtendedElementType>, "as" | keyof AlertProps> & {
    as?: TExtendedElementType;
} & AlertProps) => JSX.Element) & {
    propTypes?: React.WeakValidationMap<AlertProps> & {
        as: React.Requireable<string | ((props: any, context?: any) => any) | (new (props: any, context?: any) => any)>;
    };
    contextTypes?: PropTypes.ValidationMap<any>;
    /** A default value for the `visible` prop. */
    defaultProps?: Partial<AlertProps & {
        as: "div";
    }>;
    displayName?: string;
    readonly __PRIVATE_PROPS?: React.RefAttributes<HTMLDivElement> & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
        ref?: React.Ref<HTMLDivElement>;
    }, "as" | keyof AlertProps> & {
        as?: "div";
    } & AlertProps;
} & FluentComponentStaticProps<AlertProps> & {
    DismissAction: typeof AlertDismissAction;
};