'use strict';

var BaseComponent = require('primevue/basecomponent');
var Portal = require('primevue/portal');
var ToastEventBus = require('primevue/toasteventbus');
var utils = require('primevue/utils');
var CheckIcon = require('primevue/icons/check');
var ExclamationTriangleIcon = require('primevue/icons/exclamationtriangle');
var InfoCircleIcon = require('primevue/icons/infocircle');
var TimesIcon = require('primevue/icons/times');
var TimesCircleIcon = require('primevue/icons/timescircle');
var Ripple = require('primevue/ripple');
var vue = require('vue');

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

var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
var Portal__default = /*#__PURE__*/_interopDefaultLegacy(Portal);
var ToastEventBus__default = /*#__PURE__*/_interopDefaultLegacy(ToastEventBus);
var CheckIcon__default = /*#__PURE__*/_interopDefaultLegacy(CheckIcon);
var ExclamationTriangleIcon__default = /*#__PURE__*/_interopDefaultLegacy(ExclamationTriangleIcon);
var InfoCircleIcon__default = /*#__PURE__*/_interopDefaultLegacy(InfoCircleIcon);
var TimesIcon__default = /*#__PURE__*/_interopDefaultLegacy(TimesIcon);
var TimesCircleIcon__default = /*#__PURE__*/_interopDefaultLegacy(TimesCircleIcon);
var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);

var script$1 = {
    name: 'ToastMessage',
    extends: BaseComponent__default["default"],
    emits: ['close'],
    props: {
        message: {
            type: null,
            default: null
        },
        templates: {
            type: Object,
            default: null
        },
        closeIcon: {
            type: String,
            default: null
        },
        infoIcon: {
            type: String,
            default: null
        },
        warnIcon: {
            type: String,
            default: null
        },
        errorIcon: {
            type: String,
            default: null
        },
        successIcon: {
            type: String,
            default: null
        },
        closeButtonProps: {
            type: null,
            default: null
        }
    },
    closeTimeout: null,
    mounted() {
        if (this.message.life) {
            this.closeTimeout = setTimeout(() => {
                this.close({ message: this.message, type: 'life-end' });
            }, this.message.life);
        }
    },
    beforeUnmount() {
        this.clearCloseTimeout();
    },
    methods: {
        close(params) {
            this.$emit('close', params);
        },
        onCloseClick() {
            this.clearCloseTimeout();
            this.close({ message: this.message, type: 'close' });
        },
        clearCloseTimeout() {
            if (this.closeTimeout) {
                clearTimeout(this.closeTimeout);
                this.closeTimeout = null;
            }
        }
    },
    computed: {
        containerClass() {
            return [
                'p-toast-message',
                this.message.styleClass,
                {
                    'p-toast-message-info': this.message.severity === 'info',
                    'p-toast-message-warn': this.message.severity === 'warn',
                    'p-toast-message-error': this.message.severity === 'error',
                    'p-toast-message-success': this.message.severity === 'success'
                }
            ];
        },
        iconComponent() {
            return {
                info: !this.infoIcon && InfoCircleIcon__default["default"],
                success: !this.successIcon && CheckIcon__default["default"],
                warn: !this.warnIcon && ExclamationTriangleIcon__default["default"],
                error: !this.errorIcon && TimesCircleIcon__default["default"]
            }[this.message.severity];
        },
        iconClass() {
            return [
                {
                    [this.infoIcon]: this.message.severity === 'info',
                    [this.warnIcon]: this.message.severity === 'warn',
                    [this.errorIcon]: this.message.severity === 'error',
                    [this.successIcon]: this.message.severity === 'success'
                }
            ];
        },
        closeAriaLabel() {
            return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.close : undefined;
        }
    },
    components: {
        TimesIcon: TimesIcon__default["default"],
        InfoCircleIcon: InfoCircleIcon__default["default"],
        CheckIcon: CheckIcon__default["default"],
        ExclamationTriangleIcon: ExclamationTriangleIcon__default["default"],
        TimesCircleIcon: TimesCircleIcon__default["default"]
    },
    directives: {
        ripple: Ripple__default["default"]
    }
};

const _hoisted_1 = ["aria-label"];

function render$1(_ctx, _cache, $props, $setup, $data, $options) {
  const _directive_ripple = vue.resolveDirective("ripple");

  return (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
    class: $options.containerClass,
    role: "alert",
    "aria-live": "assertive",
    "aria-atomic": "true"
  }, _ctx.ptm('container')), [
    vue.createElementVNode("div", vue.mergeProps({
      class: ["p-toast-message-content", $props.message.contentStyleClass]
    }, _ctx.ptm('content')), [
      (!$props.templates.message)
        ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
            (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.icon ? $props.templates.icon : $options.iconComponent.name ? $options.iconComponent : 'span'), vue.mergeProps({
              class: [$options.iconClass, "p-toast-message-icon"]
            }, _ctx.ptm('icon')), null, 16 /* FULL_PROPS */, ["class"])),
            vue.createElementVNode("div", vue.mergeProps({ class: "p-toast-message-text" }, _ctx.ptm('text')), [
              vue.createElementVNode("span", vue.mergeProps({ class: "p-toast-summary" }, _ctx.ptm('summary')), vue.toDisplayString($props.message.summary), 17 /* TEXT, FULL_PROPS */),
              vue.createElementVNode("div", vue.mergeProps({ class: "p-toast-detail" }, _ctx.ptm('detail')), vue.toDisplayString($props.message.detail), 17 /* TEXT, FULL_PROPS */)
            ], 16 /* FULL_PROPS */)
          ], 64 /* STABLE_FRAGMENT */))
        : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.message), {
            key: 1,
            message: $props.message
          }, null, 8 /* PROPS */, ["message"])),
      ($props.message.closable !== false)
        ? (vue.openBlock(), vue.createElementBlock("div", vue.normalizeProps(vue.mergeProps({ key: 2 }, _ctx.ptm('buttonContainer'))), [
            vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
              class: "p-toast-icon-close p-link",
              type: "button",
              "aria-label": $options.closeAriaLabel,
              onClick: _cache[0] || (_cache[0] = (...args) => ($options.onCloseClick && $options.onCloseClick(...args))),
              autofocus: ""
            }, { ...$props.closeButtonProps, ..._ctx.ptm('button') }), [
              (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.closeicon || 'TimesIcon'), vue.mergeProps({
                class: ['p-toast-icon-close-icon', $props.closeIcon]
              }, _ctx.ptm('buttonIcon')), null, 16 /* FULL_PROPS */, ["class"]))
            ], 16 /* FULL_PROPS */, _hoisted_1)), [
              [_directive_ripple]
            ])
          ], 16 /* FULL_PROPS */))
        : vue.createCommentVNode("v-if", true)
    ], 16 /* FULL_PROPS */)
  ], 16 /* FULL_PROPS */))
}

script$1.render = render$1;
script$1.__file = "components/lib/toast/ToastMessage.vue";

var messageIdx = 0;

var script = {
    name: 'Toast',
    extends: BaseComponent__default["default"],
    inheritAttrs: false,
    emits: ['close', 'life-end'],
    props: {
        group: {
            type: String,
            default: null
        },
        position: {
            type: String,
            default: 'top-right'
        },
        autoZIndex: {
            type: Boolean,
            default: true
        },
        baseZIndex: {
            type: Number,
            default: 0
        },
        breakpoints: {
            type: Object,
            default: null
        },
        closeIcon: {
            type: String,
            default: undefined
        },
        infoIcon: {
            type: String,
            default: undefined
        },
        warnIcon: {
            type: String,
            default: undefined
        },
        errorIcon: {
            type: String,
            default: undefined
        },
        successIcon: {
            type: String,
            default: undefined
        },
        closeButtonProps: {
            type: null,
            default: null
        }
    },
    data() {
        return {
            messages: []
        };
    },
    styleElement: null,
    mounted() {
        ToastEventBus__default["default"].on('add', this.onAdd);
        ToastEventBus__default["default"].on('remove-group', this.onRemoveGroup);
        ToastEventBus__default["default"].on('remove-all-groups', this.onRemoveAllGroups);

        if (this.breakpoints) {
            this.createStyle();
        }
    },
    beforeUnmount() {
        this.destroyStyle();

        if (this.$refs.container && this.autoZIndex) {
            utils.ZIndexUtils.clear(this.$refs.container);
        }

        ToastEventBus__default["default"].off('add', this.onAdd);
        ToastEventBus__default["default"].off('remove-group', this.onRemoveGroup);
        ToastEventBus__default["default"].off('remove-all-groups', this.onRemoveAllGroups);
    },
    methods: {
        add(message) {
            if (message.id == null) {
                message.id = messageIdx++;
            }

            this.messages = [...this.messages, message];
        },
        remove(params) {
            let index = -1;

            for (let i = 0; i < this.messages.length; i++) {
                if (this.messages[i] === params.message) {
                    index = i;
                    break;
                }
            }

            this.messages.splice(index, 1);
            this.$emit(params.type, { message: params.message });
        },
        onAdd(message) {
            if (this.group == message.group) {
                this.add(message);
            }
        },
        onRemoveGroup(group) {
            if (this.group === group) {
                this.messages = [];
            }
        },
        onRemoveAllGroups() {
            this.messages = [];
        },
        onEnter() {
            this.$refs.container.setAttribute(this.attributeSelector, '');

            if (this.autoZIndex) {
                utils.ZIndexUtils.set('modal', this.$refs.container, this.baseZIndex || this.$primevue.config.zIndex.modal);
            }
        },
        onLeave() {
            if (this.$refs.container && this.autoZIndex && utils.ObjectUtils.isEmpty(this.messages)) {
                setTimeout(() => {
                    utils.ZIndexUtils.clear(this.$refs.container);
                }, 200);
            }
        },
        createStyle() {
            if (!this.styleElement) {
                this.styleElement = document.createElement('style');
                this.styleElement.type = 'text/css';
                document.head.appendChild(this.styleElement);

                let innerHTML = '';

                for (let breakpoint in this.breakpoints) {
                    let breakpointStyle = '';

                    for (let styleProp in this.breakpoints[breakpoint]) {
                        breakpointStyle += styleProp + ':' + this.breakpoints[breakpoint][styleProp] + '!important;';
                    }

                    innerHTML += `
                        @media screen and (max-width: ${breakpoint}) {
                            .p-toast[${this.attributeSelector}] {
                                ${breakpointStyle}
                            }
                        }
                    `;
                }

                this.styleElement.innerHTML = innerHTML;
            }
        },
        destroyStyle() {
            if (this.styleElement) {
                document.head.removeChild(this.styleElement);
                this.styleElement = null;
            }
        }
    },
    computed: {
        containerClass() {
            return [
                'p-toast p-component p-toast-' + this.position,
                {
                    'p-input-filled': this.$primevue.config.inputStyle === 'filled',
                    'p-ripple-disabled': this.$primevue.config.ripple === false
                }
            ];
        },
        attributeSelector() {
            return utils.UniqueComponentId();
        }
    },
    components: {
        ToastMessage: script$1,
        Portal: Portal__default["default"]
    }
};

function render(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_ToastMessage = vue.resolveComponent("ToastMessage");
  const _component_Portal = vue.resolveComponent("Portal");

  return (vue.openBlock(), vue.createBlock(_component_Portal, null, {
    default: vue.withCtx(() => [
      vue.createElementVNode("div", vue.mergeProps({
        ref: "container",
        class: $options.containerClass
      }, { ..._ctx.$attrs, ..._ctx.ptm('root') }), [
        vue.createVNode(vue.TransitionGroup, vue.mergeProps({
          name: "p-toast-message",
          tag: "div",
          onEnter: $options.onEnter,
          onLeave: $options.onLeave
        }, _ctx.ptm('message')), {
          default: vue.withCtx(() => [
            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($data.messages, (msg) => {
              return (vue.openBlock(), vue.createBlock(_component_ToastMessage, {
                key: msg.id,
                message: msg,
                templates: _ctx.$slots,
                closeIcon: $props.closeIcon,
                infoIcon: $props.infoIcon,
                warnIcon: $props.warnIcon,
                errorIcon: $props.errorIcon,
                successIcon: $props.successIcon,
                closeButtonProps: $props.closeButtonProps,
                onClose: _cache[0] || (_cache[0] = $event => ($options.remove($event))),
                pt: _ctx.pt
              }, null, 8 /* PROPS */, ["message", "templates", "closeIcon", "infoIcon", "warnIcon", "errorIcon", "successIcon", "closeButtonProps", "pt"]))
            }), 128 /* KEYED_FRAGMENT */))
          ]),
          _: 1 /* STABLE */
        }, 16 /* FULL_PROPS */, ["onEnter", "onLeave"])
      ], 16 /* FULL_PROPS */)
    ]),
    _: 1 /* STABLE */
  }))
}

function styleInject(css, ref) {
  if ( ref === void 0 ) ref = {};
  var insertAt = ref.insertAt;

  if (!css || typeof document === 'undefined') { return; }

  var head = document.head || document.getElementsByTagName('head')[0];
  var style = document.createElement('style');
  style.type = 'text/css';

  if (insertAt === 'top') {
    if (head.firstChild) {
      head.insertBefore(style, head.firstChild);
    } else {
      head.appendChild(style);
    }
  } else {
    head.appendChild(style);
  }

  if (style.styleSheet) {
    style.styleSheet.cssText = css;
  } else {
    style.appendChild(document.createTextNode(css));
  }
}

var css_248z = "\n.p-toast {\n    position: fixed;\n    width: 25rem;\n}\n.p-toast-message-content {\n    display: flex;\n    align-items: flex-start;\n}\n.p-toast-message-text {\n    flex: 1 1 auto;\n}\n.p-toast-top-right {\n    top: 20px;\n    right: 20px;\n}\n.p-toast-top-left {\n    top: 20px;\n    left: 20px;\n}\n.p-toast-bottom-left {\n    bottom: 20px;\n    left: 20px;\n}\n.p-toast-bottom-right {\n    bottom: 20px;\n    right: 20px;\n}\n.p-toast-top-center {\n    top: 20px;\n    left: 50%;\n    transform: translateX(-50%);\n}\n.p-toast-bottom-center {\n    bottom: 20px;\n    left: 50%;\n    transform: translateX(-50%);\n}\n.p-toast-center {\n    left: 50%;\n    top: 50%;\n    min-width: 20vw;\n    transform: translate(-50%, -50%);\n}\n.p-toast-icon-close {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-toast-icon-close.p-link {\n    cursor: pointer;\n}\n\n/* Animations */\n.p-toast-message-enter-from {\n    opacity: 0;\n    -webkit-transform: translateY(50%);\n    -ms-transform: translateY(50%);\n    transform: translateY(50%);\n}\n.p-toast-message-leave-from {\n    max-height: 1000px;\n}\n.p-toast .p-toast-message.p-toast-message-leave-to {\n    max-height: 0;\n    opacity: 0;\n    margin-bottom: 0;\n    overflow: hidden;\n}\n.p-toast-message-enter-active {\n    -webkit-transition: transform 0.3s, opacity 0.3s;\n    transition: transform 0.3s, opacity 0.3s;\n}\n.p-toast-message-leave-active {\n    -webkit-transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s;\n    transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s;\n}\n";
styleInject(css_248z);

script.render = render;
script.__file = "components/lib/toast/Toast.vue";

module.exports = script;
