@element-plus/nightly 0.0.20220208 → 0.0.20220209

package/es/components/message/src/message-method.mjs

@@ -1,11 +1,12 @@
 import { isVNode, createVNode, render } from 'vue';
-import { isClient } from '@vueuse/core';
-import { isNumber } from '../../../utils/util.mjs';
-import { PopupManager } from '../../../utils/popup-manager.mjs';
-import { debugWarn } from '../../../utils/error.mjs';
+import { isClient, isNumber } from '@vueuse/core';
+import '../../../utils-v2/index.mjs';
+import '../../../hooks/index.mjs';
 import { messageConfig } from '../../config-provider/src/config-provider.mjs';
 import MessageConstructor from './message2.mjs';
 import { messageTypes } from './message.mjs';
+import { useZIndex } from '../../../hooks/use-z-index/index.mjs';
+import { debugWarn } from '../../../utils-v2/error.mjs';
 
 const instances = [];
 let seed = 1;
@@ -37,10 +38,11 @@ const message = function(options = {}) {
     verticalOffset += (((_a = vm2.el) == null ? void 0 : _a.offsetHeight) || 0) + 16;
   });
   verticalOffset += 16;
+  const { nextZIndex } = useZIndex();
   const id = `message_${seed++}`;
   const userOnClose = options.onClose;
   const props = {
-    zIndex: PopupManager.nextZIndex(),
+    zIndex: nextZIndex(),
     offset: verticalOffset,
     ...options,
     id,

package/es/components/message/src/message-method.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"message-method.mjs","sources":["../../../../../../packages/components/message/src/message-method.ts"],"sourcesContent":["import { createVNode, render } from 'vue'\nimport { isClient } from '@vueuse/core'\nimport { isVNode, isNumber } from '@element-plus/utils/util'\nimport { PopupManager } from '@element-plus/utils/popup-manager'\nimport { debugWarn } from '@element-plus/utils/error'\nimport { messageConfig } from '@element-plus/components/config-provider/src/config-provider'\nimport MessageConstructor from './message.vue'\nimport { messageTypes } from './message'\n\nimport type { Message, MessageFn, MessageQueue, MessageProps } from './message'\nimport type { ComponentPublicInstance, VNode } from 'vue'\n\nconst instances: MessageQueue = []\nlet seed = 1\n\n// TODO: Since Notify.ts is basically the same like this file. So we could do some encapsulation against them to reduce code duplication.\n\nconst message: MessageFn & Partial<Message> = function (options = {}) {\n  if (!isClient) return { close: () => undefined }\n  if (isNumber(messageConfig.max) && instances.length >= messageConfig.max) {\n    return { close: () => undefined }\n  }\n\n  if (\n    !isVNode(options) &&\n    typeof options === 'object' &&\n    options.grouping &&\n    !isVNode(options.message) &&\n    instances.length\n  ) {\n    const tempVm: any = instances.find(\n      (item) =>\n        `${item.vm.props?.message ?? ''}` ===\n        `${(options as any).message ?? ''}`\n    )\n    if (tempVm) {\n      tempVm.vm.component!.props.repeatNum += 1\n      tempVm.vm.component!.props.type = options?.type\n      return {\n        close: () =>\n          ((\n            vm.component!.proxy as ComponentPublicInstance<{ visible: boolean }>\n          ).visible = false),\n      }\n    }\n  }\n\n  if (typeof options === 'string' || isVNode(options)) {\n    options = { message: options }\n  }\n\n  let verticalOffset = options.offset || 20\n  instances.forEach(({ vm }) => {\n    verticalOffset += (vm.el?.offsetHeight || 0) + 16\n  })\n  verticalOffset += 16\n\n  const id = `message_${seed++}`\n  const userOnClose = options.onClose\n  const props: Partial<MessageProps> = {\n    zIndex: PopupManager.nextZIndex(),\n    offset: verticalOffset,\n    ...options,\n    id,\n    onClose: () => {\n      close(id, userOnClose)\n    },\n  }\n\n  let appendTo: HTMLElement | null = document.body\n  if (options.appendTo instanceof HTMLElement) {\n    appendTo = options.appendTo\n  } else if (typeof options.appendTo === 'string') {\n    appendTo = document.querySelector(options.appendTo)\n  }\n  // should fallback to default value with a warning\n  if (!(appendTo instanceof HTMLElement)) {\n    debugWarn(\n      'ElMessage',\n      'the appendTo option is not an HTMLElement. Falling back to document.body.'\n    )\n    appendTo = document.body\n  }\n\n  const container = document.createElement('div')\n\n  container.className = `container_${id}`\n\n  const message = props.message\n  const vm = createVNode(\n    MessageConstructor,\n    props,\n    isVNode(props.message) ? { default: () => message } : null\n  )\n\n  // clean message element preventing mem leak\n  vm.props!.onDestroy = () => {\n    render(null, container)\n    // since the element is destroy, then the VNode should be collected by GC as well\n    // we do not want cause any mem leak because we have returned vm as a reference to users\n    // so that we manually set it to false.\n  }\n\n  render(vm, container)\n  // instances will remove this item when close function gets called. So we do not need to worry about it.\n  instances.push({ vm })\n  appendTo.appendChild(container.firstElementChild!)\n\n  return {\n    // instead of calling the onClose function directly, setting this value so that we can have the full lifecycle\n    // for out component, so that all closing steps will not be skipped.\n    close: () =>\n      ((\n        vm.component!.proxy as ComponentPublicInstance<{ visible: boolean }>\n      ).visible = false),\n  }\n}\n\nmessageTypes.forEach((type) => {\n  message[type] = (options = {}) => {\n    if (typeof options === 'string' || isVNode(options)) {\n      options = {\n        message: options,\n      }\n    }\n    return message({\n      ...options,\n      type,\n    })\n  }\n})\n\nexport function close(id: string, userOnClose?: (vm: VNode) => void): void {\n  const idx = instances.findIndex(({ vm }) => id === vm.component!.props.id)\n  if (idx === -1) return\n\n  const { vm } = instances[idx]\n  if (!vm) return\n  userOnClose?.(vm)\n\n  const removedHeight = vm.el!.offsetHeight\n  instances.splice(idx, 1)\n\n  // adjust other instances vertical offset\n  const len = instances.length\n  if (len < 1) return\n  for (let i = idx; i < len; i++) {\n    const pos =\n      parseInt(instances[i].vm.el!.style['top'], 10) - removedHeight - 16\n\n    instances[i].vm.component!.props.offset = pos\n  }\n}\n\nexport function closeAll(): void {\n  for (let i = instances.length - 1; i >= 0; i--) {\n    const instance = instances[i].vm.component\n    ;(instance?.proxy as any)?.close()\n  }\n}\n\nmessage.closeAll = closeAll\n\nexport default message as Message\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"message-method.mjs","sources":["../../../../../../packages/components/message/src/message-method.ts"],"sourcesContent":["import { createVNode, render } from 'vue'\nimport { isClient } from '@vueuse/core'\nimport { isVNode, isNumber, debugWarn } from '@element-plus/utils-v2'\nimport { useZIndex } from '@element-plus/hooks'\nimport { messageConfig } from '@element-plus/components/config-provider/src/config-provider'\nimport MessageConstructor from './message.vue'\nimport { messageTypes } from './message'\n\nimport type { Message, MessageFn, MessageQueue, MessageProps } from './message'\nimport type { ComponentPublicInstance, VNode } from 'vue'\n\nconst instances: MessageQueue = []\nlet seed = 1\n\n// TODO: Since Notify.ts is basically the same like this file. So we could do some encapsulation against them to reduce code duplication.\n\nconst message: MessageFn & Partial<Message> = function (options = {}) {\n  if (!isClient) return { close: () => undefined }\n  if (isNumber(messageConfig.max) && instances.length >= messageConfig.max) {\n    return { close: () => undefined }\n  }\n\n  if (\n    !isVNode(options) &&\n    typeof options === 'object' &&\n    options.grouping &&\n    !isVNode(options.message) &&\n    instances.length\n  ) {\n    const tempVm: any = instances.find(\n      (item) =>\n        `${item.vm.props?.message ?? ''}` ===\n        `${(options as any).message ?? ''}`\n    )\n    if (tempVm) {\n      tempVm.vm.component!.props.repeatNum += 1\n      tempVm.vm.component!.props.type = options?.type\n      return {\n        close: () =>\n          ((\n            vm.component!.proxy as ComponentPublicInstance<{ visible: boolean }>\n          ).visible = false),\n      }\n    }\n  }\n\n  if (typeof options === 'string' || isVNode(options)) {\n    options = { message: options }\n  }\n\n  let verticalOffset = options.offset || 20\n  instances.forEach(({ vm }) => {\n    verticalOffset += (vm.el?.offsetHeight || 0) + 16\n  })\n  verticalOffset += 16\n\n  const { nextZIndex } = useZIndex()\n\n  const id = `message_${seed++}`\n  const userOnClose = options.onClose\n  const props: Partial<MessageProps> = {\n    zIndex: nextZIndex(),\n    offset: verticalOffset,\n    ...options,\n    id,\n    onClose: () => {\n      close(id, userOnClose)\n    },\n  }\n\n  let appendTo: HTMLElement | null = document.body\n  if (options.appendTo instanceof HTMLElement) {\n    appendTo = options.appendTo\n  } else if (typeof options.appendTo === 'string') {\n    appendTo = document.querySelector(options.appendTo)\n  }\n  // should fallback to default value with a warning\n  if (!(appendTo instanceof HTMLElement)) {\n    debugWarn(\n      'ElMessage',\n      'the appendTo option is not an HTMLElement. Falling back to document.body.'\n    )\n    appendTo = document.body\n  }\n\n  const container = document.createElement('div')\n\n  container.className = `container_${id}`\n\n  const message = props.message\n  const vm = createVNode(\n    MessageConstructor,\n    props,\n    isVNode(props.message) ? { default: () => message } : null\n  )\n\n  // clean message element preventing mem leak\n  vm.props!.onDestroy = () => {\n    render(null, container)\n    // since the element is destroy, then the VNode should be collected by GC as well\n    // we do not want cause any mem leak because we have returned vm as a reference to users\n    // so that we manually set it to false.\n  }\n\n  render(vm, container)\n  // instances will remove this item when close function gets called. So we do not need to worry about it.\n  instances.push({ vm })\n  appendTo.appendChild(container.firstElementChild!)\n\n  return {\n    // instead of calling the onClose function directly, setting this value so that we can have the full lifecycle\n    // for out component, so that all closing steps will not be skipped.\n    close: () =>\n      ((\n        vm.component!.proxy as ComponentPublicInstance<{ visible: boolean }>\n      ).visible = false),\n  }\n}\n\nmessageTypes.forEach((type) => {\n  message[type] = (options = {}) => {\n    if (typeof options === 'string' || isVNode(options)) {\n      options = {\n        message: options,\n      }\n    }\n    return message({\n      ...options,\n      type,\n    })\n  }\n})\n\nexport function close(id: string, userOnClose?: (vm: VNode) => void): void {\n  const idx = instances.findIndex(({ vm }) => id === vm.component!.props.id)\n  if (idx === -1) return\n\n  const { vm } = instances[idx]\n  if (!vm) return\n  userOnClose?.(vm)\n\n  const removedHeight = vm.el!.offsetHeight\n  instances.splice(idx, 1)\n\n  // adjust other instances vertical offset\n  const len = instances.length\n  if (len < 1) return\n  for (let i = idx; i < len; i++) {\n    const pos =\n      parseInt(instances[i].vm.el!.style['top'], 10) - removedHeight - 16\n\n    instances[i].vm.component!.props.offset = pos\n  }\n}\n\nexport function closeAll(): void {\n  for (let i = instances.length - 1; i >= 0; i--) {\n    const instance = instances[i].vm.component\n    ;(instance?.proxy as any)?.close()\n  }\n}\n\nmessage.closeAll = closeAll\n\nexport default message as Message\n"],"names":[],"mappings":";;;;;;;;;;AAOA,MAAM,SAAS,GAAG,EAAE,CAAC;AACrB,IAAI,IAAI,GAAG,CAAC,CAAC;AACR,MAAC,OAAO,GAAG,SAAS,OAAO,GAAG,EAAE,EAAE;AACvC,EAAE,IAAI,CAAC,QAAQ;AACf,IAAI,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,CAAC,EAAE,CAAC;AACnC,EAAE,IAAI,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,SAAS,CAAC,MAAM,IAAI,aAAa,CAAC,GAAG,EAAE;AAC5E,IAAI,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,CAAC,EAAE,CAAC;AACnC,GAAG;AACH,EAAE,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,OAAO,OAAO,KAAK,QAAQ,IAAI,OAAO,CAAC,QAAQ,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,SAAS,CAAC,MAAM,EAAE;AAC7H,IAAI,MAAM,MAAM,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK;AAC5C,MAAM,IAAI,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;AACrB,MAAM,OAAO,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,OAAO,KAAK,IAAI,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,EAAE,GAAG,OAAO,CAAC,OAAO,KAAK,IAAI,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;AAChJ,KAAK,CAAC,CAAC;AACP,IAAI,IAAI,MAAM,EAAE;AAChB,MAAM,MAAM,CAAC,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,IAAI,CAAC,CAAC;AAC/C,MAAM,MAAM,CAAC,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,GAAG,OAAO,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;AAC/E,MAAM,OAAO;AACb,QAAQ,KAAK,EAAE,MAAM,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,OAAO,GAAG,KAAK;AACvD,OAAO,CAAC;AACR,KAAK;AACL,GAAG;AACH,EAAE,IAAI,OAAO,OAAO,KAAK,QAAQ,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE;AACvD,IAAI,OAAO,GAAG,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC;AACnC,GAAG;AACH,EAAE,IAAI,cAAc,GAAG,OAAO,CAAC,MAAM,IAAI,EAAE,CAAC;AAC5C,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK;AACrC,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,cAAc,IAAI,CAAC,CAAC,CAAC,EAAE,GAAG,GAAG,CAAC,EAAE,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,YAAY,KAAK,CAAC,IAAI,EAAE,CAAC;AACrF,GAAG,CAAC,CAAC;AACL,EAAE,cAAc,IAAI,EAAE,CAAC;AACvB,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,SAAS,EAAE,CAAC;AACrC,EAAE,MAAM,EAAE,GAAG,CAAC,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;AACjC,EAAE,MAAM,WAAW,GAAG,OAAO,CAAC,OAAO,CAAC;AACtC,EAAE,MAAM,KAAK,GAAG;AAChB,IAAI,MAAM,EAAE,UAAU,EAAE;AACxB,IAAI,MAAM,EAAE,cAAc;AAC1B,IAAI,GAAG,OAAO;AACd,IAAI,EAAE;AACN,IAAI,OAAO,EAAE,MAAM;AACnB,MAAM,KAAK,CAAC,EAAE,EAAE,WAAW,CAAC,CAAC;AAC7B,KAAK;AACL,GAAG,CAAC;AACJ,EAAE,IAAI,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC;AAC/B,EAAE,IAAI,OAAO,CAAC,QAAQ,YAAY,WAAW,EAAE;AAC/C,IAAI,QAAQ,GAAG,OAAO,CAAC,QAAQ,CAAC;AAChC,GAAG,MAAM,IAAI,OAAO,OAAO,CAAC,QAAQ,KAAK,QAAQ,EAAE;AACnD,IAAI,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;AACxD,GAAG;AACH,EAAE,IAAI,EAAE,QAAQ,YAAY,WAAW,CAAC,EAAE;AAC1C,IAAI,SAAS,CAAC,WAAW,EAAE,2EAA2E,CAAC,CAAC;AACxG,IAAI,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC;AAC7B,GAAG;AACH,EAAE,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;AAClD,EAAE,SAAS,CAAC,SAAS,GAAG,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,CAAC;AAC1C,EAAE,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC;AACjC,EAAE,MAAM,EAAE,GAAG,WAAW,CAAC,kBAAkB,EAAE,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,OAAO,EAAE,MAAM,QAAQ,EAAE,GAAG,IAAI,CAAC,CAAC;AACjH,EAAE,EAAE,CAAC,KAAK,CAAC,SAAS,GAAG,MAAM;AAC7B,IAAI,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;AAC5B,GAAG,CAAC;AACJ,EAAE,MAAM,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC;AACxB,EAAE,SAAS,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;AACzB,EAAE,QAAQ,CAAC,WAAW,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;AACpD,EAAE,OAAO;AACT,IAAI,KAAK,EAAE,MAAM,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,OAAO,GAAG,KAAK;AACnD,GAAG,CAAC;AACJ,EAAE;AACF,YAAY,CAAC,OAAO,CAAC,CAAC,IAAI,KAAK;AAC/B,EAAE,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,OAAO,GAAG,EAAE,KAAK;AACpC,IAAI,IAAI,OAAO,OAAO,KAAK,QAAQ,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE;AACzD,MAAM,OAAO,GAAG;AAChB,QAAQ,OAAO,EAAE,OAAO;AACxB,OAAO,CAAC;AACR,KAAK;AACL,IAAI,OAAO,OAAO,CAAC;AACnB,MAAM,GAAG,OAAO;AAChB,MAAM,IAAI;AACV,KAAK,CAAC,CAAC;AACP,GAAG,CAAC;AACJ,CAAC,CAAC,CAAC;AACI,SAAS,KAAK,CAAC,EAAE,EAAE,WAAW,EAAE;AACvC,EAAE,MAAM,GAAG,GAAG,SAAS,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,GAAG,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;AAClF,EAAE,IAAI,GAAG,KAAK,CAAC,CAAC;AAChB,IAAI,OAAO;AACX,EAAE,MAAM,EAAE,EAAE,EAAE,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC;AAChC,EAAE,IAAI,CAAC,EAAE;AACT,IAAI,OAAO;AACX,EAAE,WAAW,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,WAAW,CAAC,EAAE,CAAC,CAAC;AACjD,EAAE,MAAM,aAAa,GAAG,EAAE,CAAC,EAAE,CAAC,YAAY,CAAC;AAC3C,EAAE,SAAS,CAAC,MAAM,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;AAC3B,EAAE,MAAM,GAAG,GAAG,SAAS,CAAC,MAAM,CAAC;AAC/B,EAAE,IAAI,GAAG,GAAG,CAAC;AACb,IAAI,OAAO;AACX,EAAE,KAAK,IAAI,CAAC,GAAG,GAAG,EAAE,CAAC,GAAG,GAAG,EAAE,CAAC,EAAE,EAAE;AAClC,IAAI,MAAM,GAAG,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,GAAG,aAAa,GAAG,EAAE,CAAC;AACnF,IAAI,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,CAAC;AACjD,GAAG;AACH,CAAC;AACM,SAAS,QAAQ,GAAG;AAC3B,EAAE,IAAI,EAAE,CAAC;AACT,EAAE,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,EAAE;AAClD,IAAI,MAAM,QAAQ,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,SAAS,CAAC;AAC/C,IAAI,CAAC,EAAE,GAAG,QAAQ,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,QAAQ,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,KAAK,EAAE,CAAC;AACpF,GAAG;AACH,CAAC;AACD,OAAO,CAAC,QAAQ,GAAG,QAAQ;;;;"}

package/es/components/message/src/message.d.ts

@@ -1,25 +1,25 @@
-import type { VNode, ExtractPropTypes, Component } from 'vue';
+import type { VNode, ExtractPropTypes } from 'vue';
 export declare const messageTypes: readonly ["success", "info", "warning", "error"];
 export interface MessageConfigContext {
     max?: number;
 }
 export declare const messageProps: {
-    readonly customClass: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
-    readonly center: import("element-plus/es/utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly dangerouslyUseHTMLString: import("element-plus/es/utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly duration: import("element-plus/es/utils/props").BuildPropReturn<NumberConstructor, 3000, unknown, unknown, unknown>;
-    readonly icon: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<string | Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;
-    readonly id: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
-    readonly message: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<string | VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    readonly customClass: import("element-plus/es/utils-v2").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly center: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly dangerouslyUseHTMLString: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly duration: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 3000, unknown, unknown, unknown>;
+    readonly icon: import("element-plus/es/utils-v2").BuildPropReturn<import("element-plus/es/utils-v2").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;
+    readonly id: import("element-plus/es/utils-v2").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly message: import("element-plus/es/utils-v2").BuildPropReturn<import("element-plus/es/utils-v2").PropWrapper<string | VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>>, "", unknown, unknown, unknown>;
-    readonly onClose: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<() => void>, unknown, false, unknown, unknown>;
-    readonly showClose: import("element-plus/es/utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly type: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
-    readonly offset: import("element-plus/es/utils/props").BuildPropReturn<NumberConstructor, 20, unknown, unknown, unknown>;
-    readonly zIndex: import("element-plus/es/utils/props").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
-    readonly grouping: import("element-plus/es/utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly repeatNum: import("element-plus/es/utils/props").BuildPropReturn<NumberConstructor, 1, unknown, unknown, unknown>;
+    readonly onClose: import("element-plus/es/utils-v2").BuildPropReturn<import("element-plus/es/utils-v2").PropWrapper<() => void>, unknown, false, unknown, unknown>;
+    readonly showClose: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly type: import("element-plus/es/utils-v2").BuildPropReturn<StringConstructor, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
+    readonly offset: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 20, unknown, unknown, unknown>;
+    readonly zIndex: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
+    readonly grouping: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly repeatNum: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 1, unknown, unknown, unknown>;
 };
 export declare type MessageProps = ExtractPropTypes<typeof messageProps>;
 export declare const messageEmits: {

package/es/components/message/src/message.mjs

@@ -1,4 +1,6 @@
-import { buildProps, definePropType } from '../../../utils/props.mjs';
+import '../../../utils-v2/index.mjs';
+import { buildProps, definePropType } from '../../../utils-v2/vue/prop.mjs';
+import { iconPropType } from '../../../utils-v2/vue/icon.mjs';
 
 const messageTypes = ["success", "info", "warning", "error"];
 const messageProps = buildProps({
@@ -19,7 +21,7 @@ const messageProps = buildProps({
     default: 3e3
   },
   icon: {
-    type: definePropType([String, Object]),
+    type: iconPropType,
     default: ""
   },
   id: {

package/es/components/message/src/message.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"message.mjs","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 interface MessageConfigContext {\n  max?: number\n}\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":[],"mappings":";;AACY,MAAC,YAAY,GAAG,CAAC,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE;AACxD,MAAC,YAAY,GAAG,UAAU,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,EAAE,cAAc,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,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,cAAc,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;;;;"}
+{"version":3,"file":"message.mjs","sources":["../../../../../../packages/components/message/src/message.ts"],"sourcesContent":["import {\n  buildProps,\n  definePropType,\n  iconPropType,\n} from '@element-plus/utils-v2'\nimport type { VNode, ExtractPropTypes } from 'vue'\n\nexport const messageTypes = ['success', 'info', 'warning', 'error'] as const\n\nexport interface MessageConfigContext {\n  max?: number\n}\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: iconPropType,\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":[],"mappings":";;;;AAKY,MAAC,YAAY,GAAG,CAAC,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE;AACxD,MAAC,YAAY,GAAG,UAAU,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,EAAE,YAAY;AACtB,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,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,cAAc,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/es/components/message/src/message.vue.d.ts

@@ -1,67 +1,80 @@
 import type { CSSProperties } from 'vue';
 declare const _default: import("vue").DefineComponent<{
-    readonly customClass: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
-    readonly center: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly dangerouslyUseHTMLString: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly duration: import("../../../utils/props").BuildPropReturn<NumberConstructor, 3000, unknown, unknown, unknown>;
-    readonly icon: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;
-    readonly id: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
-    readonly message: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    readonly customClass: import("element-plus/es/utils-v2").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly center: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly dangerouslyUseHTMLString: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly duration: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 3000, unknown, unknown, unknown>;
+    readonly icon: import("element-plus/es/utils-v2").BuildPropReturn<import("element-plus/es/utils-v2").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;
+    readonly id: import("element-plus/es/utils-v2").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly message: import("element-plus/es/utils-v2").BuildPropReturn<import("element-plus/es/utils-v2").PropWrapper<string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>>, "", unknown, unknown, unknown>;
-    readonly onClose: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<() => void>, unknown, false, unknown, unknown>;
-    readonly showClose: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly type: import("../../../utils/props").BuildPropReturn<StringConstructor, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
-    readonly offset: import("../../../utils/props").BuildPropReturn<NumberConstructor, 20, unknown, unknown, unknown>;
-    readonly zIndex: import("../../../utils/props").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
-    readonly grouping: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly repeatNum: import("../../../utils/props").BuildPropReturn<NumberConstructor, 1, unknown, unknown, unknown>;
+    readonly onClose: import("element-plus/es/utils-v2").BuildPropReturn<import("element-plus/es/utils-v2").PropWrapper<() => void>, unknown, false, unknown, unknown>;
+    readonly showClose: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly type: import("element-plus/es/utils-v2").BuildPropReturn<StringConstructor, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
+    readonly offset: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 20, unknown, unknown, unknown>;
+    readonly zIndex: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
+    readonly grouping: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly repeatNum: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 1, unknown, unknown, unknown>;
 }, {
-    typeClass: import("vue").ComputedRef<string>;
-    iconComponent: import("vue").ComputedRef<import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>>;
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
+    typeClass: import("vue").ComputedRef<{
+        [x: string]: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+    }>;
+    iconComponent: import("vue").ComputedRef<import("element-plus/es/utils-v2").BuildPropType<import("element-plus/es/utils-v2").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>>;
     customStyle: import("vue").ComputedRef<CSSProperties>;
     visible: import("vue").Ref<boolean>;
-    badgeType: import("vue").Ref<import("../../../utils/props").BuildPropType<StringConstructor, "primary" | "success" | "warning" | "info" | "danger", unknown>>;
+    badgeType: import("vue").Ref<import("element-plus/es/utils-v2").BuildPropType<StringConstructor, "primary" | "success" | "warning" | "info" | "danger", unknown>>;
     close: () => void;
     clearTimer: () => void;
     startTimer: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     destroy: () => boolean;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    readonly customClass: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
-    readonly center: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly dangerouslyUseHTMLString: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly duration: import("../../../utils/props").BuildPropReturn<NumberConstructor, 3000, unknown, unknown, unknown>;
-    readonly icon: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;
-    readonly id: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
-    readonly message: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    readonly customClass: import("element-plus/es/utils-v2").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly center: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly dangerouslyUseHTMLString: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly duration: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 3000, unknown, unknown, unknown>;
+    readonly icon: import("element-plus/es/utils-v2").BuildPropReturn<import("element-plus/es/utils-v2").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;
+    readonly id: import("element-plus/es/utils-v2").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly message: import("element-plus/es/utils-v2").BuildPropReturn<import("element-plus/es/utils-v2").PropWrapper<string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>>, "", unknown, unknown, unknown>;
-    readonly onClose: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<() => void>, unknown, false, unknown, unknown>;
-    readonly showClose: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly type: import("../../../utils/props").BuildPropReturn<StringConstructor, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
-    readonly offset: import("../../../utils/props").BuildPropReturn<NumberConstructor, 20, unknown, unknown, unknown>;
-    readonly zIndex: import("../../../utils/props").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
-    readonly grouping: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
-    readonly repeatNum: import("../../../utils/props").BuildPropReturn<NumberConstructor, 1, unknown, unknown, unknown>;
+    readonly onClose: import("element-plus/es/utils-v2").BuildPropReturn<import("element-plus/es/utils-v2").PropWrapper<() => void>, unknown, false, unknown, unknown>;
+    readonly showClose: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly type: import("element-plus/es/utils-v2").BuildPropReturn<StringConstructor, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
+    readonly offset: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 20, unknown, unknown, unknown>;
+    readonly zIndex: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
+    readonly grouping: import("element-plus/es/utils-v2").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly repeatNum: import("element-plus/es/utils-v2").BuildPropReturn<NumberConstructor, 1, unknown, unknown, unknown>;
 }>> & {
     onDestroy?: (() => any) | undefined;
 }, {
-    type: import("../../../utils/props").BuildPropType<StringConstructor, "success" | "warning" | "info" | "error", unknown>;
-    icon: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
-    message: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    type: import("element-plus/es/utils-v2").BuildPropType<StringConstructor, "success" | "warning" | "info" | "error", unknown>;
+    icon: import("element-plus/es/utils-v2").BuildPropType<import("element-plus/es/utils-v2").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
+    message: import("element-plus/es/utils-v2").BuildPropType<import("element-plus/es/utils-v2").PropWrapper<string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>>, unknown, unknown>;
     zIndex: number;
     offset: number;
-    center: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    center: import("element-plus/es/utils-v2").BuildPropType<BooleanConstructor, unknown, unknown>;
     onClose: () => void;
     id: string;
-    showClose: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    showClose: import("element-plus/es/utils-v2").BuildPropType<BooleanConstructor, unknown, unknown>;
     customClass: string;
     duration: number;
-    dangerouslyUseHTMLString: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
-    grouping: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    dangerouslyUseHTMLString: import("element-plus/es/utils-v2").BuildPropType<BooleanConstructor, unknown, unknown>;
+    grouping: import("element-plus/es/utils-v2").BuildPropType<BooleanConstructor, unknown, unknown>;
     repeatNum: number;
 }>;
 export default _default;

package/es/components/message/src/message2.mjs

@@ -3,9 +3,12 @@ import { useTimeoutFn, useEventListener } from '@vueuse/core';
 import { EVENT_CODE } from '../../../utils/aria.mjs';
 import { ElBadge } from '../../badge/index.mjs';
 import { ElIcon } from '../../icon/index.mjs';
-import { TypeComponents, TypeComponentsMap } from '../../../utils/icon.mjs';
+import '../../../utils-v2/index.mjs';
+import '../../../hooks/index.mjs';
 import { messageProps, messageEmits } from './message.mjs';
 import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { TypeComponents, TypeComponentsMap } from '../../../utils-v2/vue/icon.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
 const _sfc_main = defineComponent({
   name: "ElMessage",
@@ -17,12 +20,13 @@ const _sfc_main = defineComponent({
   props: messageProps,
   emits: messageEmits,
   setup(props) {
+    const ns = useNamespace("message");
     const visible = ref(false);
     const badgeType = ref(props.type ? props.type === "error" ? "danger" : props.type : "info");
     let stopTimer = void 0;
     const typeClass = computed(() => {
       const type = props.type;
-      return type && TypeComponentsMap[type] ? `el-message-icon--${type}` : "";
+      return { [ns.bm("icon", type)]: type && TypeComponentsMap[type] };
     });
     const iconComponent = computed(() => {
       return props.icon || TypeComponentsMap[props.type] || "";
@@ -65,6 +69,7 @@ const _sfc_main = defineComponent({
     });
     useEventListener(document, "keydown", keydown);
     return {
+      ns,
       typeClass,
       iconComponent,
       customStyle,
@@ -77,17 +82,13 @@ const _sfc_main = defineComponent({
   }
 });
 const _hoisted_1 = ["id"];
-const _hoisted_2 = {
-  key: 0,
-  class: "el-message__content"
-};
-const _hoisted_3 = ["innerHTML"];
+const _hoisted_2 = ["innerHTML"];
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_badge = resolveComponent("el-badge");
   const _component_el_icon = resolveComponent("el-icon");
   const _component_close = resolveComponent("close");
   return openBlock(), createBlock(Transition, {
-    name: "el-message-fade",
+    name: _ctx.ns.b("fade"),
     onBeforeLeave: _ctx.onClose,
     onAfterLeave: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("destroy"))
   }, {
@@ -95,10 +96,10 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       withDirectives(createElementVNode("div", {
         id: _ctx.id,
         class: normalizeClass([
-          "el-message",
-          _ctx.type && !_ctx.icon ? `el-message--${_ctx.type}` : "",
-          _ctx.center ? "is-center" : "",
-          _ctx.showClose ? "is-closable" : "",
+          _ctx.ns.b(),
+          { [_ctx.ns.m(_ctx.type)]: _ctx.type && !_ctx.icon },
+          _ctx.ns.is("center", _ctx.center),
+          _ctx.ns.is("closable", _ctx.showClose),
           _ctx.customClass
         ]),
         style: normalizeStyle(_ctx.customStyle),
@@ -110,11 +111,11 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           key: 0,
           value: _ctx.repeatNum,
           type: _ctx.badgeType,
-          class: "el-message__badge"
-        }, null, 8, ["value", "type"])) : createCommentVNode("v-if", true),
+          class: normalizeClass(_ctx.ns.e("badge"))
+        }, null, 8, ["value", "type", "class"])) : createCommentVNode("v-if", true),
         _ctx.iconComponent ? (openBlock(), createBlock(_component_el_icon, {
           key: 1,
-          class: normalizeClass(["el-message__icon", _ctx.typeClass])
+          class: normalizeClass([_ctx.ns.e("icon"), _ctx.typeClass])
         }, {
           default: withCtx(() => [
             (openBlock(), createBlock(resolveDynamicComponent(_ctx.iconComponent)))
@@ -122,30 +123,33 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           _: 1
         }, 8, ["class"])) : createCommentVNode("v-if", true),
         renderSlot(_ctx.$slots, "default", {}, () => [
-          !_ctx.dangerouslyUseHTMLString ? (openBlock(), createElementBlock("p", _hoisted_2, toDisplayString(_ctx.message), 1)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+          !_ctx.dangerouslyUseHTMLString ? (openBlock(), createElementBlock("p", {
+            key: 0,
+            class: normalizeClass(_ctx.ns.e("content"))
+          }, toDisplayString(_ctx.message), 3)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
             createCommentVNode(" Caution here, message could've been compromised, never use user's input as message "),
             createElementVNode("p", {
-              class: "el-message__content",
+              class: normalizeClass(_ctx.ns.e("content")),
               innerHTML: _ctx.message
-            }, null, 8, _hoisted_3)
+            }, null, 10, _hoisted_2)
           ], 2112))
         ]),
         _ctx.showClose ? (openBlock(), createBlock(_component_el_icon, {
           key: 2,
-          class: "el-message__closeBtn",
+          class: normalizeClass(_ctx.ns.e("closeBtn")),
           onClick: withModifiers(_ctx.close, ["stop"])
         }, {
           default: withCtx(() => [
             createVNode(_component_close)
           ]),
           _: 1
-        }, 8, ["onClick"])) : createCommentVNode("v-if", true)
+        }, 8, ["class", "onClick"])) : createCommentVNode("v-if", true)
       ], 46, _hoisted_1), [
         [vShow, _ctx.visible]
       ])
     ]),
     _: 3
-  }, 8, ["onBeforeLeave"]);
+  }, 8, ["name", "onBeforeLeave"]);
 }
 var MessageConstructor = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 

package/es/components/message/src/message2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"message2.mjs","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":["_openBlock","_Transition","_createElementVNode","_normalizeStyle","_createCommentVNode","_createElementBlock","_withCtx"],"mappings":";;;;;;;;;AA6DA,MAAK,YAAa,gBAAa;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,OACG;AAAA;AAAA,EAGL,OAAO;AAAA,EACP,OAAO;AAAA,EAEP,MAAM,OAAO;AACX,UAAM,UAAU,IAAI;AACpB,UAAM,YAAY,IAChB,MAAM,OAAQ,MAAM,SAAS,UAAU,WAAW,MAAM,OAAQ;AAElE,QAAI,YAAsC;AAE1C,UAAM,YAAY,SAAS,MAAM;AAC/B,YAAM,OAAO,MAAM;AACnB,aAAO,QAAQ,kBAAkB,QAAQ,oBAAoB,SAAS;AAAA;AAGxE,UAAM,gBAAgB,SAAS,MAAM;AACnC,aAAO,MAAM,QAAQ,kBAAkB,MAAM,SAAS;AAAA;AAGxD,UAAM,cAAc,SAAwB;AAAO,MACjD,KAAK,GAAG,MAAM;AAAA,MACd,QAAQ,MAAM;AAAA;AAGhB,0BAAsB;AACpB,UAAI,MAAM,WAAW,GAAG;AACtB;AAAC,QAAC,GAAE,MAAM,cAAc,aAAa,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,SAAS,WAAW,KAAK;AAE3B,YAAI,QAAQ,OAAO;AACjB;AAAA;AAAA,aAEG;AACL;AAAA;AAAA;AAIJ,cAAU,MAAM;AACd;AACA,cAAQ,QAAQ;AAAA;AAGlB,UACE,MAAM,MAAM,WACZ,MAAM;AACJ;AACA;AAAA;AAIJ,qBAAiB,UAAU,WAAW;AAEtC,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;EAjHsC,KAAK;AAAA;;;;;;;SA9BxCA,yBAAiBC;AAAA,IACrB;AAAA,IACA,eAAW;AAAA;;qBAEZ;AAAA,qBAESC;AAAA,QACN,SAAK;AAAA;UAAkC;AAAA,UAAoD,aAAM;AAAA,UAA6B,cAAS;AAAA,UAA+B,iBAAW;AAAA;;QAQlL,OAAKC,eAAO;AAAA,QACX;AAAA,QACA,cAAU,uCAAE;AAAA;SAGL;AAAA;UACL,KAAK;AAAA,UACL,OAAM;AAAA,UACP,MAAK,KAAC;AAAA;0CAGOC,mBAAa;AAAA;UAAE,KAAK;AAAA;;2BACjC;AAAA;;;4BAEFA,mBAMO;AAAA,mBALK,wBAAwB;AAAA,yDAIlCC,mBAA2D,oEAD3DA;AAAA,YACAD,mBAA2D;AAAA,+BAA3C;AAAA,cAAsB;AAAA;;;;;UAItC,KAAK;AAAA,UACJ,OAAK;AAAA;;mBAENE,QAAS;AAAA;;;;aApCI;AAAA;;;;;;;;;;"}
+{"version":3,"file":"message2.mjs","sources":["../../../../../../packages/components/message/src/message.vue"],"sourcesContent":["<template>\n  <transition\n    :name=\"ns.b('fade')\"\n    @before-leave=\"onClose\"\n    @after-leave=\"$emit('destroy')\"\n  >\n    <div\n      v-show=\"visible\"\n      :id=\"id\"\n      :class=\"[\n        ns.b(),\n        { [ns.m(type)]: type && !icon },\n        ns.is('center', center),\n        ns.is('closable', showClose),\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=\"ns.e('badge')\"\n      >\n      </el-badge>\n      <el-icon v-if=\"iconComponent\" :class=\"[ns.e('icon'), typeClass]\">\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <slot>\n        <p v-if=\"!dangerouslyUseHTMLString\" :class=\"ns.e('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=\"ns.e('content')\" v-html=\"message\"></p>\n      </slot>\n      <el-icon v-if=\"showClose\" :class=\"ns.e('closeBtn')\" @click.stop=\"close\">\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-v2'\n\nimport { useNamespace } from '@element-plus/hooks'\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 ns = useNamespace('message')\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 { [ns.bm('icon', type)]: type && TypeComponentsMap[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      ns,\n      typeClass,\n      iconComponent,\n      customStyle,\n      visible,\n      badgeType,\n\n      close,\n      clearTimer,\n      startTimer,\n    }\n  },\n})\n</script>\n"],"names":["_openBlock","_createBlock","_createElementVNode","_normalizeClass","_normalizeStyle","_createCommentVNode","_createElementBlock","_withCtx"],"mappings":";;;;;;;;;;;;AA0DA,MAAK,YAAa,gBAAa;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,OACG;AAAA;AAAA,EAGL,OAAO;AAAA,EACP,OAAO;AAAA,EAEP,MAAM,OAAO;AACX,UAAM,KAAK,aAAa;AACxB,UAAM,UAAU,IAAI;AACpB,UAAM,YAAY,IAChB,MAAM,OAAQ,MAAM,SAAS,UAAU,WAAW,MAAM,OAAQ;AAElE,QAAI,YAAsC;AAE1C,UAAM,YAAY,SAAS,MAAM;AAC/B,YAAM,OAAO,MAAM;AACnB,aAAO,GAAG,GAAG,GAAG,QAAQ,QAAQ,QAAQ,kBAAkB;AAAA;AAG5D,UAAM,gBAAgB,SAAS,MAAM;AACnC,aAAO,MAAM,QAAQ,kBAAkB,MAAM,SAAS;AAAA;AAGxD,UAAM,cAAc,SAAwB;AAAO,MACjD,KAAK,GAAG,MAAM;AAAA,MACd,QAAQ,MAAM;AAAA;AAGhB,0BAAsB;AACpB,UAAI,MAAM,WAAW,GAAG;AACtB;AAAC,QAAC,GAAE,MAAM,cAAc,aAAa,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,SAAS,WAAW,KAAK;AAE3B,YAAI,QAAQ,OAAO;AACjB;AAAA;AAAA,aAEG;AACL;AAAA;AAAA;AAIJ,cAAU,MAAM;AACd;AACA,cAAQ,QAAQ;AAAA;AAGlB,UACE,MAAM,MAAM,WACZ,MAAM;AACJ;AACA;AAAA;AAIJ,qBAAiB,UAAU,WAAW;AAEtC,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;;;;SA9IKA,aAAIC;AAAA,IACV,cAAY,EAAE;AAAA,IACd,eAAW;AAAA;;qBAEZ;AAAA,qBAESC;AAAA,QACN,SAAK;AAAA,QAAY,OAAEC,eAAE;AAAA,eAAe;AAAA,UAAsC,QAAG,GAAE,eAAW,aAAM;AAAA,UAAW,QAAG,GAAE,eAAa;AAAA,UAAoB,uBAAW;AAAA;;QAQ7J,OAAKC,eAAO;AAAA,QACX;AAAA,QACA,cAAU,uCAAE;AAAA;SAGL;AAAA;UACL,KAAK;AAAA,UACL,OAAM;AAAA,UACN,MAAK;AAAA;mDAGOC,mBAAa;AAAA;UAAG,KAAK;AAAA;;2BAClC;AAAA;;;4BAEFA,mBAMO;AAAA,mBALK,wBAAwB;AAAA;YAAG,KAAK;AAAA,kCACrC,QAAO;AAAA,6BAGZ,eAAwD,oBADxDC;AAAA,YACAD,mBAAwD;AAAA,+BAAxC,KAAE;AAAA,cAAiB,sBAAe;AAAA;;;;;UAEzB,KAAK;AAAA,UAAqB,OAAKF,oBAAO;AAAA;;mBAC/DI,QAAS;AAAA;;;;aAhCI;AAAA;;;;;;;;;;"}

package/es/components/message-box/index.d.ts

@@ -1,4 +1,4 @@
-import type { SFCWithInstall } from 'element-plus/es/utils/types';
+import type { SFCWithInstall } from 'element-plus/es/utils-v2';
 declare const _MessageBox: SFCWithInstall<import("./src/message-box.type").IElMessageBox>;
 export default _MessageBox;
 export declare const ElMessageBox: SFCWithInstall<import("./src/message-box.type").IElMessageBox>;

package/es/components/message-box/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","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":[],"mappings":";;;AACK,MAAC,WAAW,GAAG,WAAW;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;;;;"}
+{"version":3,"file":"index.mjs","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-v2'\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":[],"mappings":";;;AACK,MAAC,WAAW,GAAG,WAAW;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/es/components/message-box/src/index.mjs

@@ -4,15 +4,16 @@ import '../../../directives/index.mjs';
 import '../../../hooks/index.mjs';
 import { ElInput } from '../../input/index.mjs';
 import { ElOverlay } from '../../overlay/index.mjs';
-import { PopupManager } from '../../../utils/popup-manager.mjs';
 import { on, off } from '../../../utils/dom.mjs';
 import { EVENT_CODE } from '../../../utils/aria.mjs';
-import { isValidComponentSize } from '../../../utils/validators.mjs';
+import '../../../utils-v2/index.mjs';
 import { ElIcon } from '../../icon/index.mjs';
-import { TypeComponents, TypeComponentsMap } from '../../../utils/icon.mjs';
 import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
 import TrapFocus from '../../../directives/trap-focus/index.mjs';
+import { TypeComponents, TypeComponentsMap } from '../../../utils-v2/vue/icon.mjs';
+import { isValidComponentSize } from '../../../utils-v2/vue/validator.mjs';
 import { useLocale } from '../../../hooks/use-locale/index.mjs';
+import { useZIndex } from '../../../hooks/use-z-index/index.mjs';
 import { useSize } from '../../../hooks/use-common-props/index.mjs';
 import { useDraggable } from '../../../hooks/use-draggable/index.mjs';
 import { useSameTarget } from '../../../hooks/use-same-target/index.mjs';
@@ -82,6 +83,7 @@ const _sfc_main = defineComponent({
   setup(props, { emit }) {
     const { t } = useLocale();
     const visible = ref(false);
+    const { nextZIndex } = useZIndex();
     const state = reactive({
       beforeClose: null,
       callback: null,
@@ -114,7 +116,7 @@ const _sfc_main = defineComponent({
       confirmButtonDisabled: false,
       editorErrorMessage: "",
       validateError: false,
-      zIndex: PopupManager.nextZIndex()
+      zIndex: nextZIndex()
     });
     const typeClass = computed(() => {
       const type = state.type;
@@ -142,7 +144,7 @@ const _sfc_main = 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.nextZIndex();
+        state.zIndex = nextZIndex();
       }
       if (props.boxType !== "prompt")
         return;