element-plus 1.2.0-beta.6 → 1.3.0-beta.1

package/lib/components/message/src/message.js.map

@@ -1 +1 @@
-{"version":3,"file":"message.js","sources":["../../../../../../packages/components/message/src/message.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils/props'\n\nimport type { VNode, ExtractPropTypes, Component } from 'vue'\n\nexport const messageTypes = ['success', 'info', 'warning', 'error'] as const\n\nexport const messageProps = buildProps({\n  customClass: {\n    type: String,\n    default: '',\n  },\n  center: {\n    type: Boolean,\n    default: false,\n  },\n  dangerouslyUseHTMLString: {\n    type: Boolean,\n    default: false,\n  },\n  duration: {\n    type: Number,\n    default: 3000,\n  },\n  icon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: '',\n  },\n  id: {\n    type: String,\n    default: '',\n  },\n  message: {\n    type: definePropType<string | VNode>([String, Object]),\n    default: '',\n  },\n  onClose: {\n    type: definePropType<() => void>(Function),\n    required: false,\n  },\n  showClose: {\n    type: Boolean,\n    default: false,\n  },\n  type: {\n    type: String,\n    values: messageTypes,\n    default: 'info',\n  },\n  offset: {\n    type: Number,\n    default: 20,\n  },\n  zIndex: {\n    type: Number,\n    default: 0,\n  },\n  grouping: {\n    type: Boolean,\n    default: false,\n  },\n  repeatNum: {\n    type: Number,\n    default: 1,\n  },\n} as const)\nexport type MessageProps = ExtractPropTypes<typeof messageProps>\n\nexport const messageEmits = {\n  destroy: () => true,\n}\nexport type MessageEmits = typeof messageEmits\n\nexport type MessageOptions = Omit<MessageProps, 'id'> & {\n  appendTo?: HTMLElement | string\n}\nexport type MessageOptionsTyped = Omit<MessageOptions, 'type'>\n\nexport interface MessageHandle {\n  close: () => void\n}\n\nexport type MessageParams = Partial<MessageOptions> | string | VNode\nexport type MessageParamsTyped = Partial<MessageOptionsTyped> | string | VNode\n\nexport type MessageFn = ((options?: MessageParams) => MessageHandle) & {\n  closeAll(): void\n}\nexport type MessageTypedFn = (options?: MessageParamsTyped) => MessageHandle\n\nexport interface Message extends MessageFn {\n  success: MessageTypedFn\n  warning: MessageTypedFn\n  info: MessageTypedFn\n  error: MessageTypedFn\n}\n\ntype MessageQueueItem = {\n  vm: VNode\n}\n\nexport type MessageQueue = MessageQueueItem[]\n"],"names":["buildProps","definePropType"],"mappings":";;;;;;MAIa,eAAe,CAAC,WAAW,QAAQ,WAAW;MAE9C,eAAeA,iBAAW;AAAA,EACrC,aAAa;AAAA,IACX,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,0BAA0B;AAAA,IACxB,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,UAAU;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,MAAM;AAAA,IACJ,MAAMC,qBAAmC,CAAC,QAAQ;AAAA,IAClD,SAAS;AAAA;AAAA,EAEX,IAAI;AAAA,IACF,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,SAAS;AAAA,IACP,MAAMA,qBAA+B,CAAC,QAAQ;AAAA,IAC9C,SAAS;AAAA;AAAA,EAEX,SAAS;AAAA,IACP,MAAMA,qBAA2B;AAAA,IACjC,UAAU;AAAA;AAAA,EAEZ,WAAW;AAAA,IACT,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA;AAAA,EAEX,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,UAAU;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,WAAW;AAAA,IACT,MAAM;AAAA,IACN,SAAS;AAAA;AAAA;MAKA,eAAe;AAAA,EAC1B,SAAS,MAAM;AAAA;;;;;;"}
+{"version":3,"file":"message.js","sources":["../../../../../../packages/components/message/src/message.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils/props'\n\nimport type { VNode, ExtractPropTypes, Component } from 'vue'\n\nexport const messageTypes = ['success', 'info', 'warning', 'error'] as const\n\nexport const messageProps = buildProps({\n  customClass: {\n    type: String,\n    default: '',\n  },\n  center: {\n    type: Boolean,\n    default: false,\n  },\n  dangerouslyUseHTMLString: {\n    type: Boolean,\n    default: false,\n  },\n  duration: {\n    type: Number,\n    default: 3000,\n  },\n  icon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: '',\n  },\n  id: {\n    type: String,\n    default: '',\n  },\n  message: {\n    type: definePropType<string | VNode>([String, Object]),\n    default: '',\n  },\n  onClose: {\n    type: definePropType<() => void>(Function),\n    required: false,\n  },\n  showClose: {\n    type: Boolean,\n    default: false,\n  },\n  type: {\n    type: String,\n    values: messageTypes,\n    default: 'info',\n  },\n  offset: {\n    type: Number,\n    default: 20,\n  },\n  zIndex: {\n    type: Number,\n    default: 0,\n  },\n  grouping: {\n    type: Boolean,\n    default: false,\n  },\n  repeatNum: {\n    type: Number,\n    default: 1,\n  },\n} as const)\nexport type MessageProps = ExtractPropTypes<typeof messageProps>\n\nexport const messageEmits = {\n  destroy: () => true,\n}\nexport type MessageEmits = typeof messageEmits\n\nexport type MessageOptions = Omit<MessageProps, 'id'> & {\n  appendTo?: HTMLElement | string\n}\nexport type MessageOptionsTyped = Omit<MessageOptions, 'type'>\n\nexport interface MessageHandle {\n  close: () => void\n}\n\nexport type MessageParams = Partial<MessageOptions> | string | VNode\nexport type MessageParamsTyped = Partial<MessageOptionsTyped> | string | VNode\n\nexport type MessageFn = ((options?: MessageParams) => MessageHandle) & {\n  closeAll(): void\n}\nexport type MessageTypedFn = (options?: MessageParamsTyped) => MessageHandle\n\nexport interface Message extends MessageFn {\n  success: MessageTypedFn\n  warning: MessageTypedFn\n  info: MessageTypedFn\n  error: MessageTypedFn\n}\n\ntype MessageQueueItem = {\n  vm: VNode\n}\n\nexport type MessageQueue = MessageQueueItem[]\n"],"names":["buildProps","definePropType"],"mappings":";;;;;;AACY,MAAC,YAAY,GAAG,CAAC,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE;AACxD,MAAC,YAAY,GAAGA,gBAAU,CAAC;AACvC,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,wBAAwB,EAAE;AAC5B,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAEC,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,EAAE,EAAE;AACN,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAEA,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAEA,oBAAc,CAAC,QAAQ,CAAC;AAClC,IAAI,QAAQ,EAAE,KAAK;AACnB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,YAAY;AACxB,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,CAAC,EAAE;AACS,MAAC,YAAY,GAAG;AAC5B,EAAE,OAAO,EAAE,MAAM,IAAI;AACrB;;;;;;"}

package/lib/components/message/src/message.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"message.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/message/src/message.vue"],"sourcesContent":["<template>\n  <transition\n    name=\"el-message-fade\"\n    @before-leave=\"onClose\"\n    @after-leave=\"$emit('destroy')\"\n  >\n    <div\n      v-show=\"visible\"\n      :id=\"id\"\n      :class=\"[\n        'el-message',\n        type && !icon ? `el-message--${type}` : '',\n        center ? 'is-center' : '',\n        showClose ? 'is-closable' : '',\n        customClass,\n      ]\"\n      :style=\"customStyle\"\n      role=\"alert\"\n      @mouseenter=\"clearTimer\"\n      @mouseleave=\"startTimer\"\n    >\n      <el-badge\n        v-if=\"repeatNum > 1\"\n        :value=\"repeatNum\"\n        :type=\"badgeType\"\n        class=\"el-message__badge\"\n      >\n      </el-badge>\n      <el-icon v-if=\"iconComponent\" class=\"el-message__icon\" :class=\"typeClass\">\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <slot>\n        <p v-if=\"!dangerouslyUseHTMLString\" class=\"el-message__content\">\n          {{ message }}\n        </p>\n        <!-- Caution here, message could've been compromised, never use user's input as message -->\n        <p v-else class=\"el-message__content\" v-html=\"message\"></p>\n      </slot>\n      <el-icon\n        v-if=\"showClose\"\n        class=\"el-message__closeBtn\"\n        @click.stop=\"close\"\n      >\n        <close />\n      </el-icon>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, onMounted, watch } from 'vue'\nimport { useEventListener, useTimeoutFn } from '@vueuse/core'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport ElBadge from '@element-plus/components/badge'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\n\nimport { messageEmits, messageProps } from './message'\nimport type { BadgeProps } from '@element-plus/components/badge'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElMessage',\n\n  components: {\n    ElBadge,\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: messageProps,\n  emits: messageEmits,\n\n  setup(props) {\n    const visible = ref(false)\n    const badgeType = ref<BadgeProps['type']>(\n      props.type ? (props.type === 'error' ? 'danger' : props.type) : 'info'\n    )\n    let stopTimer: (() => void) | undefined = undefined\n\n    const typeClass = computed(() => {\n      const type = props.type\n      return type && TypeComponentsMap[type] ? `el-message-icon--${type}` : ''\n    })\n\n    const iconComponent = computed(() => {\n      return props.icon || TypeComponentsMap[props.type] || ''\n    })\n\n    const customStyle = computed<CSSProperties>(() => ({\n      top: `${props.offset}px`,\n      zIndex: props.zIndex,\n    }))\n\n    function startTimer() {\n      if (props.duration > 0) {\n        ;({ stop: stopTimer } = useTimeoutFn(() => {\n          if (visible.value) close()\n        }, props.duration))\n      }\n    }\n\n    function clearTimer() {\n      stopTimer?.()\n    }\n\n    function close() {\n      visible.value = false\n    }\n\n    function keydown({ code }: KeyboardEvent) {\n      if (code === EVENT_CODE.esc) {\n        // press esc to close the message\n        if (visible.value) {\n          close()\n        }\n      } else {\n        startTimer() // resume timer\n      }\n    }\n\n    onMounted(() => {\n      startTimer()\n      visible.value = true\n    })\n\n    watch(\n      () => props.repeatNum,\n      () => {\n        clearTimer()\n        startTimer()\n      }\n    )\n\n    useEventListener(document, 'keydown', keydown)\n\n    return {\n      typeClass,\n      iconComponent,\n      customStyle,\n      visible,\n      badgeType,\n\n      close,\n      clearTimer,\n      startTimer,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElBadge","ElIcon","TypeComponents","messageProps","messageEmits","ref","computed","TypeComponentsMap","useTimeoutFn","EVENT_CODE"],"mappings":";;;;;;;;;;;;AA6DA,aAAeA,oBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,aACVC;AAAA,YACAC;AAAA,OACGC;AAAA;AAAA,EAGL,OAAOC;AAAA,EACP,OAAOC;AAAA,EAEP,MAAM,OAAO;AACX,UAAM,UAAUC,QAAI;AACpB,UAAM,YAAYA,QAChB,MAAM,OAAQ,MAAM,SAAS,UAAU,WAAW,MAAM,OAAQ;AAElE,QAAI,YAAsC;AAE1C,UAAM,YAAYC,aAAS,MAAM;AAC/B,YAAM,OAAO,MAAM;AACnB,aAAO,QAAQC,uBAAkB,QAAQ,oBAAoB,SAAS;AAAA;AAGxE,UAAM,gBAAgBD,aAAS,MAAM;AACnC,aAAO,MAAM,QAAQC,uBAAkB,MAAM,SAAS;AAAA;AAGxD,UAAM,cAAcD,aAAwB;AAAO,MACjD,KAAK,GAAG,MAAM;AAAA,MACd,QAAQ,MAAM;AAAA;AAGhB,0BAAsB;AACpB,UAAI,MAAM,WAAW,GAAG;AACtB;AAAC,QAAC,GAAE,MAAM,cAAcE,kBAAa,MAAM;AACzC,cAAI,QAAQ;AAAO;AAAA,WAClB,MAAM;AAAA;AAAA;AAIb,0BAAsB;AACpB;AAAA;AAGF,qBAAiB;AACf,cAAQ,QAAQ;AAAA;AAGlB,qBAAiB,EAAE,QAAuB;AACxC,UAAI,SAASC,gBAAW,KAAK;AAE3B,YAAI,QAAQ,OAAO;AACjB;AAAA;AAAA,aAEG;AACL;AAAA;AAAA;AAIJ,kBAAU,MAAM;AACd;AACA,cAAQ,QAAQ;AAAA;AAGlB,cACE,MAAM,MAAM,WACZ,MAAM;AACJ;AACA;AAAA;AAIJ,0BAAiB,UAAU,WAAW;AAEtC,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"message.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/message/src/message.vue"],"sourcesContent":["<template>\n  <transition\n    name=\"el-message-fade\"\n    @before-leave=\"onClose\"\n    @after-leave=\"$emit('destroy')\"\n  >\n    <div\n      v-show=\"visible\"\n      :id=\"id\"\n      :class=\"[\n        'el-message',\n        type && !icon ? `el-message--${type}` : '',\n        center ? 'is-center' : '',\n        showClose ? 'is-closable' : '',\n        customClass,\n      ]\"\n      :style=\"customStyle\"\n      role=\"alert\"\n      @mouseenter=\"clearTimer\"\n      @mouseleave=\"startTimer\"\n    >\n      <el-badge\n        v-if=\"repeatNum > 1\"\n        :value=\"repeatNum\"\n        :type=\"badgeType\"\n        class=\"el-message__badge\"\n      >\n      </el-badge>\n      <el-icon v-if=\"iconComponent\" class=\"el-message__icon\" :class=\"typeClass\">\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <slot>\n        <p v-if=\"!dangerouslyUseHTMLString\" class=\"el-message__content\">\n          {{ message }}\n        </p>\n        <!-- Caution here, message could've been compromised, never use user's input as message -->\n        <p v-else class=\"el-message__content\" v-html=\"message\"></p>\n      </slot>\n      <el-icon\n        v-if=\"showClose\"\n        class=\"el-message__closeBtn\"\n        @click.stop=\"close\"\n      >\n        <close />\n      </el-icon>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, onMounted, watch } from 'vue'\nimport { useEventListener, useTimeoutFn } from '@vueuse/core'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport ElBadge from '@element-plus/components/badge'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\n\nimport { messageEmits, messageProps } from './message'\nimport type { BadgeProps } from '@element-plus/components/badge'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElMessage',\n\n  components: {\n    ElBadge,\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: messageProps,\n  emits: messageEmits,\n\n  setup(props) {\n    const visible = ref(false)\n    const badgeType = ref<BadgeProps['type']>(\n      props.type ? (props.type === 'error' ? 'danger' : props.type) : 'info'\n    )\n    let stopTimer: (() => void) | undefined = undefined\n\n    const typeClass = computed(() => {\n      const type = props.type\n      return type && TypeComponentsMap[type] ? `el-message-icon--${type}` : ''\n    })\n\n    const iconComponent = computed(() => {\n      return props.icon || TypeComponentsMap[props.type] || ''\n    })\n\n    const customStyle = computed<CSSProperties>(() => ({\n      top: `${props.offset}px`,\n      zIndex: props.zIndex,\n    }))\n\n    function startTimer() {\n      if (props.duration > 0) {\n        ;({ stop: stopTimer } = useTimeoutFn(() => {\n          if (visible.value) close()\n        }, props.duration))\n      }\n    }\n\n    function clearTimer() {\n      stopTimer?.()\n    }\n\n    function close() {\n      visible.value = false\n    }\n\n    function keydown({ code }: KeyboardEvent) {\n      if (code === EVENT_CODE.esc) {\n        // press esc to close the message\n        if (visible.value) {\n          close()\n        }\n      } else {\n        startTimer() // resume timer\n      }\n    }\n\n    onMounted(() => {\n      startTimer()\n      visible.value = true\n    })\n\n    watch(\n      () => props.repeatNum,\n      () => {\n        clearTimer()\n        startTimer()\n      }\n    )\n\n    useEventListener(document, 'keydown', keydown)\n\n    return {\n      typeClass,\n      iconComponent,\n      customStyle,\n      visible,\n      badgeType,\n\n      close,\n      clearTimer,\n      startTimer,\n    }\n  },\n})\n</script>\n"],"names":["ElIcon","messageProps","TypeComponentsMap","computed","useTimeoutFn","EVENT_CODE"],"mappings":";;;;;;;;;;;;;AAwDA,EAAE,iBAAiB;AACnB,EAAE,UAAU,EAAE;;AAEd,YAAIA,cAAM;;AAEV,GAAG;EACD,OAAOC;;EAEP,KAAK,CAAC;IACJ,MAAM;IACN,MAAM;IACN,IAAI,SAAS,GAAG;;;MAGd,OAAO,IAAI,IAAIC;KAChB,CAAC,CAAC;;MAED,OAAO;KACR,CAAC,CAAC;IACH,MAAM,cAAcC,YAAQ,CAAC,OAAO;MAClC,GAAG,EAAE,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE;;KAExB,CAAC,EAAE;;MAEF,IAAI,KAAK,CAAC,QAAQ,GAAG,CAAC,EAAE;QACtB,CAAC;QACD,CAAC,EAAE,IAAI,WAAW,EAAE,GAAGC,iBAAY,OAAO;;;WAGvC,KAAK,CAAC,SAAS,EAAE;OACrB;KACF;;MAEC,SAAS,IAAI,OAAO,KAAK,CAAC,GAAG,SAAS,EAAE,CAAC;;kBAE7B,GAAG;MACf;;IAEF,SAAS,OAAO,CAAC,EAAE;MACjB,IAAI,IAAI,KAAKC,gBAAW;QACtB,IAAI,OAAO,CAAC,KAAK;UACf,KAAK,EAAE,CAAC;SACT;;;;KAIJ;iBACQ,CAAC;;;KAGT,CAAC,CAAC;aACE,CAAC,MAAM,MAAM;;;KAGjB,CAAC,CAAC;yBACa,CAAC,QAAQ,EAAE;WACpB;eACI;;;MAGT,OAAO;eACE;MACT;;;KAGD,CAAC;;;;;;"}

package/lib/components/message/src/message.vue_vue_type_template_id_031967c2_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"message.vue_vue_type_template_id_031967c2_lang.js","sources":["../../../../../../packages/components/message/src/message.vue?vue&type=template&id=031967c2&lang.js"],"sourcesContent":["<template>\n  <transition\n    name=\"el-message-fade\"\n    @before-leave=\"onClose\"\n    @after-leave=\"$emit('destroy')\"\n  >\n    <div\n      v-show=\"visible\"\n      :id=\"id\"\n      :class=\"[\n        'el-message',\n        type && !icon ? `el-message--${type}` : '',\n        center ? 'is-center' : '',\n        showClose ? 'is-closable' : '',\n        customClass,\n      ]\"\n      :style=\"customStyle\"\n      role=\"alert\"\n      @mouseenter=\"clearTimer\"\n      @mouseleave=\"startTimer\"\n    >\n      <el-badge\n        v-if=\"repeatNum > 1\"\n        :value=\"repeatNum\"\n        :type=\"badgeType\"\n        class=\"el-message__badge\"\n      >\n      </el-badge>\n      <el-icon v-if=\"iconComponent\" class=\"el-message__icon\" :class=\"typeClass\">\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <slot>\n        <p v-if=\"!dangerouslyUseHTMLString\" class=\"el-message__content\">\n          {{ message }}\n        </p>\n        <!-- Caution here, message could've been compromised, never use user's input as message -->\n        <p v-else class=\"el-message__content\" v-html=\"message\"></p>\n      </slot>\n      <el-icon\n        v-if=\"showClose\"\n        class=\"el-message__closeBtn\"\n        @click.stop=\"close\"\n      >\n        <close />\n      </el-icon>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, onMounted, watch } from 'vue'\nimport { useEventListener, useTimeoutFn } from '@vueuse/core'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport ElBadge from '@element-plus/components/badge'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\n\nimport { messageEmits, messageProps } from './message'\nimport type { BadgeProps } from '@element-plus/components/badge'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElMessage',\n\n  components: {\n    ElBadge,\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: messageProps,\n  emits: messageEmits,\n\n  setup(props) {\n    const visible = ref(false)\n    const badgeType = ref<BadgeProps['type']>(\n      props.type ? (props.type === 'error' ? 'danger' : props.type) : 'info'\n    )\n    let stopTimer: (() => void) | undefined = undefined\n\n    const typeClass = computed(() => {\n      const type = props.type\n      return type && TypeComponentsMap[type] ? `el-message-icon--${type}` : ''\n    })\n\n    const iconComponent = computed(() => {\n      return props.icon || TypeComponentsMap[props.type] || ''\n    })\n\n    const customStyle = computed<CSSProperties>(() => ({\n      top: `${props.offset}px`,\n      zIndex: props.zIndex,\n    }))\n\n    function startTimer() {\n      if (props.duration > 0) {\n        ;({ stop: stopTimer } = useTimeoutFn(() => {\n          if (visible.value) close()\n        }, props.duration))\n      }\n    }\n\n    function clearTimer() {\n      stopTimer?.()\n    }\n\n    function close() {\n      visible.value = false\n    }\n\n    function keydown({ code }: KeyboardEvent) {\n      if (code === EVENT_CODE.esc) {\n        // press esc to close the message\n        if (visible.value) {\n          close()\n        }\n      } else {\n        startTimer() // resume timer\n      }\n    }\n\n    onMounted(() => {\n      startTimer()\n      visible.value = true\n    })\n\n    watch(\n      () => props.repeatNum,\n      () => {\n        clearTimer()\n        startTimer()\n      }\n    )\n\n    useEventListener(document, 'keydown', keydown)\n\n    return {\n      typeClass,\n      iconComponent,\n      customStyle,\n      visible,\n      badgeType,\n\n      close,\n      clearTimer,\n      startTimer,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_createElementVNode","_renderSlot","_createElementBlock","_createCommentVNode","_createVNode"],"mappings":";;;;;;;;;EAgC4C,OAAM;AAAA;;;;;;0BA/BhDA;IACE,MAAK;AAAA,IACJ,eAAc;IACd,oDAAa;;yBAEd;yBAAAC;QAEG,IAAI;QACJ;;;;;;;QAOA,0BAAO;QACR,MAAK;AAAA,QACJ,qDAAY;QACZ,qDAAY;;QAGL,uCADRD;;UAEG,OAAO;UACP,MAAM;UACP,OAAM;AAAA;QAGO,uCAAfA;;UAA8B,2BAAM,oBAA2B;;+BAC7D;8BAAAA,4CAAgB;;;;QAElBE,2CAAA;WACY,kDAAVC,4BAAA,gCACK,uCAGLA;YADAC;YACAH;cAAU,OAAM;AAAA,cAAsB,WAAQ;;;;QAGxC,mCADRD;;UAEE,OAAM;AAAA,UACL,2BAAY;;+BAEb;YAAAK;;;;;oBApCM;;;;;;;;;"}
+{"version":3,"file":"message.vue_vue_type_template_id_031967c2_lang.js","sources":["../../../../../../packages/components/message/src/message.vue?vue&type=template&id=031967c2&lang.js"],"sourcesContent":["<template>\n  <transition\n    name=\"el-message-fade\"\n    @before-leave=\"onClose\"\n    @after-leave=\"$emit('destroy')\"\n  >\n    <div\n      v-show=\"visible\"\n      :id=\"id\"\n      :class=\"[\n        'el-message',\n        type && !icon ? `el-message--${type}` : '',\n        center ? 'is-center' : '',\n        showClose ? 'is-closable' : '',\n        customClass,\n      ]\"\n      :style=\"customStyle\"\n      role=\"alert\"\n      @mouseenter=\"clearTimer\"\n      @mouseleave=\"startTimer\"\n    >\n      <el-badge\n        v-if=\"repeatNum > 1\"\n        :value=\"repeatNum\"\n        :type=\"badgeType\"\n        class=\"el-message__badge\"\n      >\n      </el-badge>\n      <el-icon v-if=\"iconComponent\" class=\"el-message__icon\" :class=\"typeClass\">\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <slot>\n        <p v-if=\"!dangerouslyUseHTMLString\" class=\"el-message__content\">\n          {{ message }}\n        </p>\n        <!-- Caution here, message could've been compromised, never use user's input as message -->\n        <p v-else class=\"el-message__content\" v-html=\"message\"></p>\n      </slot>\n      <el-icon\n        v-if=\"showClose\"\n        class=\"el-message__closeBtn\"\n        @click.stop=\"close\"\n      >\n        <close />\n      </el-icon>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, onMounted, watch } from 'vue'\nimport { useEventListener, useTimeoutFn } from '@vueuse/core'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport ElBadge from '@element-plus/components/badge'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\n\nimport { messageEmits, messageProps } from './message'\nimport type { BadgeProps } from '@element-plus/components/badge'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElMessage',\n\n  components: {\n    ElBadge,\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: messageProps,\n  emits: messageEmits,\n\n  setup(props) {\n    const visible = ref(false)\n    const badgeType = ref<BadgeProps['type']>(\n      props.type ? (props.type === 'error' ? 'danger' : props.type) : 'info'\n    )\n    let stopTimer: (() => void) | undefined = undefined\n\n    const typeClass = computed(() => {\n      const type = props.type\n      return type && TypeComponentsMap[type] ? `el-message-icon--${type}` : ''\n    })\n\n    const iconComponent = computed(() => {\n      return props.icon || TypeComponentsMap[props.type] || ''\n    })\n\n    const customStyle = computed<CSSProperties>(() => ({\n      top: `${props.offset}px`,\n      zIndex: props.zIndex,\n    }))\n\n    function startTimer() {\n      if (props.duration > 0) {\n        ;({ stop: stopTimer } = useTimeoutFn(() => {\n          if (visible.value) close()\n        }, props.duration))\n      }\n    }\n\n    function clearTimer() {\n      stopTimer?.()\n    }\n\n    function close() {\n      visible.value = false\n    }\n\n    function keydown({ code }: KeyboardEvent) {\n      if (code === EVENT_CODE.esc) {\n        // press esc to close the message\n        if (visible.value) {\n          close()\n        }\n      } else {\n        startTimer() // resume timer\n      }\n    }\n\n    onMounted(() => {\n      startTimer()\n      visible.value = true\n    })\n\n    watch(\n      () => props.repeatNum,\n      () => {\n        clearTimer()\n        startTimer()\n      }\n    )\n\n    useEventListener(document, 'keydown', keydown)\n\n    return {\n      typeClass,\n      iconComponent,\n      customStyle,\n      visible,\n      badgeType,\n\n      close,\n      clearTimer,\n      startTimer,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock"],"mappings":";;;;;;;;;;EAgC4C;;;;;;;;;wBA/B1C;;IAEG;;;;sBAGD;UAEK,SAAI;;;;;;;;QAQN,uBAAO;;QAEP;;;;;;;;;;;8BAU2BA;;;cAAE;;;kCAC5B;;;;;;;;;;;;8BAOsD;;;;SAGhD;;;;;;;;;;;"}

package/lib/components/message-box/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/components/message-box/index.ts"],"sourcesContent":["import MessageBox from './src/messageBox'\n\nimport type { App } from 'vue'\nimport type { SFCWithInstall } from '@element-plus/utils/types'\n\nconst _MessageBox = MessageBox as SFCWithInstall<typeof MessageBox>\n\n_MessageBox.install = (app: App) => {\n  app.config.globalProperties.$msgbox = _MessageBox\n  app.config.globalProperties.$messageBox = _MessageBox\n  app.config.globalProperties.$alert = _MessageBox.alert\n  app.config.globalProperties.$confirm = _MessageBox.confirm\n  app.config.globalProperties.$prompt = _MessageBox.prompt\n}\n\nexport default _MessageBox\nexport const ElMessageBox = _MessageBox\n\nexport * from './src/message-box.type'\n"],"names":["MessageBox"],"mappings":";;;;;;;MAKM,cAAcA;AAEpB,YAAY,UAAU,CAAC,QAAa;AAClC,MAAI,OAAO,iBAAiB,UAAU;AACtC,MAAI,OAAO,iBAAiB,cAAc;AAC1C,MAAI,OAAO,iBAAiB,SAAS,YAAY;AACjD,MAAI,OAAO,iBAAiB,WAAW,YAAY;AACnD,MAAI,OAAO,iBAAiB,UAAU,YAAY;AAAA;MAIvC,eAAe;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/components/message-box/index.ts"],"sourcesContent":["import MessageBox from './src/messageBox'\n\nimport type { App } from 'vue'\nimport type { SFCWithInstall } from '@element-plus/utils/types'\n\nconst _MessageBox = MessageBox as SFCWithInstall<typeof MessageBox>\n\n_MessageBox.install = (app: App) => {\n  app.config.globalProperties.$msgbox = _MessageBox\n  app.config.globalProperties.$messageBox = _MessageBox\n  app.config.globalProperties.$alert = _MessageBox.alert\n  app.config.globalProperties.$confirm = _MessageBox.confirm\n  app.config.globalProperties.$prompt = _MessageBox.prompt\n}\n\nexport default _MessageBox\nexport const ElMessageBox = _MessageBox\n\nexport * from './src/message-box.type'\n"],"names":["MessageBox"],"mappings":";;;;;;;AACK,MAAC,WAAW,GAAGA,sBAAW;AAC/B,WAAW,CAAC,OAAO,GAAG,CAAC,GAAG,KAAK;AAC/B,EAAE,GAAG,CAAC,MAAM,CAAC,gBAAgB,CAAC,OAAO,GAAG,WAAW,CAAC;AACpD,EAAE,GAAG,CAAC,MAAM,CAAC,gBAAgB,CAAC,WAAW,GAAG,WAAW,CAAC;AACxD,EAAE,GAAG,CAAC,MAAM,CAAC,gBAAgB,CAAC,MAAM,GAAG,WAAW,CAAC,KAAK,CAAC;AACzD,EAAE,GAAG,CAAC,MAAM,CAAC,gBAAgB,CAAC,QAAQ,GAAG,WAAW,CAAC,OAAO,CAAC;AAC7D,EAAE,GAAG,CAAC,MAAM,CAAC,gBAAgB,CAAC,OAAO,GAAG,WAAW,CAAC,MAAM,CAAC;AAC3D,CAAC,CAAC;AAEU,MAAC,YAAY,GAAG;;;;;"}

package/lib/components/message-box/src/index.vue.d.ts

@@ -148,7 +148,6 @@ declare const _default: import("vue").DefineComponent<{
             OPTIONS_DESTROYED?: boolean | "suppress-warning" | undefined;
             WATCH_ARRAY?: boolean | "suppress-warning" | undefined;
             PROPS_DEFAULT_THIS?: boolean | "suppress-warning" | undefined;
-            V_FOR_REF?: boolean | "suppress-warning" | undefined;
             V_ON_KEYCODE_MODIFIER?: boolean | "suppress-warning" | undefined;
             CUSTOM_DIR?: boolean | "suppress-warning" | undefined;
             ATTR_FALSE_VALUE?: boolean | "suppress-warning" | undefined;
@@ -165,9 +164,9 @@ declare const _default: import("vue").DefineComponent<{
         } | undefined;
         data?: ((this: any, vm: any) => any) | undefined;
         computed?: {
-            [x: string]: import("@vue/reactivity").ComputedGetter<any> | {
-                get: import("@vue/reactivity").ComputedGetter<any>;
-                set: import("@vue/reactivity").ComputedSetter<any>;
+            [x: string]: import("vue").ComputedGetter<any> | {
+                get: import("vue").ComputedGetter<any>;
+                set: import("vue").ComputedSetter<any>;
             };
         } | undefined;
         methods?: {

package/lib/components/message-box/src/index.vue_vue_type_script_lang.js

@@ -113,7 +113,7 @@ var script = vue.defineComponent({
       confirmButtonDisabled: false,
       editorErrorMessage: "",
       validateError: false,
-      zIndex: popupManager["default"].nextZIndex()
+      zIndex: popupManager.PopupManager.nextZIndex()
     });
     const typeClass = vue.computed(() => {
       const type = state.type;
@@ -138,7 +138,7 @@ var script = vue.defineComponent({
             (_c = (_b = (_a = confirmRef.value) == null ? void 0 : _a.$el) == null ? void 0 : _b.focus) == null ? void 0 : _c.call(_b);
           });
         }
-        state.zIndex = popupManager["default"].nextZIndex();
+        state.zIndex = popupManager.PopupManager.nextZIndex();
       }
       if (props.boxType !== "prompt")
         return;

package/lib/components/message-box/src/index.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/message-box/src/index.vue"],"sourcesContent":["<template>\n  <transition name=\"fade-in-linear\" @after-leave=\"$emit('vanish')\">\n    <el-overlay\n      v-show=\"visible\"\n      :z-index=\"zIndex\"\n      :overlay-class=\"['is-message-box', modalClass]\"\n      :mask=\"modal\"\n      @click.self=\"handleWrapperClick\"\n    >\n      <div\n        ref=\"root\"\n        v-trap-focus\n        :aria-label=\"title || 'dialog'\"\n        aria-modal=\"true\"\n        :class=\"[\n          'el-message-box',\n          customClass,\n          { 'el-message-box--center': center },\n        ]\"\n        :style=\"customStyle\"\n      >\n        <div\n          v-if=\"title !== null && title !== undefined\"\n          class=\"el-message-box__header\"\n        >\n          <div class=\"el-message-box__title\">\n            <el-icon\n              v-if=\"iconComponent && center\"\n              class=\"el-message-box__status\"\n              :class=\"typeClass\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <span>{{ title }}</span>\n          </div>\n          <button\n            v-if=\"showClose\"\n            type=\"button\"\n            class=\"el-message-box__headerbtn\"\n            aria-label=\"Close\"\n            @click=\"\n              handleAction(distinguishCancelAndClose ? 'close' : 'cancel')\n            \"\n            @keydown.prevent.enter=\"\n              handleAction(distinguishCancelAndClose ? 'close' : 'cancel')\n            \"\n          >\n            <el-icon class=\"el-message-box__close\"><close /></el-icon>\n          </button>\n        </div>\n        <div class=\"el-message-box__content\">\n          <div class=\"el-message-box__container\">\n            <el-icon\n              v-if=\"iconComponent && !center && hasMessage\"\n              class=\"el-message-box__status\"\n              :class=\"typeClass\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <div v-if=\"hasMessage\" class=\"el-message-box__message\">\n              <slot>\n                <p v-if=\"!dangerouslyUseHTMLString\">{{ message }}</p>\n                <p v-else v-html=\"message\"></p>\n              </slot>\n            </div>\n          </div>\n          <div v-show=\"showInput\" class=\"el-message-box__input\">\n            <el-input\n              ref=\"inputRef\"\n              v-model=\"inputValue\"\n              :type=\"inputType\"\n              :placeholder=\"inputPlaceholder\"\n              :class=\"{ invalid: validateError }\"\n              @keydown.prevent.enter=\"handleInputEnter\"\n            />\n            <div\n              class=\"el-message-box__errormsg\"\n              :style=\"{\n                visibility: !!editorErrorMessage ? 'visible' : 'hidden',\n              }\"\n            >\n              {{ editorErrorMessage }}\n            </div>\n          </div>\n        </div>\n        <div class=\"el-message-box__btns\">\n          <el-button\n            v-if=\"showCancelButton\"\n            :loading=\"cancelButtonLoading\"\n            :class=\"[cancelButtonClass]\"\n            :round=\"roundButton\"\n            :size=\"buttonSize || 'small'\"\n            @click=\"handleAction('cancel')\"\n            @keydown.prevent.enter=\"handleAction('cancel')\"\n          >\n            {{ cancelButtonText || t('el.messagebox.cancel') }}\n          </el-button>\n          <el-button\n            v-show=\"showConfirmButton\"\n            ref=\"confirmRef\"\n            type=\"primary\"\n            plain\n            :loading=\"confirmButtonLoading\"\n            :class=\"[confirmButtonClasses]\"\n            :round=\"roundButton\"\n            :disabled=\"confirmButtonDisabled\"\n            :size=\"buttonSize || 'small'\"\n            @click=\"handleAction('confirm')\"\n            @keydown.prevent.enter=\"handleAction('confirm')\"\n          >\n            {{ confirmButtonText || t('el.messagebox.confirm') }}\n          </el-button>\n        </div>\n      </div>\n    </el-overlay>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  nextTick,\n  onMounted,\n  onBeforeUnmount,\n  computed,\n  watch,\n  reactive,\n  ref,\n  toRefs,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport { TrapFocus } from '@element-plus/directives'\nimport {\n  useModal,\n  useLockscreen,\n  useLocale,\n  useRestoreActive,\n  usePreventGlobal,\n} from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport { ElOverlay } from '@element-plus/components/overlay'\nimport PopupManager from '@element-plus/utils/popup-manager'\nimport { on, off } from '@element-plus/utils/dom'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\n\nimport type { ComponentPublicInstance, PropType } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type {\n  Action,\n  MessageBoxState,\n  MessageBoxType,\n} from './message-box.type'\n\nexport default defineComponent({\n  name: 'ElMessageBox',\n  directives: {\n    TrapFocus,\n  },\n  components: {\n    ElButton,\n    ElInput,\n    ElOverlay,\n    ElIcon,\n    ...TypeComponents,\n  },\n  inheritAttrs: false,\n  props: {\n    buttonSize: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    modal: {\n      type: Boolean,\n      default: true,\n    },\n    lockScroll: {\n      type: Boolean,\n      default: true,\n    },\n    showClose: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnClickModal: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnPressEscape: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnHashChange: {\n      type: Boolean,\n      default: true,\n    },\n    center: Boolean,\n    roundButton: {\n      default: false,\n      type: Boolean,\n    },\n    container: {\n      type: String, // default append to body\n      default: 'body',\n    },\n    boxType: {\n      type: String as PropType<MessageBoxType>,\n      default: '',\n    },\n  },\n  emits: ['vanish', 'action'],\n  setup(props, { emit }) {\n    // const popup = usePopup(props, doClose)\n    const { t } = useLocale()\n    const visible = ref(false)\n    // s represents state\n    const state = reactive<MessageBoxState>({\n      beforeClose: null,\n      callback: null,\n      cancelButtonText: '',\n      cancelButtonClass: '',\n      confirmButtonText: '',\n      confirmButtonClass: '',\n      customClass: '',\n      customStyle: {},\n      dangerouslyUseHTMLString: false,\n      distinguishCancelAndClose: false,\n      icon: '',\n      inputPattern: null,\n      inputPlaceholder: '',\n      inputType: 'text',\n      inputValue: null,\n      inputValidator: null,\n      inputErrorMessage: '',\n      message: null,\n      modalFade: true,\n      modalClass: '',\n      showCancelButton: false,\n      showConfirmButton: true,\n      type: '',\n      title: undefined,\n      showInput: false,\n      action: '' as Action,\n      confirmButtonLoading: false,\n      cancelButtonLoading: false,\n      confirmButtonDisabled: false,\n      editorErrorMessage: '',\n      // refer to: https://github.com/ElemeFE/element/commit/2999279ae34ef10c373ca795c87b020ed6753eed\n      // seemed ok for now without this state.\n      // isOnComposition: false, // temporary remove\n      validateError: false,\n      zIndex: PopupManager.nextZIndex(),\n    })\n\n    const typeClass = computed(() => {\n      const type = state.type\n      return type && TypeComponentsMap[type]\n        ? `el-message-box-icon--${type}`\n        : ''\n    })\n\n    const iconComponent = computed(\n      () => state.icon || TypeComponentsMap[state.type] || ''\n    )\n    const hasMessage = computed(() => !!state.message)\n    const inputRef = ref<ComponentPublicInstance>(null)\n    const confirmRef = ref<ComponentPublicInstance>(null)\n\n    const confirmButtonClasses = computed(() => state.confirmButtonClass)\n\n    watch(\n      () => state.inputValue,\n      async (val) => {\n        await nextTick()\n        if (props.boxType === 'prompt' && val !== null) {\n          validate()\n        }\n      },\n      { immediate: true }\n    )\n\n    watch(\n      () => visible.value,\n      (val) => {\n        if (val) {\n          if (props.boxType === 'alert' || props.boxType === 'confirm') {\n            nextTick().then(() => {\n              confirmRef.value?.$el?.focus?.()\n            })\n          }\n          state.zIndex = PopupManager.nextZIndex()\n        }\n        if (props.boxType !== 'prompt') return\n        if (val) {\n          nextTick().then(() => {\n            if (inputRef.value && inputRef.value.$el) {\n              getInputElement().focus()\n            }\n          })\n        } else {\n          state.editorErrorMessage = ''\n          state.validateError = false\n        }\n      }\n    )\n\n    onMounted(async () => {\n      await nextTick()\n      if (props.closeOnHashChange) {\n        on(window, 'hashchange', doClose)\n      }\n    })\n\n    onBeforeUnmount(() => {\n      if (props.closeOnHashChange) {\n        off(window, 'hashchange', doClose)\n      }\n    })\n\n    function doClose() {\n      if (!visible.value) return\n      visible.value = false\n      nextTick(() => {\n        if (state.action) emit('action', state.action)\n      })\n    }\n\n    const handleWrapperClick = () => {\n      if (props.closeOnClickModal) {\n        handleAction(state.distinguishCancelAndClose ? 'close' : 'cancel')\n      }\n    }\n\n    const handleInputEnter = () => {\n      if (state.inputType !== 'textarea') {\n        return handleAction('confirm')\n      }\n    }\n\n    const handleAction = (action: Action) => {\n      if (props.boxType === 'prompt' && action === 'confirm' && !validate()) {\n        return\n      }\n\n      state.action = action\n\n      if (state.beforeClose) {\n        state.beforeClose?.(action, state, doClose)\n      } else {\n        doClose()\n      }\n    }\n\n    const validate = () => {\n      if (props.boxType === 'prompt') {\n        const inputPattern = state.inputPattern\n        if (inputPattern && !inputPattern.test(state.inputValue || '')) {\n          state.editorErrorMessage =\n            state.inputErrorMessage || t('el.messagebox.error')\n          state.validateError = true\n          return false\n        }\n        const inputValidator = state.inputValidator\n        if (typeof inputValidator === 'function') {\n          const validateResult = inputValidator(state.inputValue)\n          if (validateResult === false) {\n            state.editorErrorMessage =\n              state.inputErrorMessage || t('el.messagebox.error')\n            state.validateError = true\n            return false\n          }\n          if (typeof validateResult === 'string') {\n            state.editorErrorMessage = validateResult\n            state.validateError = true\n            return false\n          }\n        }\n      }\n      state.editorErrorMessage = ''\n      state.validateError = false\n      return true\n    }\n\n    const getInputElement = () => {\n      const inputRefs = inputRef.value.$refs\n      return (inputRefs.input || inputRefs.textarea) as HTMLElement\n    }\n\n    const handleClose = () => {\n      handleAction('close')\n    }\n\n    // when close on press escape is disabled, pressing esc should not callout\n    // any other message box and close any other dialog-ish elements\n    // e.g. Dialog has a close on press esc feature, and when it closes, it calls\n    // props.beforeClose method to make a intermediate state by callout a message box\n    // for some verification or alerting. then if we allow global event liek this\n    // to dispatch, it could callout another message box.\n    if (props.closeOnPressEscape) {\n      useModal(\n        {\n          handleClose,\n        },\n        visible\n      )\n    } else {\n      usePreventGlobal(\n        visible,\n        'keydown',\n        (e: KeyboardEvent) => e.code === EVENT_CODE.esc\n      )\n    }\n\n    // locks the screen to prevent scroll\n    if (props.lockScroll) {\n      useLockscreen(visible)\n    }\n\n    // restore to prev active element.\n    useRestoreActive(visible)\n\n    return {\n      ...toRefs(state),\n      visible,\n      hasMessage,\n      typeClass,\n      iconComponent,\n      confirmButtonClasses,\n      inputRef,\n      confirmRef,\n      doClose, // for outside usage\n      handleClose, // for out side usage\n      handleWrapperClick,\n      handleInputEnter,\n      handleAction,\n      t,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","TrapFocus","ElButton","ElInput","ElOverlay","ElIcon","TypeComponents","isValidComponentSize","useLocale","ref","reactive","PopupManager","computed","TypeComponentsMap","nextTick","EVENT_CODE","toRefs"],"mappings":"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"}
+{"version":3,"file":"index.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/message-box/src/index.vue"],"sourcesContent":["<template>\n  <transition name=\"fade-in-linear\" @after-leave=\"$emit('vanish')\">\n    <el-overlay\n      v-show=\"visible\"\n      :z-index=\"zIndex\"\n      :overlay-class=\"['is-message-box', modalClass]\"\n      :mask=\"modal\"\n      @click.self=\"handleWrapperClick\"\n    >\n      <div\n        ref=\"root\"\n        v-trap-focus\n        :aria-label=\"title || 'dialog'\"\n        aria-modal=\"true\"\n        :class=\"[\n          'el-message-box',\n          customClass,\n          { 'el-message-box--center': center },\n        ]\"\n        :style=\"customStyle\"\n      >\n        <div\n          v-if=\"title !== null && title !== undefined\"\n          class=\"el-message-box__header\"\n        >\n          <div class=\"el-message-box__title\">\n            <el-icon\n              v-if=\"iconComponent && center\"\n              class=\"el-message-box__status\"\n              :class=\"typeClass\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <span>{{ title }}</span>\n          </div>\n          <button\n            v-if=\"showClose\"\n            type=\"button\"\n            class=\"el-message-box__headerbtn\"\n            aria-label=\"Close\"\n            @click=\"\n              handleAction(distinguishCancelAndClose ? 'close' : 'cancel')\n            \"\n            @keydown.prevent.enter=\"\n              handleAction(distinguishCancelAndClose ? 'close' : 'cancel')\n            \"\n          >\n            <el-icon class=\"el-message-box__close\"><close /></el-icon>\n          </button>\n        </div>\n        <div class=\"el-message-box__content\">\n          <div class=\"el-message-box__container\">\n            <el-icon\n              v-if=\"iconComponent && !center && hasMessage\"\n              class=\"el-message-box__status\"\n              :class=\"typeClass\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <div v-if=\"hasMessage\" class=\"el-message-box__message\">\n              <slot>\n                <p v-if=\"!dangerouslyUseHTMLString\">{{ message }}</p>\n                <p v-else v-html=\"message\"></p>\n              </slot>\n            </div>\n          </div>\n          <div v-show=\"showInput\" class=\"el-message-box__input\">\n            <el-input\n              ref=\"inputRef\"\n              v-model=\"inputValue\"\n              :type=\"inputType\"\n              :placeholder=\"inputPlaceholder\"\n              :class=\"{ invalid: validateError }\"\n              @keydown.prevent.enter=\"handleInputEnter\"\n            />\n            <div\n              class=\"el-message-box__errormsg\"\n              :style=\"{\n                visibility: !!editorErrorMessage ? 'visible' : 'hidden',\n              }\"\n            >\n              {{ editorErrorMessage }}\n            </div>\n          </div>\n        </div>\n        <div class=\"el-message-box__btns\">\n          <el-button\n            v-if=\"showCancelButton\"\n            :loading=\"cancelButtonLoading\"\n            :class=\"[cancelButtonClass]\"\n            :round=\"roundButton\"\n            :size=\"buttonSize || ''\"\n            @click=\"handleAction('cancel')\"\n            @keydown.prevent.enter=\"handleAction('cancel')\"\n          >\n            {{ cancelButtonText || t('el.messagebox.cancel') }}\n          </el-button>\n          <el-button\n            v-show=\"showConfirmButton\"\n            ref=\"confirmRef\"\n            type=\"primary\"\n            :loading=\"confirmButtonLoading\"\n            :class=\"[confirmButtonClasses]\"\n            :round=\"roundButton\"\n            :disabled=\"confirmButtonDisabled\"\n            :size=\"buttonSize || ''\"\n            @click=\"handleAction('confirm')\"\n            @keydown.prevent.enter=\"handleAction('confirm')\"\n          >\n            {{ confirmButtonText || t('el.messagebox.confirm') }}\n          </el-button>\n        </div>\n      </div>\n    </el-overlay>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  nextTick,\n  onMounted,\n  onBeforeUnmount,\n  computed,\n  watch,\n  reactive,\n  ref,\n  toRefs,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport { TrapFocus } from '@element-plus/directives'\nimport {\n  useModal,\n  useLockscreen,\n  useLocale,\n  useRestoreActive,\n  usePreventGlobal,\n} from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport { ElOverlay } from '@element-plus/components/overlay'\nimport { PopupManager } from '@element-plus/utils/popup-manager'\nimport { on, off } from '@element-plus/utils/dom'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\n\nimport type { ComponentPublicInstance, PropType } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type {\n  Action,\n  MessageBoxState,\n  MessageBoxType,\n} from './message-box.type'\n\nexport default defineComponent({\n  name: 'ElMessageBox',\n  directives: {\n    TrapFocus,\n  },\n  components: {\n    ElButton,\n    ElInput,\n    ElOverlay,\n    ElIcon,\n    ...TypeComponents,\n  },\n  inheritAttrs: false,\n  props: {\n    buttonSize: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    modal: {\n      type: Boolean,\n      default: true,\n    },\n    lockScroll: {\n      type: Boolean,\n      default: true,\n    },\n    showClose: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnClickModal: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnPressEscape: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnHashChange: {\n      type: Boolean,\n      default: true,\n    },\n    center: Boolean,\n    roundButton: {\n      default: false,\n      type: Boolean,\n    },\n    container: {\n      type: String, // default append to body\n      default: 'body',\n    },\n    boxType: {\n      type: String as PropType<MessageBoxType>,\n      default: '',\n    },\n  },\n  emits: ['vanish', 'action'],\n  setup(props, { emit }) {\n    // const popup = usePopup(props, doClose)\n    const { t } = useLocale()\n    const visible = ref(false)\n    // s represents state\n    const state = reactive<MessageBoxState>({\n      beforeClose: null,\n      callback: null,\n      cancelButtonText: '',\n      cancelButtonClass: '',\n      confirmButtonText: '',\n      confirmButtonClass: '',\n      customClass: '',\n      customStyle: {},\n      dangerouslyUseHTMLString: false,\n      distinguishCancelAndClose: false,\n      icon: '',\n      inputPattern: null,\n      inputPlaceholder: '',\n      inputType: 'text',\n      inputValue: null,\n      inputValidator: null,\n      inputErrorMessage: '',\n      message: null,\n      modalFade: true,\n      modalClass: '',\n      showCancelButton: false,\n      showConfirmButton: true,\n      type: '',\n      title: undefined,\n      showInput: false,\n      action: '' as Action,\n      confirmButtonLoading: false,\n      cancelButtonLoading: false,\n      confirmButtonDisabled: false,\n      editorErrorMessage: '',\n      // refer to: https://github.com/ElemeFE/element/commit/2999279ae34ef10c373ca795c87b020ed6753eed\n      // seemed ok for now without this state.\n      // isOnComposition: false, // temporary remove\n      validateError: false,\n      zIndex: PopupManager.nextZIndex(),\n    })\n\n    const typeClass = computed(() => {\n      const type = state.type\n      return type && TypeComponentsMap[type]\n        ? `el-message-box-icon--${type}`\n        : ''\n    })\n\n    const iconComponent = computed(\n      () => state.icon || TypeComponentsMap[state.type] || ''\n    )\n    const hasMessage = computed(() => !!state.message)\n    const inputRef = ref<ComponentPublicInstance>(null)\n    const confirmRef = ref<ComponentPublicInstance>(null)\n\n    const confirmButtonClasses = computed(() => state.confirmButtonClass)\n\n    watch(\n      () => state.inputValue,\n      async (val) => {\n        await nextTick()\n        if (props.boxType === 'prompt' && val !== null) {\n          validate()\n        }\n      },\n      { immediate: true }\n    )\n\n    watch(\n      () => visible.value,\n      (val) => {\n        if (val) {\n          if (props.boxType === 'alert' || props.boxType === 'confirm') {\n            nextTick().then(() => {\n              confirmRef.value?.$el?.focus?.()\n            })\n          }\n          state.zIndex = PopupManager.nextZIndex()\n        }\n        if (props.boxType !== 'prompt') return\n        if (val) {\n          nextTick().then(() => {\n            if (inputRef.value && inputRef.value.$el) {\n              getInputElement().focus()\n            }\n          })\n        } else {\n          state.editorErrorMessage = ''\n          state.validateError = false\n        }\n      }\n    )\n\n    onMounted(async () => {\n      await nextTick()\n      if (props.closeOnHashChange) {\n        on(window, 'hashchange', doClose)\n      }\n    })\n\n    onBeforeUnmount(() => {\n      if (props.closeOnHashChange) {\n        off(window, 'hashchange', doClose)\n      }\n    })\n\n    function doClose() {\n      if (!visible.value) return\n      visible.value = false\n      nextTick(() => {\n        if (state.action) emit('action', state.action)\n      })\n    }\n\n    const handleWrapperClick = () => {\n      if (props.closeOnClickModal) {\n        handleAction(state.distinguishCancelAndClose ? 'close' : 'cancel')\n      }\n    }\n\n    const handleInputEnter = () => {\n      if (state.inputType !== 'textarea') {\n        return handleAction('confirm')\n      }\n    }\n\n    const handleAction = (action: Action) => {\n      if (props.boxType === 'prompt' && action === 'confirm' && !validate()) {\n        return\n      }\n\n      state.action = action\n\n      if (state.beforeClose) {\n        state.beforeClose?.(action, state, doClose)\n      } else {\n        doClose()\n      }\n    }\n\n    const validate = () => {\n      if (props.boxType === 'prompt') {\n        const inputPattern = state.inputPattern\n        if (inputPattern && !inputPattern.test(state.inputValue || '')) {\n          state.editorErrorMessage =\n            state.inputErrorMessage || t('el.messagebox.error')\n          state.validateError = true\n          return false\n        }\n        const inputValidator = state.inputValidator\n        if (typeof inputValidator === 'function') {\n          const validateResult = inputValidator(state.inputValue)\n          if (validateResult === false) {\n            state.editorErrorMessage =\n              state.inputErrorMessage || t('el.messagebox.error')\n            state.validateError = true\n            return false\n          }\n          if (typeof validateResult === 'string') {\n            state.editorErrorMessage = validateResult\n            state.validateError = true\n            return false\n          }\n        }\n      }\n      state.editorErrorMessage = ''\n      state.validateError = false\n      return true\n    }\n\n    const getInputElement = () => {\n      const inputRefs = inputRef.value.$refs\n      return (inputRefs.input || inputRefs.textarea) as HTMLElement\n    }\n\n    const handleClose = () => {\n      handleAction('close')\n    }\n\n    // when close on press escape is disabled, pressing esc should not callout\n    // any other message box and close any other dialog-ish elements\n    // e.g. Dialog has a close on press esc feature, and when it closes, it calls\n    // props.beforeClose method to make a intermediate state by callout a message box\n    // for some verification or alerting. then if we allow global event liek this\n    // to dispatch, it could callout another message box.\n    if (props.closeOnPressEscape) {\n      useModal(\n        {\n          handleClose,\n        },\n        visible\n      )\n    } else {\n      usePreventGlobal(\n        visible,\n        'keydown',\n        (e: KeyboardEvent) => e.code === EVENT_CODE.esc\n      )\n    }\n\n    // locks the screen to prevent scroll\n    if (props.lockScroll) {\n      useLockscreen(visible)\n    }\n\n    // restore to prev active element.\n    useRestoreActive(visible)\n\n    return {\n      ...toRefs(state),\n      visible,\n      hasMessage,\n      typeClass,\n      iconComponent,\n      confirmButtonClasses,\n      inputRef,\n      confirmRef,\n      doClose, // for outside usage\n      handleClose, // for out side usage\n      handleWrapperClick,\n      handleInputEnter,\n      handleAction,\n      t,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","TrapFocus","ElButton","ElInput","ElOverlay","TypeComponents","useLocale","ref","PopupManager","computed","TypeComponentsMap","nextTick","off","useModal"],"mappings":"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"}

package/lib/components/message-box/src/index.vue_vue_type_template_id_7035e868_lang.js

@@ -39,7 +39,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         onClick: vue.withModifiers(_ctx.handleWrapperClick, ["self"])
       }, {
         default: vue.withCtx(() => [
-          vue.withDirectives(vue.createElementVNode("div", {
+          vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
             ref: "root",
             "aria-label": _ctx.title || "dialog",
             "aria-modal": "true",
@@ -125,7 +125,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 loading: _ctx.cancelButtonLoading,
                 class: vue.normalizeClass([_ctx.cancelButtonClass]),
                 round: _ctx.roundButton,
-                size: _ctx.buttonSize || "small",
+                size: _ctx.buttonSize || "",
                 onClick: _cache[3] || (_cache[3] = ($event) => _ctx.handleAction("cancel")),
                 onKeydown: _cache[4] || (_cache[4] = vue.withKeys(vue.withModifiers(($event) => _ctx.handleAction("cancel"), ["prevent"]), ["enter"]))
               }, {
@@ -137,12 +137,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               vue.withDirectives(vue.createVNode(_component_el_button, {
                 ref: "confirmRef",
                 type: "primary",
-                plain: "",
                 loading: _ctx.confirmButtonLoading,
                 class: vue.normalizeClass([_ctx.confirmButtonClasses]),
                 round: _ctx.roundButton,
                 disabled: _ctx.confirmButtonDisabled,
-                size: _ctx.buttonSize || "small",
+                size: _ctx.buttonSize || "",
                 onClick: _cache[5] || (_cache[5] = ($event) => _ctx.handleAction("confirm")),
                 onKeydown: _cache[6] || (_cache[6] = vue.withKeys(vue.withModifiers(($event) => _ctx.handleAction("confirm"), ["prevent"]), ["enter"]))
               }, {
@@ -154,7 +153,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 [vue.vShow, _ctx.showConfirmButton]
               ])
             ])
-          ], 14, _hoisted_1), [
+          ], 14, _hoisted_1)), [
             [_directive_trap_focus]
           ])
         ]),

package/lib/components/message-box/src/index.vue_vue_type_template_id_7035e868_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.vue_vue_type_template_id_7035e868_lang.js","sources":["../../../../../../packages/components/message-box/src/index.vue?vue&type=template&id=7035e868&lang.js"],"sourcesContent":["<template>\n  <transition name=\"fade-in-linear\" @after-leave=\"$emit('vanish')\">\n    <el-overlay\n      v-show=\"visible\"\n      :z-index=\"zIndex\"\n      :overlay-class=\"['is-message-box', modalClass]\"\n      :mask=\"modal\"\n      @click.self=\"handleWrapperClick\"\n    >\n      <div\n        ref=\"root\"\n        v-trap-focus\n        :aria-label=\"title || 'dialog'\"\n        aria-modal=\"true\"\n        :class=\"[\n          'el-message-box',\n          customClass,\n          { 'el-message-box--center': center },\n        ]\"\n        :style=\"customStyle\"\n      >\n        <div\n          v-if=\"title !== null && title !== undefined\"\n          class=\"el-message-box__header\"\n        >\n          <div class=\"el-message-box__title\">\n            <el-icon\n              v-if=\"iconComponent && center\"\n              class=\"el-message-box__status\"\n              :class=\"typeClass\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <span>{{ title }}</span>\n          </div>\n          <button\n            v-if=\"showClose\"\n            type=\"button\"\n            class=\"el-message-box__headerbtn\"\n            aria-label=\"Close\"\n            @click=\"\n              handleAction(distinguishCancelAndClose ? 'close' : 'cancel')\n            \"\n            @keydown.prevent.enter=\"\n              handleAction(distinguishCancelAndClose ? 'close' : 'cancel')\n            \"\n          >\n            <el-icon class=\"el-message-box__close\"><close /></el-icon>\n          </button>\n        </div>\n        <div class=\"el-message-box__content\">\n          <div class=\"el-message-box__container\">\n            <el-icon\n              v-if=\"iconComponent && !center && hasMessage\"\n              class=\"el-message-box__status\"\n              :class=\"typeClass\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <div v-if=\"hasMessage\" class=\"el-message-box__message\">\n              <slot>\n                <p v-if=\"!dangerouslyUseHTMLString\">{{ message }}</p>\n                <p v-else v-html=\"message\"></p>\n              </slot>\n            </div>\n          </div>\n          <div v-show=\"showInput\" class=\"el-message-box__input\">\n            <el-input\n              ref=\"inputRef\"\n              v-model=\"inputValue\"\n              :type=\"inputType\"\n              :placeholder=\"inputPlaceholder\"\n              :class=\"{ invalid: validateError }\"\n              @keydown.prevent.enter=\"handleInputEnter\"\n            />\n            <div\n              class=\"el-message-box__errormsg\"\n              :style=\"{\n                visibility: !!editorErrorMessage ? 'visible' : 'hidden',\n              }\"\n            >\n              {{ editorErrorMessage }}\n            </div>\n          </div>\n        </div>\n        <div class=\"el-message-box__btns\">\n          <el-button\n            v-if=\"showCancelButton\"\n            :loading=\"cancelButtonLoading\"\n            :class=\"[cancelButtonClass]\"\n            :round=\"roundButton\"\n            :size=\"buttonSize || 'small'\"\n            @click=\"handleAction('cancel')\"\n            @keydown.prevent.enter=\"handleAction('cancel')\"\n          >\n            {{ cancelButtonText || t('el.messagebox.cancel') }}\n          </el-button>\n          <el-button\n            v-show=\"showConfirmButton\"\n            ref=\"confirmRef\"\n            type=\"primary\"\n            plain\n            :loading=\"confirmButtonLoading\"\n            :class=\"[confirmButtonClasses]\"\n            :round=\"roundButton\"\n            :disabled=\"confirmButtonDisabled\"\n            :size=\"buttonSize || 'small'\"\n            @click=\"handleAction('confirm')\"\n            @keydown.prevent.enter=\"handleAction('confirm')\"\n          >\n            {{ confirmButtonText || t('el.messagebox.confirm') }}\n          </el-button>\n        </div>\n      </div>\n    </el-overlay>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  nextTick,\n  onMounted,\n  onBeforeUnmount,\n  computed,\n  watch,\n  reactive,\n  ref,\n  toRefs,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport { TrapFocus } from '@element-plus/directives'\nimport {\n  useModal,\n  useLockscreen,\n  useLocale,\n  useRestoreActive,\n  usePreventGlobal,\n} from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport { ElOverlay } from '@element-plus/components/overlay'\nimport PopupManager from '@element-plus/utils/popup-manager'\nimport { on, off } from '@element-plus/utils/dom'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\n\nimport type { ComponentPublicInstance, PropType } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type {\n  Action,\n  MessageBoxState,\n  MessageBoxType,\n} from './message-box.type'\n\nexport default defineComponent({\n  name: 'ElMessageBox',\n  directives: {\n    TrapFocus,\n  },\n  components: {\n    ElButton,\n    ElInput,\n    ElOverlay,\n    ElIcon,\n    ...TypeComponents,\n  },\n  inheritAttrs: false,\n  props: {\n    buttonSize: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    modal: {\n      type: Boolean,\n      default: true,\n    },\n    lockScroll: {\n      type: Boolean,\n      default: true,\n    },\n    showClose: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnClickModal: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnPressEscape: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnHashChange: {\n      type: Boolean,\n      default: true,\n    },\n    center: Boolean,\n    roundButton: {\n      default: false,\n      type: Boolean,\n    },\n    container: {\n      type: String, // default append to body\n      default: 'body',\n    },\n    boxType: {\n      type: String as PropType<MessageBoxType>,\n      default: '',\n    },\n  },\n  emits: ['vanish', 'action'],\n  setup(props, { emit }) {\n    // const popup = usePopup(props, doClose)\n    const { t } = useLocale()\n    const visible = ref(false)\n    // s represents state\n    const state = reactive<MessageBoxState>({\n      beforeClose: null,\n      callback: null,\n      cancelButtonText: '',\n      cancelButtonClass: '',\n      confirmButtonText: '',\n      confirmButtonClass: '',\n      customClass: '',\n      customStyle: {},\n      dangerouslyUseHTMLString: false,\n      distinguishCancelAndClose: false,\n      icon: '',\n      inputPattern: null,\n      inputPlaceholder: '',\n      inputType: 'text',\n      inputValue: null,\n      inputValidator: null,\n      inputErrorMessage: '',\n      message: null,\n      modalFade: true,\n      modalClass: '',\n      showCancelButton: false,\n      showConfirmButton: true,\n      type: '',\n      title: undefined,\n      showInput: false,\n      action: '' as Action,\n      confirmButtonLoading: false,\n      cancelButtonLoading: false,\n      confirmButtonDisabled: false,\n      editorErrorMessage: '',\n      // refer to: https://github.com/ElemeFE/element/commit/2999279ae34ef10c373ca795c87b020ed6753eed\n      // seemed ok for now without this state.\n      // isOnComposition: false, // temporary remove\n      validateError: false,\n      zIndex: PopupManager.nextZIndex(),\n    })\n\n    const typeClass = computed(() => {\n      const type = state.type\n      return type && TypeComponentsMap[type]\n        ? `el-message-box-icon--${type}`\n        : ''\n    })\n\n    const iconComponent = computed(\n      () => state.icon || TypeComponentsMap[state.type] || ''\n    )\n    const hasMessage = computed(() => !!state.message)\n    const inputRef = ref<ComponentPublicInstance>(null)\n    const confirmRef = ref<ComponentPublicInstance>(null)\n\n    const confirmButtonClasses = computed(() => state.confirmButtonClass)\n\n    watch(\n      () => state.inputValue,\n      async (val) => {\n        await nextTick()\n        if (props.boxType === 'prompt' && val !== null) {\n          validate()\n        }\n      },\n      { immediate: true }\n    )\n\n    watch(\n      () => visible.value,\n      (val) => {\n        if (val) {\n          if (props.boxType === 'alert' || props.boxType === 'confirm') {\n            nextTick().then(() => {\n              confirmRef.value?.$el?.focus?.()\n            })\n          }\n          state.zIndex = PopupManager.nextZIndex()\n        }\n        if (props.boxType !== 'prompt') return\n        if (val) {\n          nextTick().then(() => {\n            if (inputRef.value && inputRef.value.$el) {\n              getInputElement().focus()\n            }\n          })\n        } else {\n          state.editorErrorMessage = ''\n          state.validateError = false\n        }\n      }\n    )\n\n    onMounted(async () => {\n      await nextTick()\n      if (props.closeOnHashChange) {\n        on(window, 'hashchange', doClose)\n      }\n    })\n\n    onBeforeUnmount(() => {\n      if (props.closeOnHashChange) {\n        off(window, 'hashchange', doClose)\n      }\n    })\n\n    function doClose() {\n      if (!visible.value) return\n      visible.value = false\n      nextTick(() => {\n        if (state.action) emit('action', state.action)\n      })\n    }\n\n    const handleWrapperClick = () => {\n      if (props.closeOnClickModal) {\n        handleAction(state.distinguishCancelAndClose ? 'close' : 'cancel')\n      }\n    }\n\n    const handleInputEnter = () => {\n      if (state.inputType !== 'textarea') {\n        return handleAction('confirm')\n      }\n    }\n\n    const handleAction = (action: Action) => {\n      if (props.boxType === 'prompt' && action === 'confirm' && !validate()) {\n        return\n      }\n\n      state.action = action\n\n      if (state.beforeClose) {\n        state.beforeClose?.(action, state, doClose)\n      } else {\n        doClose()\n      }\n    }\n\n    const validate = () => {\n      if (props.boxType === 'prompt') {\n        const inputPattern = state.inputPattern\n        if (inputPattern && !inputPattern.test(state.inputValue || '')) {\n          state.editorErrorMessage =\n            state.inputErrorMessage || t('el.messagebox.error')\n          state.validateError = true\n          return false\n        }\n        const inputValidator = state.inputValidator\n        if (typeof inputValidator === 'function') {\n          const validateResult = inputValidator(state.inputValue)\n          if (validateResult === false) {\n            state.editorErrorMessage =\n              state.inputErrorMessage || t('el.messagebox.error')\n            state.validateError = true\n            return false\n          }\n          if (typeof validateResult === 'string') {\n            state.editorErrorMessage = validateResult\n            state.validateError = true\n            return false\n          }\n        }\n      }\n      state.editorErrorMessage = ''\n      state.validateError = false\n      return true\n    }\n\n    const getInputElement = () => {\n      const inputRefs = inputRef.value.$refs\n      return (inputRefs.input || inputRefs.textarea) as HTMLElement\n    }\n\n    const handleClose = () => {\n      handleAction('close')\n    }\n\n    // when close on press escape is disabled, pressing esc should not callout\n    // any other message box and close any other dialog-ish elements\n    // e.g. Dialog has a close on press esc feature, and when it closes, it calls\n    // props.beforeClose method to make a intermediate state by callout a message box\n    // for some verification or alerting. then if we allow global event liek this\n    // to dispatch, it could callout another message box.\n    if (props.closeOnPressEscape) {\n      useModal(\n        {\n          handleClose,\n        },\n        visible\n      )\n    } else {\n      usePreventGlobal(\n        visible,\n        'keydown',\n        (e: KeyboardEvent) => e.code === EVENT_CODE.esc\n      )\n    }\n\n    // locks the screen to prevent scroll\n    if (props.lockScroll) {\n      useLockscreen(visible)\n    }\n\n    // restore to prev active element.\n    useRestoreActive(visible)\n\n    return {\n      ...toRefs(state),\n      visible,\n      hasMessage,\n      typeClass,\n      iconComponent,\n      confirmButtonClasses,\n      inputRef,\n      confirmRef,\n      doClose, // for outside usage\n      handleClose, // for out side usage\n      handleWrapperClick,\n      handleInputEnter,\n      handleAction,\n      t,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_createVNode","_createElementVNode","_createElementBlock","_renderSlot"],"mappings":";;;;;;;;;EAuBU,OAAM;AAAA;qBAED,OAAM;qBAyBR,OAAM;qBACJ,OAAM;;;EAQc,OAAM;AAAA;;;qBAOP,OAAM;sBAmB3B,OAAM;;;;;;;;0BApFjBA;IAAY,MAAK;AAAA,IAAkB,oDAAa;;yBAC9C;yBAAAC;QAEG,WAAS;QACT,oCAAkC;QAClC,MAAM;QACN,2BAAY;;6BAEb;6BAAAC;YACE,KAAI;AAAA,YAEH,cAAY;YACb,cAAW;AAAA,YACV;;;;;YAKA,0BAAO;;YAGA,uBAAkB,eAAU,2BADpCC,8BAAA;cAIED,8BAAA;gBAEU,sBAAiB,gCADzBF;;kBAEE,2BAAM,0BACE;;uCAER;sCAAAA,4CAAgB;;;;gBAElBE,yDAAS;;cAGH,mCADRC;;gBAEE,MAAK;AAAA,gBACL,OAAM;AAAA,gBACN,cAAW;AAAA,gBACV;gBAGA;;gBAIDF,sCAAS,OAAM;uCAAwB;oBAAAA,gBAAS;AAAA;AAAA;;;;YAGpDC,8BAAA;cACEA,8BAAA;gBAEU,uBAAkB,eAAU,oCADpCF;;kBAEE,2BAAM,0BACE;;uCAER;sCAAAA,4CAAgB;;;;gBAEP,oCAAXG,8BAAA;kBACEC,2CAAA;qBACY,kDAAVD,4DAAuC,uCACvCA;;sBAAU,WAAQ;;;;;iCAIxBD,8BAAA;gBACED;kBACE,KAAI;AAAA,8BACK;+EAAA;kBACR,MAAM;kBACN,aAAa;kBACb,qCAAkB;kBAClB,0CAAuB;;gBAE1BC;kBACE,OAAM;AAAA,kBACL;;;uCAIE;;4BAfM;;;YAmBfA,8BAAA;cAEU,0CADRF;;gBAEG,SAAS;gBACT,2BAAQ;gBACR,OAAO;gBACP,MAAM;gBACN,+CAAO;gBACP,gFAAuB;;qCAExB;0DAAG,yBAAoB;;;;iCAEzBC;gBAEE,KAAI;AAAA,gBACJ,MAAK;AAAA,gBACL,OAAA;AAAA,gBACC,SAAS;gBACT,2BAAQ;gBACR,OAAO;gBACP,UAAU;gBACV,MAAM;gBACN,+CAAO;gBACP,gFAAuB;;qCAExB;0DAAG,0BAAqB;;;;4BAZhB;;;;;;;;;oBA/FN;;;;;;;;;"}
+{"version":3,"file":"index.vue_vue_type_template_id_7035e868_lang.js","sources":["../../../../../../packages/components/message-box/src/index.vue?vue&type=template&id=7035e868&lang.js"],"sourcesContent":["<template>\n  <transition name=\"fade-in-linear\" @after-leave=\"$emit('vanish')\">\n    <el-overlay\n      v-show=\"visible\"\n      :z-index=\"zIndex\"\n      :overlay-class=\"['is-message-box', modalClass]\"\n      :mask=\"modal\"\n      @click.self=\"handleWrapperClick\"\n    >\n      <div\n        ref=\"root\"\n        v-trap-focus\n        :aria-label=\"title || 'dialog'\"\n        aria-modal=\"true\"\n        :class=\"[\n          'el-message-box',\n          customClass,\n          { 'el-message-box--center': center },\n        ]\"\n        :style=\"customStyle\"\n      >\n        <div\n          v-if=\"title !== null && title !== undefined\"\n          class=\"el-message-box__header\"\n        >\n          <div class=\"el-message-box__title\">\n            <el-icon\n              v-if=\"iconComponent && center\"\n              class=\"el-message-box__status\"\n              :class=\"typeClass\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <span>{{ title }}</span>\n          </div>\n          <button\n            v-if=\"showClose\"\n            type=\"button\"\n            class=\"el-message-box__headerbtn\"\n            aria-label=\"Close\"\n            @click=\"\n              handleAction(distinguishCancelAndClose ? 'close' : 'cancel')\n            \"\n            @keydown.prevent.enter=\"\n              handleAction(distinguishCancelAndClose ? 'close' : 'cancel')\n            \"\n          >\n            <el-icon class=\"el-message-box__close\"><close /></el-icon>\n          </button>\n        </div>\n        <div class=\"el-message-box__content\">\n          <div class=\"el-message-box__container\">\n            <el-icon\n              v-if=\"iconComponent && !center && hasMessage\"\n              class=\"el-message-box__status\"\n              :class=\"typeClass\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <div v-if=\"hasMessage\" class=\"el-message-box__message\">\n              <slot>\n                <p v-if=\"!dangerouslyUseHTMLString\">{{ message }}</p>\n                <p v-else v-html=\"message\"></p>\n              </slot>\n            </div>\n          </div>\n          <div v-show=\"showInput\" class=\"el-message-box__input\">\n            <el-input\n              ref=\"inputRef\"\n              v-model=\"inputValue\"\n              :type=\"inputType\"\n              :placeholder=\"inputPlaceholder\"\n              :class=\"{ invalid: validateError }\"\n              @keydown.prevent.enter=\"handleInputEnter\"\n            />\n            <div\n              class=\"el-message-box__errormsg\"\n              :style=\"{\n                visibility: !!editorErrorMessage ? 'visible' : 'hidden',\n              }\"\n            >\n              {{ editorErrorMessage }}\n            </div>\n          </div>\n        </div>\n        <div class=\"el-message-box__btns\">\n          <el-button\n            v-if=\"showCancelButton\"\n            :loading=\"cancelButtonLoading\"\n            :class=\"[cancelButtonClass]\"\n            :round=\"roundButton\"\n            :size=\"buttonSize || ''\"\n            @click=\"handleAction('cancel')\"\n            @keydown.prevent.enter=\"handleAction('cancel')\"\n          >\n            {{ cancelButtonText || t('el.messagebox.cancel') }}\n          </el-button>\n          <el-button\n            v-show=\"showConfirmButton\"\n            ref=\"confirmRef\"\n            type=\"primary\"\n            :loading=\"confirmButtonLoading\"\n            :class=\"[confirmButtonClasses]\"\n            :round=\"roundButton\"\n            :disabled=\"confirmButtonDisabled\"\n            :size=\"buttonSize || ''\"\n            @click=\"handleAction('confirm')\"\n            @keydown.prevent.enter=\"handleAction('confirm')\"\n          >\n            {{ confirmButtonText || t('el.messagebox.confirm') }}\n          </el-button>\n        </div>\n      </div>\n    </el-overlay>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  nextTick,\n  onMounted,\n  onBeforeUnmount,\n  computed,\n  watch,\n  reactive,\n  ref,\n  toRefs,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport { TrapFocus } from '@element-plus/directives'\nimport {\n  useModal,\n  useLockscreen,\n  useLocale,\n  useRestoreActive,\n  usePreventGlobal,\n} from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport { ElOverlay } from '@element-plus/components/overlay'\nimport { PopupManager } from '@element-plus/utils/popup-manager'\nimport { on, off } from '@element-plus/utils/dom'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\n\nimport type { ComponentPublicInstance, PropType } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type {\n  Action,\n  MessageBoxState,\n  MessageBoxType,\n} from './message-box.type'\n\nexport default defineComponent({\n  name: 'ElMessageBox',\n  directives: {\n    TrapFocus,\n  },\n  components: {\n    ElButton,\n    ElInput,\n    ElOverlay,\n    ElIcon,\n    ...TypeComponents,\n  },\n  inheritAttrs: false,\n  props: {\n    buttonSize: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    modal: {\n      type: Boolean,\n      default: true,\n    },\n    lockScroll: {\n      type: Boolean,\n      default: true,\n    },\n    showClose: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnClickModal: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnPressEscape: {\n      type: Boolean,\n      default: true,\n    },\n    closeOnHashChange: {\n      type: Boolean,\n      default: true,\n    },\n    center: Boolean,\n    roundButton: {\n      default: false,\n      type: Boolean,\n    },\n    container: {\n      type: String, // default append to body\n      default: 'body',\n    },\n    boxType: {\n      type: String as PropType<MessageBoxType>,\n      default: '',\n    },\n  },\n  emits: ['vanish', 'action'],\n  setup(props, { emit }) {\n    // const popup = usePopup(props, doClose)\n    const { t } = useLocale()\n    const visible = ref(false)\n    // s represents state\n    const state = reactive<MessageBoxState>({\n      beforeClose: null,\n      callback: null,\n      cancelButtonText: '',\n      cancelButtonClass: '',\n      confirmButtonText: '',\n      confirmButtonClass: '',\n      customClass: '',\n      customStyle: {},\n      dangerouslyUseHTMLString: false,\n      distinguishCancelAndClose: false,\n      icon: '',\n      inputPattern: null,\n      inputPlaceholder: '',\n      inputType: 'text',\n      inputValue: null,\n      inputValidator: null,\n      inputErrorMessage: '',\n      message: null,\n      modalFade: true,\n      modalClass: '',\n      showCancelButton: false,\n      showConfirmButton: true,\n      type: '',\n      title: undefined,\n      showInput: false,\n      action: '' as Action,\n      confirmButtonLoading: false,\n      cancelButtonLoading: false,\n      confirmButtonDisabled: false,\n      editorErrorMessage: '',\n      // refer to: https://github.com/ElemeFE/element/commit/2999279ae34ef10c373ca795c87b020ed6753eed\n      // seemed ok for now without this state.\n      // isOnComposition: false, // temporary remove\n      validateError: false,\n      zIndex: PopupManager.nextZIndex(),\n    })\n\n    const typeClass = computed(() => {\n      const type = state.type\n      return type && TypeComponentsMap[type]\n        ? `el-message-box-icon--${type}`\n        : ''\n    })\n\n    const iconComponent = computed(\n      () => state.icon || TypeComponentsMap[state.type] || ''\n    )\n    const hasMessage = computed(() => !!state.message)\n    const inputRef = ref<ComponentPublicInstance>(null)\n    const confirmRef = ref<ComponentPublicInstance>(null)\n\n    const confirmButtonClasses = computed(() => state.confirmButtonClass)\n\n    watch(\n      () => state.inputValue,\n      async (val) => {\n        await nextTick()\n        if (props.boxType === 'prompt' && val !== null) {\n          validate()\n        }\n      },\n      { immediate: true }\n    )\n\n    watch(\n      () => visible.value,\n      (val) => {\n        if (val) {\n          if (props.boxType === 'alert' || props.boxType === 'confirm') {\n            nextTick().then(() => {\n              confirmRef.value?.$el?.focus?.()\n            })\n          }\n          state.zIndex = PopupManager.nextZIndex()\n        }\n        if (props.boxType !== 'prompt') return\n        if (val) {\n          nextTick().then(() => {\n            if (inputRef.value && inputRef.value.$el) {\n              getInputElement().focus()\n            }\n          })\n        } else {\n          state.editorErrorMessage = ''\n          state.validateError = false\n        }\n      }\n    )\n\n    onMounted(async () => {\n      await nextTick()\n      if (props.closeOnHashChange) {\n        on(window, 'hashchange', doClose)\n      }\n    })\n\n    onBeforeUnmount(() => {\n      if (props.closeOnHashChange) {\n        off(window, 'hashchange', doClose)\n      }\n    })\n\n    function doClose() {\n      if (!visible.value) return\n      visible.value = false\n      nextTick(() => {\n        if (state.action) emit('action', state.action)\n      })\n    }\n\n    const handleWrapperClick = () => {\n      if (props.closeOnClickModal) {\n        handleAction(state.distinguishCancelAndClose ? 'close' : 'cancel')\n      }\n    }\n\n    const handleInputEnter = () => {\n      if (state.inputType !== 'textarea') {\n        return handleAction('confirm')\n      }\n    }\n\n    const handleAction = (action: Action) => {\n      if (props.boxType === 'prompt' && action === 'confirm' && !validate()) {\n        return\n      }\n\n      state.action = action\n\n      if (state.beforeClose) {\n        state.beforeClose?.(action, state, doClose)\n      } else {\n        doClose()\n      }\n    }\n\n    const validate = () => {\n      if (props.boxType === 'prompt') {\n        const inputPattern = state.inputPattern\n        if (inputPattern && !inputPattern.test(state.inputValue || '')) {\n          state.editorErrorMessage =\n            state.inputErrorMessage || t('el.messagebox.error')\n          state.validateError = true\n          return false\n        }\n        const inputValidator = state.inputValidator\n        if (typeof inputValidator === 'function') {\n          const validateResult = inputValidator(state.inputValue)\n          if (validateResult === false) {\n            state.editorErrorMessage =\n              state.inputErrorMessage || t('el.messagebox.error')\n            state.validateError = true\n            return false\n          }\n          if (typeof validateResult === 'string') {\n            state.editorErrorMessage = validateResult\n            state.validateError = true\n            return false\n          }\n        }\n      }\n      state.editorErrorMessage = ''\n      state.validateError = false\n      return true\n    }\n\n    const getInputElement = () => {\n      const inputRefs = inputRef.value.$refs\n      return (inputRefs.input || inputRefs.textarea) as HTMLElement\n    }\n\n    const handleClose = () => {\n      handleAction('close')\n    }\n\n    // when close on press escape is disabled, pressing esc should not callout\n    // any other message box and close any other dialog-ish elements\n    // e.g. Dialog has a close on press esc feature, and when it closes, it calls\n    // props.beforeClose method to make a intermediate state by callout a message box\n    // for some verification or alerting. then if we allow global event liek this\n    // to dispatch, it could callout another message box.\n    if (props.closeOnPressEscape) {\n      useModal(\n        {\n          handleClose,\n        },\n        visible\n      )\n    } else {\n      usePreventGlobal(\n        visible,\n        'keydown',\n        (e: KeyboardEvent) => e.code === EVENT_CODE.esc\n      )\n    }\n\n    // locks the screen to prevent scroll\n    if (props.lockScroll) {\n      useLockscreen(visible)\n    }\n\n    // restore to prev active element.\n    useRestoreActive(visible)\n\n    return {\n      ...toRefs(state),\n      visible,\n      hasMessage,\n      typeClass,\n      iconComponent,\n      confirmButtonClasses,\n      inputRef,\n      confirmRef,\n      doClose, // for outside usage\n      handleClose, // for out side usage\n      handleWrapperClick,\n      handleInputEnter,\n      handleAction,\n      t,\n    }\n  },\n})\n</script>\n"],"names":["_withModifiers","_createCommentVNode","_withCtx","_createTextVNode"],"mappings":";;;;;;;;;;EAuBU;;qBAEK,KAAK,EAAC;qBAyBR,KAAK,EAAC;;;;EASgB;;;;mDAO4B;eAmBlD,KAAK,EAAC,sBAAsB;;;;;;;;;;;IApF3B;;;;;QAGP,SAAOA;;QAEP;;;0BAGD;;YACE,KAAI;;;;;;;;sDASe;;;;;;;;;;+CAYb;;;;;;;;iCAKa;;;;;;;;;;;;;wBAWf;;;;;;;;;;;;;;;sBAOEC;;;;;;;;;;;0BAOY;8CAAV;;;8BACU,SAAgB;;;;;;;;kBAM5B;;;yCAEgB;;;;;;uBAMX,EAACC;kBACLC;;;;;;;;0CAQP;;;;;yBAIU;;;yFAGc;;;;;;;;;;;;;wBAUd;;;;;;;;;"}

package/lib/components/message-box/src/messageBox.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 var shared = require('@vue/shared');
-var isServer = require('../../../utils/isServer.js');
+var core = require('@vueuse/core');
 require('../../../utils/util.js');
 require('./index.js');
 var index_vue_vue_type_script_lang = require('./index.vue_vue_type_script_lang.js');
@@ -67,7 +67,7 @@ const showMessage = (options) => {
   return vm;
 };
 function MessageBox(options) {
-  if (isServer["default"])
+  if (!core.isClient)
     return;
   let callback;
   if (shared.isString(options) || vue.isVNode(options)) {

package/lib/components/message-box/src/messageBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"messageBox.js","sources":["../../../../../../packages/components/message-box/src/messageBox.ts"],"sourcesContent":["import { h, watch, render } from 'vue'\nimport { hasOwn } from '@vue/shared'\nimport isServer from '@element-plus/utils/isServer'\nimport { isVNode, isString } from '@element-plus/utils/util'\nimport MessageBoxConstructor from './index.vue'\n\nimport type { ComponentPublicInstance, VNode } from 'vue'\nimport type {\n  Action,\n  Callback,\n  MessageBoxState,\n  IElMessageBox,\n  ElMessageBoxOptions,\n  MessageBoxData,\n} from './message-box.type'\n\n// component default merge props & data\n\nconst messageInstance = new Map<\n  ComponentPublicInstance<{ doClose: () => void }>, // marking doClose as function\n  {\n    options: any\n    callback: Callback\n    resolve: (res: any) => void\n    reject: (reason?: any) => void\n  }\n>()\n\nconst initInstance = (props: any, container: HTMLElement) => {\n  const vnode = h(MessageBoxConstructor, props)\n  render(vnode, container)\n  document.body.appendChild(container.firstElementChild)\n  return vnode.component\n}\n\nconst genContainer = () => {\n  return document.createElement('div')\n}\n\nconst showMessage = (options: any) => {\n  const container = genContainer()\n  // Adding destruct method.\n  // when transition leaves emitting `vanish` evt. so that we can do the clean job.\n  options.onVanish = () => {\n    // not sure if this causes mem leak, need proof to verify that.\n    // maybe calling out like 1000 msg-box then close them all.\n    render(null, container)\n    messageInstance.delete(vm) // Remove vm to avoid mem leak.\n    // here we were suppose to call document.body.removeChild(container.firstElementChild)\n    // but render(null, container) did that job for us. so that we do not call that directly\n  }\n\n  options.onAction = (action: Action) => {\n    const currentMsg = messageInstance.get(vm)\n    let resolve: Action | { value: string; action: Action }\n    if (options.showInput) {\n      resolve = { value: vm.inputValue, action }\n    } else {\n      resolve = action\n    }\n    if (options.callback) {\n      options.callback(resolve, instance.proxy)\n    } else {\n      if (action === 'cancel' || action === 'close') {\n        if (options.distinguishCancelAndClose && action !== 'cancel') {\n          currentMsg.reject('close')\n        } else {\n          currentMsg.reject('cancel')\n        }\n      } else {\n        currentMsg.resolve(resolve)\n      }\n    }\n  }\n\n  const instance = initInstance(options, container)\n\n  // This is how we use message box programmably.\n  // Maybe consider releasing a template version?\n  // get component instance like v2.\n  const vm = instance.proxy as ComponentPublicInstance<\n    {\n      visible: boolean\n      doClose: () => void\n    } & MessageBoxState\n  >\n\n  for (const prop in options) {\n    if (hasOwn(options, prop) && !hasOwn(vm.$props, prop)) {\n      vm[prop as string] = options[prop]\n    }\n  }\n\n  watch(\n    () => vm.message,\n    (newVal, oldVal) => {\n      if (isVNode(newVal)) {\n        // Override slots since message is vnode type.\n        instance.slots.default = () => [newVal]\n      } else if (isVNode(oldVal) && !isVNode(newVal)) {\n        delete instance.slots.default\n      }\n    },\n    {\n      immediate: true,\n    }\n  )\n\n  // change visibility after everything is settled\n  vm.visible = true\n  return vm\n}\n\nasync function MessageBox(options: ElMessageBoxOptions): Promise<MessageBoxData>\nfunction MessageBox(\n  options: ElMessageBoxOptions | string | VNode\n): Promise<{ value: string; action: Action } | Action> {\n  if (isServer) return\n  let callback\n  if (isString(options) || isVNode(options)) {\n    options = {\n      message: options,\n    }\n  } else {\n    callback = options.callback\n  }\n\n  return new Promise((resolve, reject) => {\n    const vm = showMessage(options)\n    // collect this vm in order to handle upcoming events.\n    messageInstance.set(vm, {\n      options,\n      callback,\n      resolve,\n      reject,\n    })\n  })\n}\n\nMessageBox.alert = (\n  message: string,\n  title: string,\n  options?: ElMessageBoxOptions\n) => {\n  if (typeof title === 'object') {\n    options = title\n    title = ''\n  } else if (title === undefined) {\n    title = ''\n  }\n\n  return MessageBox(\n    Object.assign(\n      {\n        title,\n        message,\n        type: '',\n        closeOnPressEscape: false,\n        closeOnClickModal: false,\n      },\n      options,\n      {\n        boxType: 'alert',\n      }\n    )\n  )\n}\n\nMessageBox.confirm = (\n  message: string,\n  title: string,\n  options?: ElMessageBoxOptions\n) => {\n  if (typeof title === 'object') {\n    options = title\n    title = ''\n  } else if (title === undefined) {\n    title = ''\n  }\n  return MessageBox(\n    Object.assign(\n      {\n        title,\n        message,\n        type: '',\n        showCancelButton: true,\n      },\n      options,\n      {\n        boxType: 'confirm',\n      }\n    )\n  )\n}\n\nMessageBox.prompt = (\n  message: string,\n  title: string,\n  options?: ElMessageBoxOptions\n) => {\n  if (typeof title === 'object') {\n    options = title\n    title = ''\n  } else if (title === undefined) {\n    title = ''\n  }\n  return MessageBox(\n    Object.assign(\n      {\n        title,\n        message,\n        showCancelButton: true,\n        showInput: true,\n        type: '',\n      },\n      options,\n      {\n        boxType: 'prompt',\n      }\n    )\n  )\n}\n\nMessageBox.close = () => {\n  // instance.setupInstall.doClose()\n  // instance.setupInstall.state.visible = false\n\n  messageInstance.forEach((_, vm) => {\n    vm.doClose()\n  })\n\n  messageInstance.clear()\n}\n\nexport default MessageBox as IElMessageBox\n"],"names":["h","MessageBoxConstructor","hasOwn","isVNode","isServer","isString"],"mappings":"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"}
+{"version":3,"file":"messageBox.js","sources":["../../../../../../packages/components/message-box/src/messageBox.ts"],"sourcesContent":["import { h, watch, render } from 'vue'\nimport { hasOwn } from '@vue/shared'\nimport { isClient } from '@vueuse/core'\nimport { isVNode, isString } from '@element-plus/utils/util'\nimport MessageBoxConstructor from './index.vue'\n\nimport type { ComponentPublicInstance, VNode } from 'vue'\nimport type {\n  Action,\n  Callback,\n  MessageBoxState,\n  IElMessageBox,\n  ElMessageBoxOptions,\n  MessageBoxData,\n} from './message-box.type'\n\n// component default merge props & data\n\nconst messageInstance = new Map<\n  ComponentPublicInstance<{ doClose: () => void }>, // marking doClose as function\n  {\n    options: any\n    callback: Callback\n    resolve: (res: any) => void\n    reject: (reason?: any) => void\n  }\n>()\n\nconst initInstance = (props: any, container: HTMLElement) => {\n  const vnode = h(MessageBoxConstructor, props)\n  render(vnode, container)\n  document.body.appendChild(container.firstElementChild)\n  return vnode.component\n}\n\nconst genContainer = () => {\n  return document.createElement('div')\n}\n\nconst showMessage = (options: any) => {\n  const container = genContainer()\n  // Adding destruct method.\n  // when transition leaves emitting `vanish` evt. so that we can do the clean job.\n  options.onVanish = () => {\n    // not sure if this causes mem leak, need proof to verify that.\n    // maybe calling out like 1000 msg-box then close them all.\n    render(null, container)\n    messageInstance.delete(vm) // Remove vm to avoid mem leak.\n    // here we were suppose to call document.body.removeChild(container.firstElementChild)\n    // but render(null, container) did that job for us. so that we do not call that directly\n  }\n\n  options.onAction = (action: Action) => {\n    const currentMsg = messageInstance.get(vm)\n    let resolve: Action | { value: string; action: Action }\n    if (options.showInput) {\n      resolve = { value: vm.inputValue, action }\n    } else {\n      resolve = action\n    }\n    if (options.callback) {\n      options.callback(resolve, instance.proxy)\n    } else {\n      if (action === 'cancel' || action === 'close') {\n        if (options.distinguishCancelAndClose && action !== 'cancel') {\n          currentMsg.reject('close')\n        } else {\n          currentMsg.reject('cancel')\n        }\n      } else {\n        currentMsg.resolve(resolve)\n      }\n    }\n  }\n\n  const instance = initInstance(options, container)\n\n  // This is how we use message box programmably.\n  // Maybe consider releasing a template version?\n  // get component instance like v2.\n  const vm = instance.proxy as ComponentPublicInstance<\n    {\n      visible: boolean\n      doClose: () => void\n    } & MessageBoxState\n  >\n\n  for (const prop in options) {\n    if (hasOwn(options, prop) && !hasOwn(vm.$props, prop)) {\n      vm[prop as string] = options[prop]\n    }\n  }\n\n  watch(\n    () => vm.message,\n    (newVal, oldVal) => {\n      if (isVNode(newVal)) {\n        // Override slots since message is vnode type.\n        instance.slots.default = () => [newVal]\n      } else if (isVNode(oldVal) && !isVNode(newVal)) {\n        delete instance.slots.default\n      }\n    },\n    {\n      immediate: true,\n    }\n  )\n\n  // change visibility after everything is settled\n  vm.visible = true\n  return vm\n}\n\nasync function MessageBox(options: ElMessageBoxOptions): Promise<MessageBoxData>\nfunction MessageBox(\n  options: ElMessageBoxOptions | string | VNode\n): Promise<{ value: string; action: Action } | Action> {\n  if (!isClient) return\n  let callback\n  if (isString(options) || isVNode(options)) {\n    options = {\n      message: options,\n    }\n  } else {\n    callback = options.callback\n  }\n\n  return new Promise((resolve, reject) => {\n    const vm = showMessage(options)\n    // collect this vm in order to handle upcoming events.\n    messageInstance.set(vm, {\n      options,\n      callback,\n      resolve,\n      reject,\n    })\n  })\n}\n\nMessageBox.alert = (\n  message: string,\n  title: string,\n  options?: ElMessageBoxOptions\n) => {\n  if (typeof title === 'object') {\n    options = title\n    title = ''\n  } else if (title === undefined) {\n    title = ''\n  }\n\n  return MessageBox(\n    Object.assign(\n      {\n        title,\n        message,\n        type: '',\n        closeOnPressEscape: false,\n        closeOnClickModal: false,\n      },\n      options,\n      {\n        boxType: 'alert',\n      }\n    )\n  )\n}\n\nMessageBox.confirm = (\n  message: string,\n  title: string,\n  options?: ElMessageBoxOptions\n) => {\n  if (typeof title === 'object') {\n    options = title\n    title = ''\n  } else if (title === undefined) {\n    title = ''\n  }\n  return MessageBox(\n    Object.assign(\n      {\n        title,\n        message,\n        type: '',\n        showCancelButton: true,\n      },\n      options,\n      {\n        boxType: 'confirm',\n      }\n    )\n  )\n}\n\nMessageBox.prompt = (\n  message: string,\n  title: string,\n  options?: ElMessageBoxOptions\n) => {\n  if (typeof title === 'object') {\n    options = title\n    title = ''\n  } else if (title === undefined) {\n    title = ''\n  }\n  return MessageBox(\n    Object.assign(\n      {\n        title,\n        message,\n        showCancelButton: true,\n        showInput: true,\n        type: '',\n      },\n      options,\n      {\n        boxType: 'prompt',\n      }\n    )\n  )\n}\n\nMessageBox.close = () => {\n  // instance.setupInstall.doClose()\n  // instance.setupInstall.state.visible = false\n\n  messageInstance.forEach((_, vm) => {\n    vm.doClose()\n  })\n\n  messageInstance.clear()\n}\n\nexport default MessageBox as IElMessageBox\n"],"names":["h","MessageBoxConstructor","render","hasOwn","watch","isVNode","isClient","isString"],"mappings":"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"}

package/lib/components/notification/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/components/notification/index.ts"],"sourcesContent":["import { withInstallFunction } from '@element-plus/utils/with-install'\n\nimport Notify from './src/notify'\n\nexport const ElNotification = withInstallFunction(Notify, '$notify')\nexport default ElNotification\n\nexport * from './src/notification'\n"],"names":["withInstallFunction","Notify"],"mappings":";;;;;;;;MAIa,iBAAiBA,gCAAoBC,mBAAQ;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/components/notification/index.ts"],"sourcesContent":["import { withInstallFunction } from '@element-plus/utils/with-install'\n\nimport Notify from './src/notify'\n\nexport const ElNotification = withInstallFunction(Notify, '$notify')\nexport default ElNotification\n\nexport * from './src/notification'\n"],"names":["withInstallFunction","Notify"],"mappings":";;;;;;;;AAEY,MAAC,cAAc,GAAGA,+BAAmB,CAACC,iBAAM,EAAE,SAAS;;;;;;;;"}

package/lib/components/notification/src/notification.js.map

@@ -1 +1 @@
-{"version":3,"file":"notification.js","sources":["../../../../../../packages/components/notification/src/notification.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils/props'\n\nimport type { VNode, ExtractPropTypes } from 'vue'\n\nexport const notificationTypes = [\n  'success',\n  'info',\n  'warning',\n  'error',\n] as const\n\nexport const notificationProps = buildProps({\n  customClass: {\n    type: String,\n    default: '',\n  },\n  dangerouslyUseHTMLString: {\n    type: Boolean,\n    default: false,\n  },\n  duration: {\n    type: Number,\n    default: 4500,\n  },\n  icon: {\n    type: definePropType<string | Comment>([String, Object]),\n    default: '',\n  },\n  id: {\n    type: String,\n    default: '',\n  },\n  message: {\n    type: definePropType<string | VNode>([String, Object]),\n    default: '',\n  },\n  offset: {\n    type: Number,\n    default: 0,\n  },\n  onClick: {\n    type: definePropType<() => void>(Function),\n    default: () => undefined,\n  },\n  onClose: {\n    type: definePropType<() => void>(Function),\n    required: true,\n  },\n  position: {\n    type: String,\n    values: ['top-right', 'top-left', 'bottom-right', 'bottom-left'],\n    default: 'top-right',\n  },\n  showClose: {\n    type: Boolean,\n    default: true,\n  },\n  title: {\n    type: String,\n    default: '',\n  },\n  type: {\n    type: String,\n    values: [...notificationTypes, ''],\n    default: '',\n  },\n  zIndex: {\n    type: Number,\n    default: 0,\n  },\n} as const)\nexport type NotificationProps = ExtractPropTypes<typeof notificationProps>\n\nexport const notificationEmits = {\n  destroy: () => true,\n}\nexport type NotificationEmits = typeof notificationEmits\n\nexport type NotificationOptions = Omit<NotificationProps, 'id'> & {\n  appendTo?: HTMLElement | string\n}\nexport type NotificationOptionsTyped = Omit<NotificationOptions, 'type'>\n\nexport interface NotificationHandle {\n  close: () => void\n}\n\nexport type NotificationParams = Partial<NotificationOptions> | string | VNode\nexport type NotificationParamsTyped =\n  | Partial<NotificationOptionsTyped>\n  | string\n  | VNode\n\nexport type NotifyFn = ((\n  options?: NotificationParams\n) => NotificationHandle) & { closeAll: () => void }\n\nexport type NotifyTypedFn = (\n  options?: NotificationParamsTyped\n) => NotificationHandle\n\nexport interface Notify extends NotifyFn {\n  success: NotifyTypedFn\n  warning: NotifyTypedFn\n  error: NotifyTypedFn\n  info: NotifyTypedFn\n}\n\nexport interface NotificationQueueItem {\n  vm: VNode\n}\n\nexport type NotificationQueue = NotificationQueueItem[]\n"],"names":["buildProps","definePropType"],"mappings":";;;;;;MAIa,oBAAoB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;MAGW,oBAAoBA,iBAAW;AAAA,EAC1C,aAAa;AAAA,IACX,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,0BAA0B;AAAA,IACxB,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,UAAU;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,MAAM;AAAA,IACJ,MAAMC,qBAAiC,CAAC,QAAQ;AAAA,IAChD,SAAS;AAAA;AAAA,EAEX,IAAI;AAAA,IACF,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,SAAS;AAAA,IACP,MAAMA,qBAA+B,CAAC,QAAQ;AAAA,IAC9C,SAAS;AAAA;AAAA,EAEX,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,SAAS;AAAA,IACP,MAAMA,qBAA2B;AAAA,IACjC,SAAS,MAAM;AAAA;AAAA,EAEjB,SAAS;AAAA,IACP,MAAMA,qBAA2B;AAAA,IACjC,UAAU;AAAA;AAAA,EAEZ,UAAU;AAAA,IACR,MAAM;AAAA,IACN,QAAQ,CAAC,aAAa,YAAY,gBAAgB;AAAA,IAClD,SAAS;AAAA;AAAA,EAEX,WAAW;AAAA,IACT,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,OAAO;AAAA,IACL,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ,CAAC,GAAG,mBAAmB;AAAA,IAC/B,SAAS;AAAA;AAAA,EAEX,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,SAAS;AAAA;AAAA;MAKA,oBAAoB;AAAA,EAC/B,SAAS,MAAM;AAAA;;;;;;"}
+{"version":3,"file":"notification.js","sources":["../../../../../../packages/components/notification/src/notification.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils/props'\n\nimport type { VNode, ExtractPropTypes } from 'vue'\n\nexport const notificationTypes = [\n  'success',\n  'info',\n  'warning',\n  'error',\n] as const\n\nexport const notificationProps = buildProps({\n  customClass: {\n    type: String,\n    default: '',\n  },\n  dangerouslyUseHTMLString: {\n    type: Boolean,\n    default: false,\n  },\n  duration: {\n    type: Number,\n    default: 4500,\n  },\n  icon: {\n    type: definePropType<string | Comment>([String, Object]),\n    default: '',\n  },\n  id: {\n    type: String,\n    default: '',\n  },\n  message: {\n    type: definePropType<string | VNode>([String, Object]),\n    default: '',\n  },\n  offset: {\n    type: Number,\n    default: 0,\n  },\n  onClick: {\n    type: definePropType<() => void>(Function),\n    default: () => undefined,\n  },\n  onClose: {\n    type: definePropType<() => void>(Function),\n    required: true,\n  },\n  position: {\n    type: String,\n    values: ['top-right', 'top-left', 'bottom-right', 'bottom-left'],\n    default: 'top-right',\n  },\n  showClose: {\n    type: Boolean,\n    default: true,\n  },\n  title: {\n    type: String,\n    default: '',\n  },\n  type: {\n    type: String,\n    values: [...notificationTypes, ''],\n    default: '',\n  },\n  zIndex: {\n    type: Number,\n    default: 0,\n  },\n} as const)\nexport type NotificationProps = ExtractPropTypes<typeof notificationProps>\n\nexport const notificationEmits = {\n  destroy: () => true,\n}\nexport type NotificationEmits = typeof notificationEmits\n\nexport type NotificationOptions = Omit<NotificationProps, 'id'> & {\n  appendTo?: HTMLElement | string\n}\nexport type NotificationOptionsTyped = Omit<NotificationOptions, 'type'>\n\nexport interface NotificationHandle {\n  close: () => void\n}\n\nexport type NotificationParams = Partial<NotificationOptions> | string | VNode\nexport type NotificationParamsTyped =\n  | Partial<NotificationOptionsTyped>\n  | string\n  | VNode\n\nexport type NotifyFn = ((\n  options?: NotificationParams\n) => NotificationHandle) & { closeAll: () => void }\n\nexport type NotifyTypedFn = (\n  options?: NotificationParamsTyped\n) => NotificationHandle\n\nexport interface Notify extends NotifyFn {\n  success: NotifyTypedFn\n  warning: NotifyTypedFn\n  error: NotifyTypedFn\n  info: NotifyTypedFn\n}\n\nexport interface NotificationQueueItem {\n  vm: VNode\n}\n\nexport type NotificationQueue = NotificationQueueItem[]\n"],"names":["buildProps","definePropType"],"mappings":";;;;;;AACY,MAAC,iBAAiB,GAAG;AACjC,EAAE,SAAS;AACX,EAAE,MAAM;AACR,EAAE,SAAS;AACX,EAAE,OAAO;AACT,EAAE;AACU,MAAC,iBAAiB,GAAGA,gBAAU,CAAC;AAC5C,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,wBAAwB,EAAE;AAC5B,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAEC,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,EAAE,EAAE;AACN,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAEA,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAEA,oBAAc,CAAC,QAAQ,CAAC;AAClC,IAAI,OAAO,EAAE,MAAM,KAAK,CAAC;AACzB,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAEA,oBAAc,CAAC,QAAQ,CAAC;AAClC,IAAI,QAAQ,EAAE,IAAI;AAClB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,WAAW,EAAE,UAAU,EAAE,cAAc,EAAE,aAAa,CAAC;AACpE,IAAI,OAAO,EAAE,WAAW;AACxB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,GAAG,iBAAiB,EAAE,EAAE,CAAC;AACtC,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,CAAC,EAAE;AACS,MAAC,iBAAiB,GAAG;AACjC,EAAE,OAAO,EAAE,MAAM,IAAI;AACrB;;;;;;"}

package/lib/components/notification/src/notification.vue.d.ts

@@ -45,8 +45,8 @@ declare const _default: import("vue").DefineComponent<{
 } & {
     type: import("../../../utils/props").BuildPropType<StringConstructor, "" | "success" | "warning" | "info" | "error", unknown>;
     icon: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | Comment>, unknown, unknown>;
-    title: string;
     zIndex: number;
+    title: string;
     message: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>>, unknown, unknown>;
@@ -65,8 +65,8 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     type: import("../../../utils/props").BuildPropType<StringConstructor, "" | "success" | "warning" | "info" | "error", unknown>;
     icon: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | Comment>, unknown, unknown>;
-    title: string;
     zIndex: number;
+    title: string;
     message: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>>, unknown, unknown>;

package/lib/components/notification/src/notification.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"notification.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/notification/src/notification.vue"],"sourcesContent":["<template>\n  <transition\n    name=\"el-notification-fade\"\n    @before-leave=\"onClose\"\n    @after-leave=\"$emit('destroy')\"\n  >\n    <div\n      v-show=\"visible\"\n      :id=\"id\"\n      :class=\"['el-notification', customClass, horizontalClass]\"\n      :style=\"positionStyle\"\n      role=\"alert\"\n      @mouseenter=\"clearTimer\"\n      @mouseleave=\"startTimer\"\n      @click=\"onClick\"\n    >\n      <el-icon\n        v-if=\"iconComponent\"\n        class=\"el-notification__icon\"\n        :class=\"typeClass\"\n      >\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <div class=\"el-notification__group\">\n        <h2 class=\"el-notification__title\" v-text=\"title\"></h2>\n        <div\n          v-show=\"message\"\n          class=\"el-notification__content\"\n          :style=\"!!title ? undefined : { margin: 0 }\"\n        >\n          <slot>\n            <p v-if=\"!dangerouslyUseHTMLString\">{{ message }}</p>\n            <!-- Caution here, message could've been compromized, nerver use user's input as message -->\n            <!-- eslint-disable-next-line -->\n            <p v-else v-html=\"message\"></p>\n          </slot>\n        </div>\n        <el-icon\n          v-if=\"showClose\"\n          class=\"el-notification__closeBtn\"\n          @click.stop=\"close\"\n        >\n          <close />\n        </el-icon>\n      </div>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, onMounted } from 'vue'\nimport { useEventListener, useTimeoutFn } from '@vueuse/core'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\nimport { notificationProps, notificationEmits } from './notification'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElNotification',\n\n  components: {\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: notificationProps,\n  emits: notificationEmits,\n\n  setup(props) {\n    const visible = ref(false)\n    let timer: (() => void) | undefined = undefined\n\n    const typeClass = computed(() => {\n      const type = props.type\n      return type && TypeComponentsMap[props.type]\n        ? `el-notification--${type}`\n        : ''\n    })\n\n    const iconComponent = computed(() => {\n      return TypeComponentsMap[props.type] || props.icon || ''\n    })\n\n    const horizontalClass = computed(() =>\n      props.position.endsWith('right') ? 'right' : 'left'\n    )\n\n    const verticalProperty = computed(() =>\n      props.position.startsWith('top') ? 'top' : 'bottom'\n    )\n\n    const positionStyle = computed<CSSProperties>(() => {\n      return {\n        [verticalProperty.value]: `${props.offset}px`,\n        zIndex: props.zIndex,\n      }\n    })\n\n    function startTimer() {\n      if (props.duration > 0) {\n        ;({ stop: timer } = useTimeoutFn(() => {\n          if (visible.value) close()\n        }, props.duration))\n      }\n    }\n\n    function clearTimer() {\n      timer?.()\n    }\n\n    function close() {\n      visible.value = false\n    }\n\n    function onKeydown({ code }: KeyboardEvent) {\n      if (code === EVENT_CODE.delete || code === EVENT_CODE.backspace) {\n        clearTimer() // press delete/backspace clear timer\n      } else if (code === EVENT_CODE.esc) {\n        // press esc to close the notification\n        if (visible.value) {\n          close()\n        }\n      } else {\n        startTimer() // resume timer\n      }\n    }\n\n    // lifecycle\n    onMounted(() => {\n      startTimer()\n      visible.value = true\n    })\n\n    useEventListener(document, 'keydown', onKeydown)\n\n    return {\n      horizontalClass,\n      typeClass,\n      iconComponent,\n      positionStyle,\n      visible,\n\n      close,\n      clearTimer,\n      startTimer,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElIcon","TypeComponents","notificationProps","notificationEmits","ref","computed","TypeComponentsMap","useTimeoutFn","EVENT_CODE"],"mappings":";;;;;;;;;;;AA0DA,aAAeA,oBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,YACVC;AAAA,OACGC;AAAA;AAAA,EAGL,OAAOC;AAAA,EACP,OAAOC;AAAA,EAEP,MAAM,OAAO;AACX,UAAM,UAAUC,QAAI;AACpB,QAAI,QAAkC;AAEtC,UAAM,YAAYC,aAAS,MAAM;AAC/B,YAAM,OAAO,MAAM;AACnB,aAAO,QAAQC,uBAAkB,MAAM,QACnC,oBAAoB,SACpB;AAAA;AAGN,UAAM,gBAAgBD,aAAS,MAAM;AACnC,aAAOC,uBAAkB,MAAM,SAAS,MAAM,QAAQ;AAAA;AAGxD,UAAM,kBAAkBD,aAAS,MAC/B,MAAM,SAAS,SAAS,WAAW,UAAU;AAG/C,UAAM,mBAAmBA,aAAS,MAChC,MAAM,SAAS,WAAW,SAAS,QAAQ;AAG7C,UAAM,gBAAgBA,aAAwB,MAAM;AAClD,aAAO;AAAA,SACJ,iBAAiB,QAAQ,GAAG,MAAM;AAAA,QACnC,QAAQ,MAAM;AAAA;AAAA;AAIlB,0BAAsB;AACpB,UAAI,MAAM,WAAW,GAAG;AACtB;AAAC,QAAC,GAAE,MAAM,UAAUE,kBAAa,MAAM;AACrC,cAAI,QAAQ;AAAO;AAAA,WAClB,MAAM;AAAA;AAAA;AAIb,0BAAsB;AACpB;AAAA;AAGF,qBAAiB;AACf,cAAQ,QAAQ;AAAA;AAGlB,uBAAmB,EAAE,QAAuB;AAC1C,UAAI,SAASC,gBAAW,UAAU,SAASA,gBAAW,WAAW;AAC/D;AAAA,iBACS,SAASA,gBAAW,KAAK;AAElC,YAAI,QAAQ,OAAO;AACjB;AAAA;AAAA,aAEG;AACL;AAAA;AAAA;AAKJ,kBAAU,MAAM;AACd;AACA,cAAQ,QAAQ;AAAA;AAGlB,0BAAiB,UAAU,WAAW;AAEtC,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"notification.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/notification/src/notification.vue"],"sourcesContent":["<template>\n  <transition\n    name=\"el-notification-fade\"\n    @before-leave=\"onClose\"\n    @after-leave=\"$emit('destroy')\"\n  >\n    <div\n      v-show=\"visible\"\n      :id=\"id\"\n      :class=\"['el-notification', customClass, horizontalClass]\"\n      :style=\"positionStyle\"\n      role=\"alert\"\n      @mouseenter=\"clearTimer\"\n      @mouseleave=\"startTimer\"\n      @click=\"onClick\"\n    >\n      <el-icon\n        v-if=\"iconComponent\"\n        class=\"el-notification__icon\"\n        :class=\"typeClass\"\n      >\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <div class=\"el-notification__group\">\n        <h2 class=\"el-notification__title\" v-text=\"title\"></h2>\n        <div\n          v-show=\"message\"\n          class=\"el-notification__content\"\n          :style=\"!!title ? undefined : { margin: 0 }\"\n        >\n          <slot>\n            <p v-if=\"!dangerouslyUseHTMLString\">{{ message }}</p>\n            <!-- Caution here, message could've been compromized, nerver use user's input as message -->\n            <!-- eslint-disable-next-line -->\n            <p v-else v-html=\"message\"></p>\n          </slot>\n        </div>\n        <el-icon\n          v-if=\"showClose\"\n          class=\"el-notification__closeBtn\"\n          @click.stop=\"close\"\n        >\n          <close />\n        </el-icon>\n      </div>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, onMounted } from 'vue'\nimport { useEventListener, useTimeoutFn } from '@vueuse/core'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\nimport { notificationProps, notificationEmits } from './notification'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElNotification',\n\n  components: {\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: notificationProps,\n  emits: notificationEmits,\n\n  setup(props) {\n    const visible = ref(false)\n    let timer: (() => void) | undefined = undefined\n\n    const typeClass = computed(() => {\n      const type = props.type\n      return type && TypeComponentsMap[props.type]\n        ? `el-notification--${type}`\n        : ''\n    })\n\n    const iconComponent = computed(() => {\n      return TypeComponentsMap[props.type] || props.icon || ''\n    })\n\n    const horizontalClass = computed(() =>\n      props.position.endsWith('right') ? 'right' : 'left'\n    )\n\n    const verticalProperty = computed(() =>\n      props.position.startsWith('top') ? 'top' : 'bottom'\n    )\n\n    const positionStyle = computed<CSSProperties>(() => {\n      return {\n        [verticalProperty.value]: `${props.offset}px`,\n        zIndex: props.zIndex,\n      }\n    })\n\n    function startTimer() {\n      if (props.duration > 0) {\n        ;({ stop: timer } = useTimeoutFn(() => {\n          if (visible.value) close()\n        }, props.duration))\n      }\n    }\n\n    function clearTimer() {\n      timer?.()\n    }\n\n    function close() {\n      visible.value = false\n    }\n\n    function onKeydown({ code }: KeyboardEvent) {\n      if (code === EVENT_CODE.delete || code === EVENT_CODE.backspace) {\n        clearTimer() // press delete/backspace clear timer\n      } else if (code === EVENT_CODE.esc) {\n        // press esc to close the notification\n        if (visible.value) {\n          close()\n        }\n      } else {\n        startTimer() // resume timer\n      }\n    }\n\n    // lifecycle\n    onMounted(() => {\n      startTimer()\n      visible.value = true\n    })\n\n    useEventListener(document, 'keydown', onKeydown)\n\n    return {\n      horizontalClass,\n      typeClass,\n      iconComponent,\n      positionStyle,\n      visible,\n\n      close,\n      clearTimer,\n      startTimer,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","TypeComponents","notificationEmits","ref","TypeComponentsMap","computed"],"mappings":";;;;;;;;;;;AAsDA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,UAAU,EAAE;;AAEd,IAAI,GAAGC,mBAAc;GAClB;;EAED,KAAK,EAAEC;OACF,CAAC;IACJ,MAAM,OAAO,GAAGC;;;MAGd,MAAM,IAAI,GAAG,KAAK,CAAC;MACnB,OAAO,IAAI,IAAIC;;IAEjB,MAAM;MACJ,OAAOA;KACR,CAAC;;IAEF,MAAM,gBAAgB,GAAGC,YAAQ;UAC3B,aAAa,GAAGA;MACpB,OAAO;QACL,iBAAiB,CAAC,KAAK,GAAG,CAAC;QAC3B;;;IAGJ,SAAS,aAAa;MACpB,IAAI,KAAK,CAAC,QAAQ,GAAG,CAAC,EAAE;;;UAGpB,IAAI,OAAO,CAAC;YACV,KAAK,EAAE,CAAC;;;KAGf;aACQ,UAAU,GAAG;;;IAGtB,SAAS,KAAK,GAAG;MACf,OAAO;;aAEA,SAAS,CAAC,EAAE;MACnB;;;QAGE,WAAW,CAAC;UACV,KAAK,EAAE,CAAC;SACT;aACI;QACL,UAAU,EAAE,CAAC;;;;MAIf,UAAU,EAAE,CAAC;MACb,OAAO,CAAC;;;IAGV,OAAO;MACL;;;MAGA,aAAa;MACb,OAAO;WACF;MACL,UAAU;;;;;;;;"}

package/lib/components/notification/src/notification.vue_vue_type_template_id_d6b81f36_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"notification.vue_vue_type_template_id_d6b81f36_lang.js","sources":["../../../../../../packages/components/notification/src/notification.vue?vue&type=template&id=d6b81f36&lang.js"],"sourcesContent":["<template>\n  <transition\n    name=\"el-notification-fade\"\n    @before-leave=\"onClose\"\n    @after-leave=\"$emit('destroy')\"\n  >\n    <div\n      v-show=\"visible\"\n      :id=\"id\"\n      :class=\"['el-notification', customClass, horizontalClass]\"\n      :style=\"positionStyle\"\n      role=\"alert\"\n      @mouseenter=\"clearTimer\"\n      @mouseleave=\"startTimer\"\n      @click=\"onClick\"\n    >\n      <el-icon\n        v-if=\"iconComponent\"\n        class=\"el-notification__icon\"\n        :class=\"typeClass\"\n      >\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <div class=\"el-notification__group\">\n        <h2 class=\"el-notification__title\" v-text=\"title\"></h2>\n        <div\n          v-show=\"message\"\n          class=\"el-notification__content\"\n          :style=\"!!title ? undefined : { margin: 0 }\"\n        >\n          <slot>\n            <p v-if=\"!dangerouslyUseHTMLString\">{{ message }}</p>\n            <!-- Caution here, message could've been compromized, nerver use user's input as message -->\n            <!-- eslint-disable-next-line -->\n            <p v-else v-html=\"message\"></p>\n          </slot>\n        </div>\n        <el-icon\n          v-if=\"showClose\"\n          class=\"el-notification__closeBtn\"\n          @click.stop=\"close\"\n        >\n          <close />\n        </el-icon>\n      </div>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, onMounted } from 'vue'\nimport { useEventListener, useTimeoutFn } from '@vueuse/core'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\nimport { notificationProps, notificationEmits } from './notification'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElNotification',\n\n  components: {\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: notificationProps,\n  emits: notificationEmits,\n\n  setup(props) {\n    const visible = ref(false)\n    let timer: (() => void) | undefined = undefined\n\n    const typeClass = computed(() => {\n      const type = props.type\n      return type && TypeComponentsMap[props.type]\n        ? `el-notification--${type}`\n        : ''\n    })\n\n    const iconComponent = computed(() => {\n      return TypeComponentsMap[props.type] || props.icon || ''\n    })\n\n    const horizontalClass = computed(() =>\n      props.position.endsWith('right') ? 'right' : 'left'\n    )\n\n    const verticalProperty = computed(() =>\n      props.position.startsWith('top') ? 'top' : 'bottom'\n    )\n\n    const positionStyle = computed<CSSProperties>(() => {\n      return {\n        [verticalProperty.value]: `${props.offset}px`,\n        zIndex: props.zIndex,\n      }\n    })\n\n    function startTimer() {\n      if (props.duration > 0) {\n        ;({ stop: timer } = useTimeoutFn(() => {\n          if (visible.value) close()\n        }, props.duration))\n      }\n    }\n\n    function clearTimer() {\n      timer?.()\n    }\n\n    function close() {\n      visible.value = false\n    }\n\n    function onKeydown({ code }: KeyboardEvent) {\n      if (code === EVENT_CODE.delete || code === EVENT_CODE.backspace) {\n        clearTimer() // press delete/backspace clear timer\n      } else if (code === EVENT_CODE.esc) {\n        // press esc to close the notification\n        if (visible.value) {\n          close()\n        }\n      } else {\n        startTimer() // resume timer\n      }\n    }\n\n    // lifecycle\n    onMounted(() => {\n      startTimer()\n      visible.value = true\n    })\n\n    useEventListener(document, 'keydown', onKeydown)\n\n    return {\n      horizontalClass,\n      typeClass,\n      iconComponent,\n      positionStyle,\n      visible,\n\n      close,\n      clearTimer,\n      startTimer,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_createElementVNode","_toDisplayString","_renderSlot","_createElementBlock","_createCommentVNode","_createVNode"],"mappings":";;;;;;;qBAuBW,OAAM;;;;;;;0BAtBfA;IACE,MAAK;AAAA,IACJ,eAAc;IACd,oDAAa;;yBAEd;yBAAAC;QAEG,IAAI;QACJ,8CAA2B,kBAAa;QACxC,0BAAO;QACR,MAAK;AAAA,QACJ,qDAAY;QACZ,qDAAY;QACZ,gDAAO;;QAGA,uCADRD;;UAEE,2BAAM,yBACE;;+BAER;8BAAAA,4CAAgB;;;;QAElBC,8BAAA;UACEA;YAAI,OAAM;AAAA,yBAAyBC,oBAAQ;;6BAC3CD;YAEE,OAAM;AAAA,YACL,4BAAS,aAAQ;;YAElBE,2CAAA;eACY,kDAAVC,4DAAuC,uCAGvCA;gBAFAC;gBACAA;gBACAJ,8BAAU,WAAQ;;;;wBARZ;;UAYF,mCADRD;;YAEE,OAAM;AAAA,YACL,2BAAY;;iCAEb;cAAAM;;;;;;oBAnCI;;;;;;;;;"}
+{"version":3,"file":"notification.vue_vue_type_template_id_d6b81f36_lang.js","sources":["../../../../../../packages/components/notification/src/notification.vue?vue&type=template&id=d6b81f36&lang.js"],"sourcesContent":["<template>\n  <transition\n    name=\"el-notification-fade\"\n    @before-leave=\"onClose\"\n    @after-leave=\"$emit('destroy')\"\n  >\n    <div\n      v-show=\"visible\"\n      :id=\"id\"\n      :class=\"['el-notification', customClass, horizontalClass]\"\n      :style=\"positionStyle\"\n      role=\"alert\"\n      @mouseenter=\"clearTimer\"\n      @mouseleave=\"startTimer\"\n      @click=\"onClick\"\n    >\n      <el-icon\n        v-if=\"iconComponent\"\n        class=\"el-notification__icon\"\n        :class=\"typeClass\"\n      >\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <div class=\"el-notification__group\">\n        <h2 class=\"el-notification__title\" v-text=\"title\"></h2>\n        <div\n          v-show=\"message\"\n          class=\"el-notification__content\"\n          :style=\"!!title ? undefined : { margin: 0 }\"\n        >\n          <slot>\n            <p v-if=\"!dangerouslyUseHTMLString\">{{ message }}</p>\n            <!-- Caution here, message could've been compromized, nerver use user's input as message -->\n            <!-- eslint-disable-next-line -->\n            <p v-else v-html=\"message\"></p>\n          </slot>\n        </div>\n        <el-icon\n          v-if=\"showClose\"\n          class=\"el-notification__closeBtn\"\n          @click.stop=\"close\"\n        >\n          <close />\n        </el-icon>\n      </div>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, onMounted } from 'vue'\nimport { useEventListener, useTimeoutFn } from '@vueuse/core'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\nimport { notificationProps, notificationEmits } from './notification'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElNotification',\n\n  components: {\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: notificationProps,\n  emits: notificationEmits,\n\n  setup(props) {\n    const visible = ref(false)\n    let timer: (() => void) | undefined = undefined\n\n    const typeClass = computed(() => {\n      const type = props.type\n      return type && TypeComponentsMap[props.type]\n        ? `el-notification--${type}`\n        : ''\n    })\n\n    const iconComponent = computed(() => {\n      return TypeComponentsMap[props.type] || props.icon || ''\n    })\n\n    const horizontalClass = computed(() =>\n      props.position.endsWith('right') ? 'right' : 'left'\n    )\n\n    const verticalProperty = computed(() =>\n      props.position.startsWith('top') ? 'top' : 'bottom'\n    )\n\n    const positionStyle = computed<CSSProperties>(() => {\n      return {\n        [verticalProperty.value]: `${props.offset}px`,\n        zIndex: props.zIndex,\n      }\n    })\n\n    function startTimer() {\n      if (props.duration > 0) {\n        ;({ stop: timer } = useTimeoutFn(() => {\n          if (visible.value) close()\n        }, props.duration))\n      }\n    }\n\n    function clearTimer() {\n      timer?.()\n    }\n\n    function close() {\n      visible.value = false\n    }\n\n    function onKeydown({ code }: KeyboardEvent) {\n      if (code === EVENT_CODE.delete || code === EVENT_CODE.backspace) {\n        clearTimer() // press delete/backspace clear timer\n      } else if (code === EVENT_CODE.esc) {\n        // press esc to close the notification\n        if (visible.value) {\n          close()\n        }\n      } else {\n        startTimer() // resume timer\n      }\n    }\n\n    // lifecycle\n    onMounted(() => {\n      startTimer()\n      visible.value = true\n    })\n\n    useEventListener(document, 'keydown', onKeydown)\n\n    return {\n      horizontalClass,\n      typeClass,\n      iconComponent,\n      positionStyle,\n      visible,\n\n      close,\n      clearTimer,\n      startTimer,\n    }\n  },\n})\n</script>\n"],"names":["_normalizeStyle","_withCtx"],"mappings":";;;;;;;;;;;;;;;;;wBACE;;IAEG;;;;;QAKE,IAAI;QACJ;QACA,uBAAO,kBAAa;QACrB;;QAEC;eACK;;SAGE;8BADR;;;;;;;;;;;;YAQM,KAAK,EAACA;;;;;;;;;;oCAUN;;;;;;;qBARMC;;;;;;uBAcF;;;;;;;;;;"}

package/lib/components/notification/src/notify.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
-var isServer = require('../../../utils/isServer.js');
+var core = require('@vueuse/core');
 var popupManager = require('../../../utils/popup-manager.js');
 require('../../../utils/util.js');
 var error = require('../../../utils/error.js');
@@ -20,7 +20,7 @@ const notifications = {
 const GAP_SIZE = 16;
 let seed = 1;
 const notify = function(options = {}) {
-  if (isServer["default"])
+  if (!core.isClient)
     return { close: () => void 0 };
   if (typeof options === "string" || vue.isVNode(options)) {
     options = { message: options };
@@ -35,7 +35,7 @@ const notify = function(options = {}) {
   const id = `notification_${seed++}`;
   const userOnClose = options.onClose;
   const props = {
-    zIndex: popupManager["default"].nextZIndex(),
+    zIndex: popupManager.PopupManager.nextZIndex(),
     offset: verticalOffset,
     ...options,
     id,