yuang-framework-ui-pc 1.1.15 → 1.1.16

package/es/core-components.js

@@ -23,8 +23,7 @@ import { default as default23 } from "./ele-icon-select/index";
 import { default as default24 } from "./ele-image-viewer/index";
 import { default as default25 } from "./ele-loading/index";
 import { default as default26 } from "./ele-menus/index";
-import { default as default27 } from "./ele-dialog/index";
-import { default as default28 } from "./ele-dialog/index";
+import { default as default27, default as default28 } from "./ele-dialog/index";
 import { default as default29 } from "./ele-page/index";
 import { default as default30 } from "./ele-pagination/index";
 import { default as default31 } from "./ele-popconfirm/index";
@@ -66,7 +65,7 @@ export {
   default13 as EleCopyable,
   default14 as EleDashboard,
   default15 as EleDataTable,
-  default28 as EleDialog,
+  default27 as EleDialog,
   default16 as EleDot,
   default17 as EleDrawer,
   default18 as EleDropdown,
@@ -78,7 +77,7 @@ export {
   default24 as EleImageViewer,
   default25 as EleLoading,
   default26 as EleMenus,
-  default27 as EleModal,
+  default28 as EleModal,
   default29 as ElePage,
   default30 as ElePagination,
   default31 as ElePopconfirm,

package/es/ele-dialog/index.d.ts

@@ -91,7 +91,7 @@ declare const _default: import('vue').DefineComponent<{
 }, {
     dialogRef: import('vue').Ref<ElDialogInstance>;
     isFullscreen: import('vue').Ref<boolean>;
-    dialogClass: import('vue').ComputedRef<string>;
+    modalClass: import('vue').ComputedRef<string>;
     teleportTo: import('vue').ComputedRef<string | Element>;
     teleportDisabled: import('vue').ComputedRef<boolean>;
     handleHeaderMousedown: (e: MouseEvent) => void;
@@ -238,8 +238,8 @@ declare const _default: import('vue').DefineComponent<{
     minHeight: number;
     multiple: boolean;
     responsive: boolean;
+    inner: boolean;
     resetOnClose: boolean;
     maxable: boolean;
-    inner: boolean;
 }, {}>;
 export default _default;

package/es/ele-dialog/index.js

@@ -3,8 +3,8 @@ import { ElDialog, ElIcon } from "element-plus";
 import { CloseOutlined, CompressOutlined, ExpandOutlined, ResizeOutlined } from "../icons";
 import ReceiverView from "../ele-config-provider/components/receiver-view";
 import { useLayoutState, useResponsive } from "../ele-pro-layout/util";
-import { getModalContainer, useModalEvent, wrapperClass, closedClass } from "./util";
-import { modalProps, modalEmits } from "./props";
+import { getDialogContainer, useDialogEvent, wrapperClass, closedClass } from "./util";
+import { eleDialogProps, eleDialogEmits } from "./props";
 const _sfc_main = defineComponent({
   name: "EleDialog",
   components: {
@@ -17,15 +17,15 @@ const _sfc_main = defineComponent({
     ReceiverView
   },
   inheritAttrs: false,
-  props: modalProps,
-  emits: modalEmits,
+  props: eleDialogProps,
+  emits: eleDialogEmits,
   setup(props, { emit }) {
     const layoutState = useLayoutState();
     const isResponsive = useResponsive(props);
     const dialogRef = ref(null);
     const isFullscreen = ref(props.fullscreen ?? false);
     const isActivated = ref(true);
-    const dialogClass = computed(() => {
+    const modalClass = computed(() => {
       const classes = [wrapperClass];
       if (props.responsive ?? isResponsive.value ?? true) {
         classes.push("ele-dialog-responsive");
@@ -76,11 +76,11 @@ const _sfc_main = defineComponent({
       return classes.join(" ");
     });
     const teleportTo = computed(() => {
-      return getModalContainer(
+      return getDialogContainer(
         props.inner,
         props.multiple,
         props.appendTo,
-        layoutState.modalsEl
+        layoutState.dialogsEl
       );
     });
     const teleportDisabled = computed(() => {
@@ -95,17 +95,17 @@ const _sfc_main = defineComponent({
       handleResizeTouchstart,
       bindAutoTopEvent,
       unbindAutoTopEvent,
-      topModal,
+      topDialog,
       setInitPosition,
-      resetModalStyle
-    } = useModalEvent(dialogRef, props, isFullscreen);
+      resetDialogStyle
+    } = useDialogEvent(dialogRef, props, isFullscreen);
     const updateModelValue = (modelValue) => {
       emit("update:modelValue", modelValue);
     };
     const toggleFullscreen = (fullscreen) => {
       isFullscreen.value = fullscreen ?? !isFullscreen.value;
       nextTick(() => {
-        topModal();
+        topDialog();
       });
       emit("update:fullscreen", isFullscreen.value);
     };
@@ -115,11 +115,11 @@ const _sfc_main = defineComponent({
       }
       nextTick(() => {
         if (props.resetOnClose) {
-          resetModalStyle();
+          resetDialogStyle();
         } else {
           setInitPosition();
         }
-        topModal();
+        topDialog();
       });
       emit("open");
     };
@@ -160,7 +160,7 @@ const _sfc_main = defineComponent({
     return {
       dialogRef,
       isFullscreen,
-      dialogClass,
+      modalClass,
       teleportTo,
       teleportDisabled,
       handleHeaderMousedown,
@@ -204,7 +204,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       width: _ctx.width,
       fullscreen: false,
       modal: _ctx.multiple ? false : _ctx.modal,
-      modalClass: _ctx.dialogClass,
+      modalClass: _ctx.modalClass,
       appendToBody: false,
       lockScroll: _ctx.inner || _ctx.multiple ? false : _ctx.lockScroll,
       openDelay: _ctx.openDelay,

package/es/ele-dialog/props.d.ts

@@ -6,7 +6,7 @@ import { Resizable, MoveOut, Position } from './types';
 /**
  * 属性
  */
-export declare const modalProps: {
+export declare const eleDialogProps: {
     appendToBody: {
         type: BooleanConstructor;
         default: boolean;
@@ -113,11 +113,11 @@ export declare const modalProps: {
     title: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
     ariaLevel: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
 };
-export type ModalProps = ExtractPropTypes<typeof modalProps>;
+export type DialogProps = ExtractPropTypes<typeof dialogProps>;
 /**
  * 事件
  */
-export declare const modalEmits: {
+export declare const eleDialogEmits: {
     /** 更新全屏状态 */
     'update:fullscreen': (_fullscreen: boolean) => boolean;
     open: () => boolean;

package/es/ele-dialog/props.js

@@ -1,5 +1,5 @@
 import { dialogProps, dialogEmits } from "element-plus";
-const modalProps = {
+const eleDialogProps = {
   ...dialogProps,
   appendToBody: {
     type: Boolean,
@@ -58,7 +58,7 @@ const modalProps = {
   /** 是否是表单弹窗 */
   form: Boolean
 };
-const modalEmits = {
+const eleDialogEmits = {
   ...dialogEmits,
   /** 更新全屏状态 */
   "update:fullscreen": (_fullscreen) => true
@@ -66,6 +66,6 @@ const modalEmits = {
 const dialogPropKeys = Object.keys(dialogProps);
 export {
   dialogPropKeys,
-  modalEmits,
-  modalProps
+  eleDialogEmits,
+  eleDialogProps
 };

package/es/ele-dialog/util.d.ts

@@ -1,6 +1,6 @@
 import { Ref } from 'vue';
 import { ElDialogInstance } from '../ele-app/el';
-import { ModalProps } from './props';
+import { DialogProps } from './props';
 
 export declare const containerClass = "ele-dialog-container";
 export declare const wrapperClass = "ele-dialog";
@@ -10,16 +10,16 @@ export declare const closedClass = "ele-dialog-closed";
  * @param inner 是否限制在主体内部
  * @param multiple 是否支持同时打开多个
  * @param appendTo 自定义插入的容器
- * @param modalsEl 限制在主体内部时的容器
+ * @param dialogsEl 限制在主体内部时的容器
  */
-export declare function getModalContainer(inner?: boolean, multiple?: boolean, appendTo?: string | HTMLElement, modalsEl?: HTMLElement | null): HTMLElement | string;
+export declare function getDialogContainer(inner?: boolean, multiple?: boolean, appendTo?: string | HTMLElement, dialogsEl?: HTMLElement | null): HTMLElement | string;
 /**
  * 弹窗支持移动
  * @param dialogRef 弹窗实例
  * @param props 属性
  * @param isFullscreen 全屏状态
  */
-export declare function useModalMove(dialogRef: Ref<ElDialogInstance>, props: ModalProps, isFullscreen: Ref<boolean>): {
+export declare function useDialogMove(dialogRef: Ref<ElDialogInstance>, props: DialogProps, isFullscreen: Ref<boolean>): {
     handleHeaderMousedown: (e: MouseEvent) => void;
     handleHeaderTouchstart: (e: TouchEvent) => void;
 };
@@ -29,7 +29,7 @@ export declare function useModalMove(dialogRef: Ref<ElDialogInstance>, props: Mo
  * @param props 属性
  * @param isFullscreen 全屏状态
  */
-export declare function useModalResize(dialogRef: Ref<ElDialogInstance>, props: ModalProps, isFullscreen: Ref<boolean>): {
+export declare function useDialogResize(dialogRef: Ref<ElDialogInstance>, props: DialogProps, isFullscreen: Ref<boolean>): {
     handleResizeMousedown: (e: MouseEvent) => void;
     handleResizeTouchstart: (e: TouchEvent) => void;
 };
@@ -39,14 +39,14 @@ export declare function useModalResize(dialogRef: Ref<ElDialogInstance>, props:
  * @param props 属性
  * @param isFullscreen 全屏状态
  */
-export declare function useModalEvent(dialogRef: Ref<ElDialogInstance>, props: ModalProps, isFullscreen: Ref<boolean>): {
+export declare function useDialogEvent(dialogRef: Ref<ElDialogInstance>, props: DialogProps, isFullscreen: Ref<boolean>): {
     handleHeaderMousedown: (e: MouseEvent) => void;
     handleHeaderTouchstart: (e: TouchEvent) => void;
     handleResizeMousedown: (e: MouseEvent) => void;
     handleResizeTouchstart: (e: TouchEvent) => void;
     bindAutoTopEvent: () => void;
     unbindAutoTopEvent: () => void;
-    topModal: (el?: HTMLElement) => void;
+    topDialog: (el?: HTMLElement) => void;
     setInitPosition: () => void;
-    resetModalStyle: () => void;
+    resetDialogStyle: () => void;
 };

package/es/ele-dialog/util.js

@@ -6,18 +6,18 @@ const wrapperClass = "ele-dialog";
 const closedClass = "ele-dialog-closed";
 const fixTop = 0.65;
 const fixLeft = 0.65;
-function getModalEl(dialogRef) {
+function getDialogEl(dialogRef) {
   var _a, _b;
   const el = (_b = unref((_a = unref(dialogRef)) == null ? void 0 : _a.dialogContentRef)) == null ? void 0 : _b.$el;
   return el;
 }
-function initModalStyle(modalEl) {
-  modalEl.style.top = modalEl.offsetTop + "px";
-  modalEl.style.left = modalEl.offsetLeft + "px";
-  modalEl.style.right = "auto";
-  modalEl.style.bottom = "auto";
-  modalEl.style.position = "absolute";
-  modalEl.style.margin = "0";
+function initDialogStyle(dialogEl) {
+  dialogEl.style.top = dialogEl.offsetTop + "px";
+  dialogEl.style.left = dialogEl.offsetLeft + "px";
+  dialogEl.style.right = "auto";
+  dialogEl.style.bottom = "auto";
+  dialogEl.style.position = "absolute";
+  dialogEl.style.margin = "0";
 }
 function canMoveOut(moveOut, direction) {
   if (direction && moveOut != null && Array.isArray(moveOut)) {
@@ -25,9 +25,9 @@ function canMoveOut(moveOut, direction) {
   }
   return false;
 }
-function getModalContainer(inner, multiple, appendTo, modalsEl) {
+function getDialogContainer(inner, multiple, appendTo, dialogsEl) {
   if (multiple) {
-    const parent = (inner ? modalsEl : void 0) || document.body;
+    const parent = (inner ? dialogsEl : void 0) || document.body;
     const wrapper = queryChild(parent, containerClass);
     if (wrapper) {
       return wrapper;
@@ -37,37 +37,37 @@ function getModalContainer(inner, multiple, appendTo, modalsEl) {
     parent.appendChild(elem);
     return elem;
   }
-  if (inner && modalsEl) {
-    return modalsEl;
+  if (inner && dialogsEl) {
+    return dialogsEl;
   }
   return appendTo || "body";
 }
-function useModalMove(dialogRef, props, isFullscreen) {
-  let modalEl = null;
+function useDialogMove(dialogRef, props, isFullscreen) {
+  let dialogEl = null;
   let wrapEl = null;
   let downOL = null;
   let downOT = null;
   const { handleMousedown, handleTouchstart } = useMoveEvent({
     start: () => {
-      modalEl = getModalEl(dialogRef);
-      wrapEl = modalEl == null ? void 0 : modalEl.parentElement;
-      if (!modalEl || !wrapEl || !props.draggable || isFullscreen.value) {
+      dialogEl = getDialogEl(dialogRef);
+      wrapEl = dialogEl == null ? void 0 : dialogEl.parentElement;
+      if (!dialogEl || !wrapEl || !props.draggable || isFullscreen.value) {
         return;
       }
-      modalEl.style.userSelect = "none";
-      initModalStyle(modalEl);
-      downOL = modalEl.offsetLeft;
-      downOT = modalEl.offsetTop;
+      dialogEl.style.userSelect = "none";
+      initDialogStyle(dialogEl);
+      downOL = dialogEl.offsetLeft;
+      downOT = dialogEl.offsetTop;
     },
     move: ({ distanceX, distanceY, e }) => {
-      if (!modalEl || !wrapEl || downOL == null || downOT == null || distanceX == null || distanceY == null) {
+      if (!dialogEl || !wrapEl || downOL == null || downOT == null || distanceX == null || distanceY == null) {
         return;
       }
       e.preventDefault();
       let positionLeft = distanceX + downOL;
       let positionTop = distanceY + downOT;
-      const limitL = wrapEl.clientWidth - modalEl.clientWidth - fixLeft;
-      const limitT = wrapEl.clientHeight - modalEl.clientHeight - fixTop;
+      const limitL = wrapEl.clientWidth - dialogEl.clientWidth - fixLeft;
+      const limitT = wrapEl.clientHeight - dialogEl.clientHeight - fixTop;
       if (!props.moveOut) {
         if (positionLeft < 0) {
           positionLeft = 0;
@@ -102,16 +102,16 @@ function useModalMove(dialogRef, props, isFullscreen) {
           positionTop = minLimitT;
         }
       }
-      modalEl.style.left = `${Math.floor(positionLeft)}px`;
-      modalEl.style.top = `${Math.floor(positionTop)}px`;
+      dialogEl.style.left = `${Math.floor(positionLeft)}px`;
+      dialogEl.style.top = `${Math.floor(positionTop)}px`;
     },
     end: () => {
-      if (modalEl) {
-        modalEl.style.userSelect = "";
+      if (dialogEl) {
+        dialogEl.style.userSelect = "";
       }
       downOL = null;
       downOT = null;
-      modalEl = null;
+      dialogEl = null;
       wrapEl = null;
     },
     touchmoveOptions: { passive: false }
@@ -121,52 +121,52 @@ function useModalMove(dialogRef, props, isFullscreen) {
     handleHeaderTouchstart: handleTouchstart
   };
 }
-function useModalResize(dialogRef, props, isFullscreen) {
-  let modalEl = null;
+function useDialogResize(dialogRef, props, isFullscreen) {
+  let dialogEl = null;
   let wrapEl = null;
   let downW = null;
   let downH = null;
   const { handleMousedown, handleTouchstart } = useMoveEvent({
     start: () => {
-      modalEl = getModalEl(dialogRef);
-      wrapEl = modalEl == null ? void 0 : modalEl.parentElement;
-      if (!modalEl || !wrapEl || !props.resizable || isFullscreen.value) {
+      dialogEl = getDialogEl(dialogRef);
+      wrapEl = dialogEl == null ? void 0 : dialogEl.parentElement;
+      if (!dialogEl || !wrapEl || !props.resizable || isFullscreen.value) {
         return;
       }
-      modalEl.style.userSelect = "none";
-      initModalStyle(modalEl);
-      downW = modalEl.clientWidth;
-      downH = modalEl.clientHeight;
+      dialogEl.style.userSelect = "none";
+      initDialogStyle(dialogEl);
+      downW = dialogEl.clientWidth;
+      downH = dialogEl.clientHeight;
     },
     move: ({ distanceX, distanceY, e }) => {
-      if (!modalEl || !wrapEl || downW == null || downH == null || distanceX == null || distanceY == null) {
+      if (!dialogEl || !wrapEl || downW == null || downH == null || distanceX == null || distanceY == null) {
         return;
       }
       e.preventDefault();
       if (props.resizable !== "vertical") {
         const w = distanceX + downW;
-        const maxW = wrapEl.clientWidth - modalEl.offsetLeft - fixLeft;
+        const maxW = wrapEl.clientWidth - dialogEl.offsetLeft - fixLeft;
         const nw = (w < props.minWidth ? props.minWidth : !canMoveOut(props.moveOut, "right") && w > maxW ? maxW : w) + "px";
-        modalEl.style.width = nw;
-        modalEl.style.maxWidth = nw;
-        modalEl.style.minWidth = nw;
+        dialogEl.style.width = nw;
+        dialogEl.style.maxWidth = nw;
+        dialogEl.style.minWidth = nw;
       }
       if (props.resizable !== "horizontal") {
         const h = distanceY + downH;
-        const maxH = wrapEl.clientHeight - modalEl.offsetTop - fixTop;
+        const maxH = wrapEl.clientHeight - dialogEl.offsetTop - fixTop;
         const nh = (h < props.minHeight ? props.minHeight : !canMoveOut(props.moveOut, "bottom") && h > maxH ? maxH : h) + "px";
-        modalEl.style.height = nh;
-        modalEl.style.maxHeight = nh;
-        modalEl.style.minHeight = nh;
+        dialogEl.style.height = nh;
+        dialogEl.style.maxHeight = nh;
+        dialogEl.style.minHeight = nh;
       }
     },
     end: () => {
-      if (modalEl) {
-        modalEl.style.userSelect = "";
+      if (dialogEl) {
+        dialogEl.style.userSelect = "";
       }
       downW = null;
       downH = null;
-      modalEl = null;
+      dialogEl = null;
       wrapEl = null;
     },
     touchmoveOptions: { passive: false }
@@ -176,38 +176,30 @@ function useModalResize(dialogRef, props, isFullscreen) {
     handleResizeTouchstart: handleTouchstart
   };
 }
-function useModalEvent(dialogRef, props, isFullscreen) {
-  const { handleHeaderMousedown, handleHeaderTouchstart } = useModalMove(
-    dialogRef,
-    props,
-    isFullscreen
-  );
-  const { handleResizeMousedown, handleResizeTouchstart } = useModalResize(
-    dialogRef,
-    props,
-    isFullscreen
-  );
+function useDialogEvent(dialogRef, props, isFullscreen) {
+  const { handleHeaderMousedown, handleHeaderTouchstart } = useDialogMove(dialogRef, props, isFullscreen);
+  const { handleResizeMousedown, handleResizeTouchstart } = useDialogResize(dialogRef, props, isFullscreen);
   let isInitPosition = true;
   const getZIndex = () => {
     return props.zIndex ?? 2e3;
   };
-  const topModal = (el) => {
+  const topDialog = (el) => {
     var _a;
-    const modalEl = el ?? getModalEl(dialogRef);
-    const overlayEl = (_a = modalEl == null ? void 0 : modalEl.parentElement) == null ? void 0 : _a.parentElement;
+    const dialogEl = el ?? getDialogEl(dialogRef);
+    const overlayEl = (_a = dialogEl == null ? void 0 : dialogEl.parentElement) == null ? void 0 : _a.parentElement;
     if (!overlayEl) {
       return;
     }
     const currentIndex = getCurrentStyle(overlayEl).zIndex;
     const containerEl = overlayEl.parentElement;
     const cls = `.${wrapperClass}:not(.${closedClass})`;
-    const modals = containerEl ? containerEl.querySelectorAll(cls) : void 0;
+    const dialogs = containerEl ? containerEl.querySelectorAll(cls) : void 0;
     let maxIndex = 0;
-    (modals ? Array.from(modals) : []).forEach((modalEl2) => {
-      const zIndex = getCurrentStyle(modalEl2).zIndex;
+    (dialogs ? Array.from(dialogs) : []).forEach((dialogEl2) => {
+      const zIndex = getCurrentStyle(dialogEl2).zIndex;
       if (zIndex != null) {
         const index = Number(zIndex);
-        if (index >= maxIndex && (!overlayEl || modalEl2 !== overlayEl)) {
+        if (index >= maxIndex && (!overlayEl || dialogEl2 !== overlayEl)) {
           maxIndex = index + 1;
         }
       }
@@ -218,21 +210,21 @@ function useModalEvent(dialogRef, props, isFullscreen) {
   };
   const mousedownListener = (event) => {
     if (props.multiple) {
-      topModal(event.currentTarget);
+      topDialog(event.currentTarget);
     }
   };
   const bindAutoTopEvent = () => {
-    const modalEl = getModalEl(dialogRef);
-    if (modalEl) {
-      modalEl.addEventListener("mousedown", mousedownListener);
-      modalEl.addEventListener("touchstart", mousedownListener);
+    const dialogEl = getDialogEl(dialogRef);
+    if (dialogEl) {
+      dialogEl.addEventListener("mousedown", mousedownListener);
+      dialogEl.addEventListener("touchstart", mousedownListener);
     }
   };
   const unbindAutoTopEvent = () => {
-    const modalEl = getModalEl(dialogRef);
-    if (modalEl) {
-      modalEl.removeEventListener("mousedown", mousedownListener);
-      modalEl.removeEventListener("touchstart", mousedownListener);
+    const dialogEl = getDialogEl(dialogRef);
+    if (dialogEl) {
+      dialogEl.removeEventListener("mousedown", mousedownListener);
+      dialogEl.removeEventListener("touchstart", mousedownListener);
     }
   };
   const getPositionMargin = (position) => {
@@ -253,29 +245,29 @@ function useModalEvent(dialogRef, props, isFullscreen) {
   const setInitPosition = () => {
     if (isInitPosition) {
       isInitPosition = false;
-      const modalEl = getModalEl(dialogRef);
+      const dialogEl = getDialogEl(dialogRef);
       const margin = getPositionMargin(getPosition());
-      if (modalEl && margin != null) {
-        modalEl.style.margin = margin;
+      if (dialogEl && margin != null) {
+        dialogEl.style.margin = margin;
       }
     }
   };
-  const resetModalStyle = () => {
-    const modalEl = getModalEl(dialogRef);
-    if (modalEl) {
+  const resetDialogStyle = () => {
+    const dialogEl = getDialogEl(dialogRef);
+    if (dialogEl) {
       const w = props.width;
-      modalEl.style.margin = getPositionMargin(getPosition()) || "";
-      modalEl.style.position = "";
-      modalEl.style.top = "";
-      modalEl.style.left = "";
-      modalEl.style.right = "";
-      modalEl.style.bottom = "";
-      modalEl.style.height = "";
-      modalEl.style.maxHeight = "";
-      modalEl.style.minHeight = "";
-      modalEl.style.width = typeof w === "number" ? `${w}px` : w ?? "";
-      modalEl.style.maxWidth = "";
-      modalEl.style.minWidth = "";
+      dialogEl.style.margin = getPositionMargin(getPosition()) || "";
+      dialogEl.style.position = "";
+      dialogEl.style.top = "";
+      dialogEl.style.left = "";
+      dialogEl.style.right = "";
+      dialogEl.style.bottom = "";
+      dialogEl.style.height = "";
+      dialogEl.style.maxHeight = "";
+      dialogEl.style.minHeight = "";
+      dialogEl.style.width = typeof w === "number" ? `${w}px` : w ?? "";
+      dialogEl.style.maxWidth = "";
+      dialogEl.style.minWidth = "";
     }
   };
   return {
@@ -285,17 +277,17 @@ function useModalEvent(dialogRef, props, isFullscreen) {
     handleResizeTouchstart,
     bindAutoTopEvent,
     unbindAutoTopEvent,
-    topModal,
+    topDialog,
     setInitPosition,
-    resetModalStyle
+    resetDialogStyle
   };
 }
 export {
   closedClass,
   containerClass,
-  getModalContainer,
-  useModalEvent,
-  useModalMove,
-  useModalResize,
+  getDialogContainer,
+  useDialogEvent,
+  useDialogMove,
+  useDialogResize,
   wrapperClass
 };

package/es/style/plus.scss

@@ -22,7 +22,9 @@
 @use '../ele-loading/style/index.scss' as loading;
 @use '../ele-map-picker/style/index.scss' as mapPicker;
 @use '../ele-menus/style/index.scss' as menus;
+// temp
 @use '../ele-dialog/style/index.scss' as modal;
+@use '../ele-dialog/style/index.scss' as dialog;
 @use '../ele-page/style/index.scss' as page;
 @use '../ele-pagination/style/index.scss' as pagination;
 @use '../ele-popconfirm/style/index.scss' as popconfirm;

package/es/style/themes/default.scss

@@ -460,6 +460,7 @@ $ele: map.deep-merge(
       'bg-7': #7dd733,
       'bg-8': #faad14
     ),
+    // temp
     'modal': (
       // 弹窗
       'bg': elVar('bg-color', 'overlay'),
@@ -484,6 +485,31 @@ $ele: map.deep-merge(
       'fullscreen-border': 1px solid elVar('border-color', 'light'),
       'mobile-space': 16px
     ),
+
+    'dialog': (
+      // 弹窗
+      'bg': elVar('bg-color', 'overlay'),
+      'radius': elVar('border-radius', 'base'),
+      'header-color': elVar('text-color', 'primary'),
+      'header-font-size': elVar('font-size', 'medium'),
+      'header-font-weight': normal,
+      'header-line-height': 24px,
+      'header-padding': 14px 20px,
+      'header-border': 1px solid elVar('border-color', 'light'),
+      'icon-size': 22px,
+      'icon-font-size': 16px,
+      'icon-color': elVar('text-color', 'secondary'),
+      'icon-hover-color': elVar('text-color', 'primary'),
+      'icon-hover-bg': transparent,
+      'icon-radius': elVar('border-radius', 'small'),
+      'icon-space': 8px,
+      'body-padding': 24px 22px,
+      'form-body-padding': 24px 22px 12px 20px,
+      'footer-padding': 10px 20px,
+      'footer-border': 1px solid elVar('border-color', 'light'),
+      'fullscreen-border': 1px solid elVar('border-color', 'light'),
+      'mobile-space': 16px
+    ),
     'page': (
       // 页面容器
       'padding': 16px,