@coreui/react/dist/cjs/components/toast/CToaster.js

UI Components Library for React.js

'use strict';

var tslib_es6 = require('../../node_modules/tslib/tslib.es6.js');
var React = require('react');
var PropTypes = require('prop-types');
var index = require('../../_virtual/index.js');
var CConditionalPortal = require('../conditional-portal/CConditionalPortal.js');

var CToaster = React.forwardRef(function (_a, ref) {
    var children = _a.children, className = _a.className, placement = _a.placement, push = _a.push, rest = tslib_es6.__rest(_a, ["children", "className", "placement", "push"]);
    var _b = React.useState([]), toasts = _b[0], setToasts = _b[1];
    var index$1 = React.useRef(0);
    React.useEffect(function () {
        index$1.current++;
        if (push) {
            addToast(push);
        }
    }, [push]);
    var addToast = function (push) {
        setToasts(function (state) { return tslib_es6.__spreadArray(tslib_es6.__spreadArray([], state, true), [
            React.cloneElement(push, {
                index: index$1.current,
                innerKey: index$1.current,
                onClose: function (index) {
                    return setToasts(function (state) { return state.filter(function (i) { return i.props.index !== index; }); });
                },
            }),
        ], false); });
    };
    return (React.createElement(CConditionalPortal.CConditionalPortal, { portal: typeof placement === 'string' }, toasts.length > 0 || children ? (React.createElement("div", tslib_es6.__assign({ className: index.default('toaster toast-container', {
            'position-fixed': placement,
            'top-0': placement && placement.includes('top'),
            'top-50 translate-middle-y': placement && placement.includes('middle'),
            'bottom-0': placement && placement.includes('bottom'),
            'start-0': placement && placement.includes('start'),
            'start-50 translate-middle-x': placement && placement.includes('center'),
            'end-0': placement && placement.includes('end'),
        }, className) }, rest, { ref: ref }),
        children,
        toasts.map(function (toast, index) { return React.cloneElement(toast, { visible: true, key: index }); }))) : null));
});
CToaster.propTypes = {
    children: PropTypes.node,
    className: PropTypes.string,
    placement: PropTypes.oneOfType([
        PropTypes.string,
        PropTypes.oneOf([
            'top-start',
            'top-center',
            'top-end',
            'middle-start',
            'middle-center',
            'middle-end',
            'bottom-start',
            'bottom-center',
            'bottom-end',
        ]),
    ]),
    push: PropTypes.any,
};
CToaster.displayName = 'CToaster';

exports.CToaster = CToaster;
//# sourceMappingURL=CToaster.js.map