@itwin/itwinui-react/esm/core/Alert/Alert.d.ts

A react component library for iTwinUI

import * as React from 'react';
import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
type AlertOwnProps = {
    /**
     * Type of the alert.
     * @default 'informational'
     */
    type?: 'positive' | 'warning' | 'negative' | 'informational';
    /**
     * Stick the alert to the top.
     * @default false
     */
    isSticky?: boolean;
};
type AlertLegacyProps = {
    /** @deprecated Use `Alert.Action` subcomponent. */
    clickableText?: React.ReactNode;
    /** @deprecated Use `Alert.Action` subcomponent. */
    clickableTextProps?: React.ComponentPropsWithoutRef<'a'>;
    /** @deprecated Use `Alert.CloseButton` subcomponent. */
    onClose?: () => void;
};
/**
 * A small box to quickly grab user attention and communicate a brief message
 * @example
 * <Alert>This is an alert.</Alert>
 * @example
 * <Alert.Wrapper type='informational'>
 *  <Alert.Icon />
 *  <Alert.Message>This is an informational alert.</Alert.Message>
 *  <Alert.CloseButton onClick={() => {}} />
 * </Alert.Wrapper>
 * @example
 * <Alert.Wrapper type='positive'>
 *  <Alert.Icon>
 *    <SvgSmileyHappy />
 *  </Alert.Icon>
 *  <Alert.Message>
 *    This is an alert.
 *    <Alert.Action>This is clickable text.</Alert.Action>
 *  </Alert.Message>
 *  <Alert.CloseButton onClick={() => {}}>
 *    <SvgCollapse />
 *  </Alert.CloseButton>
 * </Alert.Wrapper>
 */
export declare const Alert: PolymorphicForwardRefComponent<"div", AlertOwnProps & AlertLegacyProps> & {
    /**
     *  Alert wrapper subcomponent
     */
    Wrapper: PolymorphicForwardRefComponent<"div", AlertOwnProps>;
    /**
     * 	Alert icon subcomponent
     */
    Icon: PolymorphicForwardRefComponent<"span", Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "fill" | "as" | "key" | "size" | keyof React.HTMLAttributes<HTMLSpanElement> | "padded"> & {
        size?: "auto" | "small" | "medium" | "large" | import("../../utils/types.js").AnyString;
        fill?: "default" | "positive" | "informational" | "negative" | "warning" | import("../../utils/types.js").AnyString;
        padded?: boolean;
    } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
        as?: "span" | undefined;
    }>;
    /**
     * 	Alert message subcomponent
     */
    Message: PolymorphicForwardRefComponent<"span", {}>;
    /**
     * 	Alert action subcomponent for the link you want to provide.
     */
    Action: PolymorphicForwardRefComponent<"a", {}>;
    /**
     * 	Alert close button subcomponent
     */
    CloseButton: PolymorphicForwardRefComponent<"button", {}>;
};
export {};