"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1 = require("vue");
const icons_1 = require("../../_internal/icons");
const _internal_1 = require("../../_internal");
const _utils_1 = require("../../_utils");
const _mixins_1 = require("../../_mixins");
const styles_1 = require("../styles");
const message_props_1 = require("./message-props");
const MessageProvider_1 = require("./MessageProvider");
const index_cssr_1 = require("./styles/index.cssr");
const iconMap = {
    info: vue_1.h(icons_1.InfoIcon, null),
    success: vue_1.h(icons_1.SuccessIcon, null),
    warning: vue_1.h(icons_1.WarningIcon, null),
    error: vue_1.h(icons_1.ErrorIcon, null)
};
exports.default = vue_1.defineComponent({
    name: 'Message',
    props: message_props_1.messageProps,
    setup(props) {
        const { props: messageProviderProps, mergedClsPrefixRef
        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         } = vue_1.inject(MessageProvider_1.messageProviderInjectionKey);
        const themeRef = _mixins_1.useTheme('Message', 'Message', index_cssr_1.default, styles_1.messageLight, messageProviderProps, mergedClsPrefixRef);
        return {
            mergedClsPrefix: mergedClsPrefixRef,
            handleClose() {
                var _a;
                (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
            },
            cssVars: vue_1.computed(() => {
                const { type } = props;
                const { common: { cubicBezierEaseInOut }, self: { padding, margin, maxWidth, iconMargin, closeMargin, closeSize, iconSize, fontSize, lineHeight, borderRadius, iconColorInfo, iconColorSuccess, iconColorWarning, iconColorError, iconColorLoading, [_utils_1.createKey('textColor', type)]: textColor, [_utils_1.createKey('boxShadow', type)]: boxShadow, [_utils_1.createKey('color', type)]: color, [_utils_1.createKey('closeColor', type)]: closeColor, [_utils_1.createKey('closeColorPressed', type)]: closeColorPressed, [_utils_1.createKey('closeColorHover', type)]: closeColorHover } } = themeRef.value;
                return {
                    '--bezier': cubicBezierEaseInOut,
                    '--margin': margin,
                    '--padding': padding,
                    '--max-width': maxWidth,
                    '--font-size': fontSize,
                    '--icon-margin': iconMargin,
                    '--icon-size': iconSize,
                    '--close-size': closeSize,
                    '--close-margin': closeMargin,
                    '--text-color': textColor,
                    '--color': color,
                    '--box-shadow': boxShadow,
                    '--icon-color-info': iconColorInfo,
                    '--icon-color-success': iconColorSuccess,
                    '--icon-color-warning': iconColorWarning,
                    '--icon-color-error': iconColorError,
                    '--icon-color-loading': iconColorLoading,
                    '--close-color': closeColor,
                    '--close-color-pressed': closeColorPressed,
                    '--close-color-hover': closeColorHover,
                    '--line-height': lineHeight,
                    '--border-radius': borderRadius
                };
            })
        };
    },
    render() {
        const { icon, type, closable, content, mergedClsPrefix, cssVars, handleClose } = this;
        return (vue_1.h("div", { class: `${mergedClsPrefix}-message-wrapper`, style: cssVars },
            vue_1.h("div", { class: `${mergedClsPrefix}-message` },
                vue_1.h("div", { class: `${mergedClsPrefix}-message__icon ${mergedClsPrefix}-message__icon--${type}-type` },
                    vue_1.h(_internal_1.NIconSwitchTransition, null, {
                        default: () => [createIconVNode(icon, type, mergedClsPrefix)]
                    })),
                vue_1.h("div", { class: `${mergedClsPrefix}-message__content` }, vue_1.h(_utils_1.render, {
                    render: content
                })),
                closable ? (vue_1.h(_internal_1.NBaseClose, { clsPrefix: mergedClsPrefix, class: `${mergedClsPrefix}-message__close`, onClick: handleClose })) : null)));
    }
});
function createIconVNode(icon, type, clsPrefix) {
    if (typeof icon === 'function') {
        return icon();
    }
    else {
        return (vue_1.h(_internal_1.NBaseIcon, { clsPrefix: clsPrefix, key: type }, {
            default: () => type === 'loading' ? (vue_1.h(_internal_1.NBaseLoading, { clsPrefix: clsPrefix, strokeWidth: 24, scale: 0.85 })) : (iconMap[type])
        }));
    }
}
