Spaces:
Sleeping
Sleeping
File size: 4,790 Bytes
56fda74 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 |
import * as React from 'react';
import { OverridableStringUnion } from '@mui/types';
import { SxProps } from '@mui/system';
import { IconButtonProps, InternalStandardProps as StandardProps, SvgIconProps, Theme } from '..';
import { PaperProps } from '../Paper';
import { AlertClasses } from './alertClasses';
import { CreateSlotsAndSlotProps, SlotProps } from '../utils/types';
export type AlertColor = 'success' | 'info' | 'warning' | 'error';
export interface AlertPropsVariantOverrides {}
export interface AlertPropsColorOverrides {}
export interface AlertCloseButtonSlotPropsOverrides {}
export interface AlertCloseIconSlotPropsOverrides {}
export interface AlertSlots {
/**
* The component that renders the close button.
* @default IconButton
*/
closeButton?: React.ElementType;
/**
* The component that renders the close icon.
* @default svg
*/
closeIcon?: React.ElementType;
}
export type AlertSlotsAndSlotProps = CreateSlotsAndSlotProps<
AlertSlots,
{
closeButton: SlotProps<
React.ElementType<IconButtonProps>,
AlertCloseButtonSlotPropsOverrides,
AlertOwnerState
>;
closeIcon: SlotProps<
React.ElementType<SvgIconProps>,
AlertCloseIconSlotPropsOverrides,
AlertOwnerState
>;
}
>;
export interface AlertProps extends StandardProps<PaperProps, 'variant'>, AlertSlotsAndSlotProps {
/**
* The action to display. It renders after the message, at the end of the alert.
*/
action?: React.ReactNode;
/**
* Override or extend the styles applied to the component.
*/
classes?: Partial<AlertClasses>;
/**
* Override the default label for the *close popup* icon button.
*
* For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
* @default 'Close'
*/
closeText?: string;
/**
* The color of the component. Unless provided, the value is taken from the `severity` prop.
* It supports both default and custom theme colors, which can be added as shown in the
* [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
*/
color?: OverridableStringUnion<AlertColor, AlertPropsColorOverrides>;
/**
* The components used for each slot inside.
*
* @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
*
* @default {}
*/
components?: {
CloseButton?: React.ElementType;
CloseIcon?: React.ElementType;
};
/**
* The extra props for the slot components.
* You can override the existing props or add new ones.
*
* @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
*
* @default {}
*/
componentsProps?: {
closeButton?: IconButtonProps;
closeIcon?: SvgIconProps;
};
/**
* The severity of the alert. This defines the color and icon used.
* @default 'success'
*/
severity?: OverridableStringUnion<AlertColor, AlertPropsColorOverrides>;
/**
* Override the icon displayed before the children.
* Unless provided, the icon is mapped to the value of the `severity` prop.
* Set to `false` to remove the `icon`.
*/
icon?: React.ReactNode;
/**
* The ARIA role attribute of the element.
* @default 'alert'
*/
role?: string;
/**
* The component maps the `severity` prop to a range of different icons,
* for instance success to `<SuccessOutlined>`.
* If you wish to change this mapping, you can provide your own.
* Alternatively, you can use the `icon` prop to override the icon displayed.
*/
iconMapping?: Partial<
Record<OverridableStringUnion<AlertColor, AlertPropsColorOverrides>, React.ReactNode>
>;
/**
* Callback fired when the component requests to be closed.
* When provided and no `action` prop is set, a close icon button is displayed that triggers the callback when clicked.
* @param {React.SyntheticEvent} event The event source of the callback.
*/
onClose?: (event: React.SyntheticEvent) => void;
/**
* The variant to use.
* @default 'standard'
*/
variant?: OverridableStringUnion<'standard' | 'filled' | 'outlined', AlertPropsVariantOverrides>;
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx?: SxProps<Theme>;
}
export interface AlertOwnerState extends AlertProps {}
/**
*
* Demos:
*
* - [Alert](https://mui.com/material-ui/react-alert/)
*
* API:
*
* - [Alert API](https://mui.com/material-ui/api/alert/)
* - inherits [Paper API](https://mui.com/material-ui/api/paper/)
*/
export default function Alert(props: AlertProps): React.JSX.Element;
|