@vlinderclimate/net-zero-ui/components/Snackbar.js

<div align="center"> <img src="https://storage.yandexcloud.net/static.vlinderstorage.com/Telegram_VlinderTech.png" width=200 /> </div> <h1 align="center">Net Zero UI kit</h1>

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var tslib_es6 = require('../tslib.es6-9240d9d1.js');
var jsxRuntime = require('react/jsx-runtime');
var React = require('react');
var styles = require('@mui/material/styles');
var MuiBox = require('@mui/material/Box');
var MuiSnackbar = require('@mui/material/Snackbar');
var components_Alert = require('./Alert.js');
var components_IconButton = require('./IconButton.js');
require('@mui/material/Alert');
require('../theme/colors.js');
require('@mui/material/IconButton');
require('./Icon.js');
require('../icons/ArrowLeft.js');
require('../icons/ArrowRight.js');
require('../icons/CheckCircle.js');
require('../icons/CloseCircle.js');
require('../icons/InfoCircle.js');
require('../icons/ErrorCircle.js');
require('../icons/Attention.js');
require('../icons/HelpCircle.js');
require('../icons/Lock.js');
require('../icons/Delete.js');
require('../icons/TriangleRight.js');
require('../icons/TriangleLeft.js');
require('../icons/TriangleUp.js');
require('../icons/TriangleDown.js');
require('../icons/Download.js');
require('../icons/Key.js');
require('../icons/Edit.js');
require('../icons/Expand.js');
require('../icons/Collapse.js');
require('../icons/Success.js');
require('../icons/Fail.js');
require('../icons/Loading.js');
require('../icons/Check.js');
require('../icons/ChevronLeft.js');
require('../icons/ChevronRight.js');
require('../icons/Plus.js');
require('../icons/Minus.js');
require('../icons/Link.js');
require('../icons/Copy.js');
require('../icons/Medium.js');
require('../icons/Twitter.js');
require('../icons/Telegram.js');
require('../icons/Sort.js');
require('../icons/Close.js');
require('../icons/Search.js');
require('../icons/Instagram.js');
require('../icons/LinkedIn.js');
require('../icons/Reddit.js');
require('../icons/YouTube.js');
require('../icons/Update.js');
require('../icons/Facebook.js');
require('../icons/Cart.js');
require('../icons/Menu.js');
require('../icons/ShowPassword.js');
require('../icons/HidePassword.js');
require('../icons/Collection.js');
require('../icons/Sprout.js');
require('../icons/Verify.js');
require('../icons/User.js');
require('../icons/Convert.js');
require('../icons/Deposit.js');
require('../icons/Send.js');
require('../icons/Receive.js');
require('../icons/To.js');
require('../icons/Withdraw.js');
require('../icons/Clock.js');
require('../icons/Play.js');
require('../icons/Help.js');
require('../icons/CloseSmall.js');
require('../icons/MinusSmall.js');
require('../icons/PlusSmall.js');
require('../icons/Dropdown.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var MuiBox__default = /*#__PURE__*/_interopDefaultLegacy(MuiBox);
var MuiSnackbar__default = /*#__PURE__*/_interopDefaultLegacy(MuiSnackbar);

var AlertBox = styles.styled(MuiBox__default["default"])(function (_a) {
    var theme = _a.theme;
    return ({
        display: "flex",
        alignItems: "center",
        justifyContent: "space-between",
        gap: theme.spacing(2),
        ".MuiPaper-root": {
            backgroundColor: theme.palette.gray[800],
            color: theme.palette.gray.white
        }
    });
});
var StyledAlert = styles.styled(components_Alert["default"])(function (_a) {
    var theme = _a.theme;
    return ({
        backgroundColor: theme.palette.gray[800],
        paddingBlock: theme.spacing(2),
        lineHeight: 1,
        display: "flex",
        alignItems: "center",
        div: {
            color: theme.palette.gray.white
        },
        button: {
            "&:hover .icon path": {
                fill: theme.palette.gray.white
            }
        }
    });
});
var Snackbar = React.forwardRef(function (_a, ref) {
    var open = _a.open, onClose = _a.onClose, alertProps = _a.alertProps, children = _a.children, action = _a.action, props = tslib_es6.__rest(_a, ["open", "onClose", "alertProps", "children", "action"]);
    var handleClose = React.useCallback(function (event, reason) {
        if (onClose)
            onClose(event, reason);
    }, [onClose]);
    var ActionElement = function () {
        if (action && action !== "close")
            return action;
        return (jsxRuntime.jsx(components_IconButton["default"], { iconProps: { iconKey: "close", size: "sm", color: "secondary" }, sx: { padding: 0 }, onClick: function (event) { return handleClose(event, "closeAction"); } }, void 0));
    };
    return (jsxRuntime.jsx(MuiSnackbar__default["default"], tslib_es6.__assign({ open: open, anchorOrigin: { vertical: "bottom", horizontal: "left" } }, props, { onClose: onClose, ref: ref }, { children: jsxRuntime.jsx(StyledAlert, tslib_es6.__assign({ rounded: false }, alertProps, { children: jsxRuntime.jsxs(AlertBox, { children: [jsxRuntime.jsx(MuiBox__default["default"], tslib_es6.__assign({ flexGrow: 1 }, { children: children }), void 0), action && (jsxRuntime.jsx(MuiBox__default["default"], tslib_es6.__assign({ display: "flex", alignItems: "center" }, { children: jsxRuntime.jsx(ActionElement, {}, void 0) }), void 0))] }, void 0) }), void 0) }), void 0));
});

exports["default"] = Snackbar;