"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.toasterWidth = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = __importDefault(require("react"));
const box_1 = require("../box");
const core_1 = require("../core");
const theme_1 = require("../theme");
exports.toasterWidth = 420;
const Toaster = () => {
    var _a, _b, _c;
    const { toasts } = (0, core_1.useVuiContext)();
    const padding = { md: '16px', sm: '4px', xs: '2px' };
    const right = { md: '1rem', sm: 0, xs: 0 };
    const width = { md: exports.toasterWidth, sm: exports.toasterWidth, xs: '100%' };
    const bottom = ((_a = toasts === null || toasts === void 0 ? void 0 : toasts.list) === null || _a === void 0 ? void 0 : _a.length) ? '1rem' : '-2rem';
    return ((0, jsx_runtime_1.jsx)(box_1.Box, { bottom: bottom, className: "vui-toaster", display: "block", maxW: width, minW: width, p: padding, position: "fixed", right: right, zIndex: theme_1.zIndices.toast, children: (_c = (_b = toasts === null || toasts === void 0 ? void 0 : toasts.list) === null || _b === void 0 ? void 0 : _b.map) === null || _c === void 0 ? void 0 : _c.call(_b, (toast) => ((0, jsx_runtime_1.jsx)(core_1.v.div, { id: `toast_${toast.id}`, children: toast.component }, toast.id))) }));
};
exports.default = react_1.default.memo(Toaster);
//# sourceMappingURL=toast.js.map