import { defineComponent, shallowRef, computed, createVNode, Transition, withDirectives, vShow } from 'vue';
import { CheckCircleFilled, InfoCircleFilled, CloseCircleFilled, ExclamationCircleFilled, CheckCircleOutlined, InfoCircleOutlined, CloseCircleOutlined, ExclamationCircleOutlined, CloseOutlined } from '@ant-design/icons-vue';
import '../../../utils/index.mjs';
import '../../../vue-components/index.mjs';
import useConfigInject from '../../config-provider/src/hooks/useConfigInject.mjs';
import useStyle from '../style/index.mjs';
import { alertProps } from './props.mjs';
import { classNames } from '../../../utils/dom/class.mjs';
import { isValidElement } from '../../../utils/is.mjs';
import { cloneElement } from '../../../utils/vue/vnode.mjs';
import { getTransitionProps } from '../../../vue-components/transition/src/transition.mjs';

const iconMapFilled = {
  success: CheckCircleFilled,
  info: InfoCircleFilled,
  error: CloseCircleFilled,
  warning: ExclamationCircleFilled
};
const iconMapOutlined = {
  success: CheckCircleOutlined,
  info: InfoCircleOutlined,
  error: CloseCircleOutlined,
  warning: ExclamationCircleOutlined
};
var AAlert = /* @__PURE__ */ defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: "AAlert",
  inheritAttrs: false,
  props: alertProps(),
  setup(props, {
    slots,
    emit,
    attrs,
    expose
  }) {
    const {
      prefixCls,
      direction
    } = useConfigInject("alert", props);
    const [wrapSSR, hashId] = useStyle(prefixCls);
    const closing = shallowRef(false);
    const closed = shallowRef(false);
    const alertNode = shallowRef();
    const handleClose = (e) => {
      e.preventDefault();
      const dom = alertNode.value;
      dom.style.height = `${dom.offsetHeight}px`;
      dom.style.height = `${dom.offsetHeight}px`;
      closing.value = true;
      emit("close", e);
    };
    const animationEnd = () => {
      var _a;
      closing.value = false;
      closed.value = true;
      (_a = props.afterClose) == null ? void 0 : _a.call(props);
    };
    const mergedType = computed(() => {
      const {
        type
      } = props;
      if (type !== void 0)
        return type;
      return props.banner ? "warning" : "info";
    });
    expose({
      animationEnd
    });
    const motionStyle = shallowRef({});
    return () => {
      var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
      const {
        banner,
        closeIcon: customCloseIcon = (_a = slots.closeIcon) == null ? void 0 : _a.call(slots)
      } = props;
      let {
        closable,
        showIcon
      } = props;
      const closeText = (_c = props.closeText) != null ? _c : (_b = slots.closeText) == null ? void 0 : _b.call(slots);
      const description = (_e = props.description) != null ? _e : (_d = slots.description) == null ? void 0 : _d.call(slots);
      const message = (_g = props.message) != null ? _g : (_f = slots.message) == null ? void 0 : _f.call(slots);
      const icon = (_i = props.icon) != null ? _i : (_h = slots.icon) == null ? void 0 : _h.call(slots);
      const action = (_j = slots.action) == null ? void 0 : _j.call(slots);
      showIcon = banner && showIcon === void 0 ? true : showIcon;
      const IconType = (description ? iconMapOutlined : iconMapFilled)[mergedType.value] || null;
      if (closeText)
        closable = true;
      const prefixClsValue = prefixCls.value;
      const alertCls = classNames(prefixClsValue, {
        [`${prefixClsValue}-${mergedType.value}`]: true,
        [`${prefixClsValue}-closing`]: closing.value,
        [`${prefixClsValue}-with-description`]: !!description,
        [`${prefixClsValue}-no-icon`]: !showIcon,
        [`${prefixClsValue}-banner`]: !!banner,
        [`${prefixClsValue}-closable`]: closable,
        [`${prefixClsValue}-rtl`]: direction.value === "rtl",
        [hashId.value]: true
      });
      const closeIcon = closable ? createVNode("button", {
        "type": "button",
        "onClick": handleClose,
        "class": `${prefixClsValue}-close-icon`,
        "tabindex": 0
      }, [closeText ? createVNode("span", {
        "class": `${prefixClsValue}-close-text`
      }, [closeText]) : customCloseIcon === void 0 ? createVNode(CloseOutlined, null, null) : customCloseIcon]) : null;
      const iconNode = icon && (isValidElement(icon) ? cloneElement(icon, {
        class: `${prefixClsValue}-icon`
      }) : createVNode("span", {
        "class": `${prefixClsValue}-icon`
      }, [icon])) || createVNode(IconType, {
        "class": `${prefixClsValue}-icon`
      }, null);
      const transitionProps = getTransitionProps(`${prefixClsValue}-motion`, {
        appear: false,
        css: true,
        onAfterLeave: animationEnd,
        onBeforeLeave: (node) => {
          node.style.maxHeight = `${node.offsetHeight}px`;
        },
        onLeave: (node) => {
          node.style.maxHeight = "0px";
        }
      });
      return wrapSSR(closed.value ? null : createVNode(Transition, transitionProps, {
        default: () => [withDirectives(createVNode("div", {
          "role": "alert",
          ...attrs,
          "style": [attrs.style, motionStyle.value],
          "class": [attrs.class, alertCls],
          "data-show": !closing.value,
          "ref": alertNode
        }, [showIcon ? iconNode : null, createVNode("div", {
          "class": `${prefixClsValue}-content`
        }, [message ? createVNode("div", {
          "class": `${prefixClsValue}-message`
        }, [message]) : null, description ? createVNode("div", {
          "class": `${prefixClsValue}-description`
        }, [description]) : null]), action ? createVNode("div", {
          "class": `${prefixClsValue}-action`
        }, [action]) : null, closeIcon]), [[vShow, !closing.value]])]
      }));
    };
  }
});

export { AAlert as default };
//# sourceMappingURL=Alert.mjs.map
