Skip to content

[material-next][Snackbar] copy files to mui-material-next #39232

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
130 changes: 130 additions & 0 deletions packages/mui-material-next/src/Snackbar/Snackbar.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,130 @@
import * as React from 'react';
import { SxProps } from '@mui/system';
import { ClickAwayListenerProps } from '@mui/base/ClickAwayListener';
import { InternalStandardProps as StandardProps } from '@mui/material';
import { SnackbarContentProps } from '@mui/material/SnackbarContent';
import { TransitionProps } from '@mui/material/transitions';
import { Theme } from '../styles';
import { SnackbarClasses } from './snackbarClasses';

export interface SnackbarOrigin {
vertical: 'top' | 'bottom';
horizontal: 'left' | 'center' | 'right';
}

export type SnackbarCloseReason = 'timeout' | 'clickaway' | 'escapeKeyDown';

export interface SnackbarProps extends StandardProps<React.HTMLAttributes<HTMLDivElement>> {
/**
* The action to display. It renders after the message, at the end of the snackbar.
*/
action?: SnackbarContentProps['action'];
/**
* The anchor of the `Snackbar`.
* On smaller screens, the component grows to occupy all the available width,
* the horizontal alignment is ignored.
* @default { vertical: 'bottom', horizontal: 'left' }
*/
anchorOrigin?: SnackbarOrigin;
/**
* The number of milliseconds to wait before automatically calling the
* `onClose` function. `onClose` should then set the state of the `open`
* prop to hide the Snackbar. This behavior is disabled by default with
* the `null` value.
* @default null
*/
autoHideDuration?: number | null;
/**
* Replace the `SnackbarContent` component.
*/
children?: React.ReactElement<any, any>;
/**
* Override or extend the styles applied to the component.
*/
classes?: Partial<SnackbarClasses>;
/**
* Props applied to the `ClickAwayListener` element.
*/
ClickAwayListenerProps?: Partial<ClickAwayListenerProps>;
/**
* Props applied to the [`SnackbarContent`](/material-ui/api/snackbar-content/) element.
*/
ContentProps?: Partial<SnackbarContentProps>;
/**
* If `true`, the `autoHideDuration` timer will expire even if the window is not focused.
* @default false
*/
disableWindowBlurListener?: boolean;
/**
* When displaying multiple consecutive snackbars using a single parent-rendered
* `<Snackbar/>`, add the `key` prop to ensure independent treatment of each message.
* For instance, use `<Snackbar key={message} />`. Otherwise, messages might update
* in place, and features like `autoHideDuration` could be affected.
*/
key?: any;
/**
* The message to display.
*/
message?: SnackbarContentProps['message'];
/**
* Callback fired when the component requests to be closed.
* Typically `onClose` is used to set state in the parent component,
* which is used to control the `Snackbar` `open` prop.
* The `reason` parameter can optionally be used to control the response to `onClose`,
* for example ignoring `clickaway`.
*
* @param {React.SyntheticEvent<any> | Event} event The event source of the callback.
* @param {string} reason Can be: `"timeout"` (`autoHideDuration` expired), `"clickaway"`, or `"escapeKeyDown"`.
*/
onClose?: (event: React.SyntheticEvent<any> | Event, reason: SnackbarCloseReason) => void;
/**
* If `true`, the component is shown.
*/
open?: boolean;
/**
* The number of milliseconds to wait before dismissing after user interaction.
* If `autoHideDuration` prop isn't specified, it does nothing.
* If `autoHideDuration` prop is specified but `resumeHideDuration` isn't,
* we default to `autoHideDuration / 2` ms.
*/
resumeHideDuration?: number;
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx?: SxProps<Theme>;
/**
* The component used for the transition.
* [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
* @default Grow
*/
TransitionComponent?: React.JSXElementConstructor<
TransitionProps & { children: React.ReactElement<any, any> }
>;
/**
* The duration for the transition, in milliseconds.
* You may specify a single timeout for all transitions, or individually with an object.
* @default {
* enter: theme.transitions.duration.enteringScreen,
* exit: theme.transitions.duration.leavingScreen,
* }
*/
transitionDuration?: TransitionProps['timeout'];
/**
* Props applied to the transition element.
* By default, the element is based on this [`Transition`](http://reactcommunity.org/react-transition-group/transition/) component.
* @default {}
*/
TransitionProps?: TransitionProps;
}

/**
*
* Demos:
*
* - [Snackbar](https://mui.com/material-ui/react-snackbar/)
*
* API:
*
* - [Snackbar API](https://mui.com/material-ui/api/snackbar/)
*/
export default function Snackbar(props: SnackbarProps): JSX.Element;
Loading