@octopusdeploy/design-system-components/dist/src/components/Snackbar/Snackbar.js

The design systems component library.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Snackbar = Snackbar;
exports.DeprecatedCustomSnackbar = DeprecatedCustomSnackbar;
const jsx_runtime_1 = require("react/jsx-runtime");
const css_1 = require("@emotion/css");
const material_1 = require("@mui/material");
const design_system_tokens_1 = require("@octopusdeploy/design-system-tokens");
function Snackbar({ open, content, size, onClose, autoHideDuration, textAlign, onExited }) {
    return ((0, jsx_runtime_1.jsx)(material_1.Snackbar, { open: open, message: content, classes: { root: (0, css_1.cx)({ [wideStyles]: size === "large" }) }, autoHideDuration: autoHideDuration, onClose: onClose, TransitionComponent: SlideUp, TransitionProps: { onExited }, ContentProps: { classes: { root: (0, css_1.cx)(contentStyles, { [alignedCenterStyles]: textAlign === "center" }) } }, anchorOrigin: { vertical: "bottom", horizontal: "center" } }));
}
/* @deprecated
Deprecated: 12/01/2026
Replacement: Snackbar
Reason: This component and will be removed in a future release, where possible use the Snackbar component instead.
*/
function DeprecatedCustomSnackbar({ open, children, size, onClose, autoHideDuration }) {
    return ((0, jsx_runtime_1.jsx)(material_1.Snackbar, { open: open, classes: { root: (0, css_1.cx)({ [wideStyles]: size === "large" }) }, autoHideDuration: autoHideDuration, onClose: onClose, TransitionComponent: SlideUp, anchorOrigin: { vertical: "bottom", horizontal: "center" }, children: (0, jsx_runtime_1.jsx)("div", { children: children }) }));
}
const materialSnackbarClasses = {
    root: "MuiSnackbar-root",
    contentRoot: "MuiSnackbarContent-root",
    contentMessage: "MuiSnackbarContent-message",
};
const wideStyles = (0, css_1.css)({
    [`&.${materialSnackbarClasses.root}`]: {
        width: "60%",
        margin: design_system_tokens_1.space[24],
        bottom: 0,
        display: "block",
    },
});
const alignedCenterStyles = (0, css_1.css)({
    [`.${materialSnackbarClasses.contentMessage}`]: {
        textAlign: "center",
        width: "100%",
    },
});
const contentStyles = (0, css_1.css)({
    [`&.${materialSnackbarClasses.contentRoot}`]: {
        backgroundColor: design_system_tokens_1.themeTokens.color.background.inverse.primary,
        color: design_system_tokens_1.themeTokens.color.text.inverse.primary,
    },
});
function SlideUp(props) {
    return (0, jsx_runtime_1.jsx)(material_1.Slide, { ...props, direction: "up" });
}