UNPKG

4.42 kBTypeScriptView Raw
1import * as React from 'react';
2import { SxProps } from '@mui/system';
3import { FadeProps } from '../Fade';
4import { TransitionProps } from '../transitions/transition';
5import { Theme } from '../styles';
6import { BackdropClasses } from './backdropClasses';
7import { OverridableComponent, OverrideProps } from '../OverridableComponent';
8import { CreateSlotsAndSlotProps, SlotProps } from '../utils/types';
9
10export interface BackdropSlots {
11 /**
12 * The component that renders the root.
13 * @default 'div'
14 */
15 root: React.ElementType;
16 /**
17 * The component that renders the transition.
18 * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
19 * @default Fade
20 */
21 transition: React.JSXElementConstructor<
22 TransitionProps & { children: React.ReactElement<unknown, any> }
23 >;
24}
25export interface BackdropComponentsPropsOverrides {}
26
27export interface BackdropTransitionSlotPropsOverrides {}
28
29export type BackdropSlotsAndSlotProps = CreateSlotsAndSlotProps<
30 BackdropSlots,
31 {
32 root: SlotProps<
33 React.ElementType<HTMLDivElement>,
34 BackdropComponentsPropsOverrides,
35 BackdropOwnerState
36 >;
37 transition: SlotProps<
38 React.JSXElementConstructor<TransitionProps>,
39 BackdropTransitionSlotPropsOverrides,
40 BackdropOwnerState
41 >;
42 }
43>;
44
45export interface BackdropOwnProps
46 extends Partial<Omit<FadeProps, 'children'>>,
47 BackdropSlotsAndSlotProps {
48 /**
49 * The content of the component.
50 */
51 children?: React.ReactNode;
52 /**
53 * The components used for each slot inside.
54 *
55 * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
56 *
57 * @default {}
58 */
59 components?: {
60 Root?: React.ElementType;
61 };
62 /**
63 * The extra props for the slot components.
64 * You can override the existing props or add new ones.
65 *
66 * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
67 *
68 * @default {}
69 */
70 componentsProps?: {
71 root?: React.HTMLAttributes<HTMLDivElement> & BackdropComponentsPropsOverrides;
72 };
73 /**
74 * Override or extend the styles applied to the component.
75 */
76 classes?: Partial<BackdropClasses>;
77 /**
78 * If `true`, the backdrop is invisible.
79 * It can be used when rendering a popover or a custom select component.
80 * @default false
81 */
82 invisible?: boolean;
83 /**
84 * If `true`, the component is shown.
85 */
86 open: boolean;
87 /**
88 * The system prop that allows defining system overrides as well as additional CSS styles.
89 */
90 sx?: SxProps<Theme>;
91 /**
92 * The duration for the transition, in milliseconds.
93 * You may specify a single timeout for all transitions, or individually with an object.
94 */
95 transitionDuration?: TransitionProps['timeout'];
96 /**
97 * The component used for the transition.
98 * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
99 * @default Fade
100 */
101 TransitionComponent?: React.JSXElementConstructor<
102 TransitionProps & {
103 children: React.ReactElement<unknown, any>;
104 }
105 >;
106}
107
108export interface BackdropTypeMap<
109 AdditionalProps = {},
110 RootComponent extends React.ElementType = 'div',
111> {
112 props: AdditionalProps & BackdropOwnProps;
113 defaultComponent: RootComponent;
114}
115
116type BackdropRootProps = NonNullable<BackdropTypeMap['props']['componentsProps']>['root'];
117
118export declare const BackdropRoot: React.FC<BackdropRootProps>;
119
120/**
121 *
122 * Demos:
123 *
124 * - [Backdrop](https://mui.com/material-ui/react-backdrop/)
125 *
126 * API:
127 *
128 * - [Backdrop API](https://mui.com/material-ui/api/backdrop/)
129 * - inherits [Fade API](https://mui.com/material-ui/api/fade/)
130 */
131declare const Backdrop: OverridableComponent<BackdropTypeMap>;
132
133export type BackdropProps<
134 RootComponent extends React.ElementType = BackdropTypeMap['defaultComponent'],
135 AdditionalProps = {},
136> = OverrideProps<BackdropTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
137 component?: React.ElementType;
138};
139
140export interface BackdropOwnerState extends BackdropProps {}
141
142export default Backdrop;