yuang-framework-ui-pc 1.1.13 → 1.1.15

package/lib/ele-dialog/style/index.scss

@@ -2,9 +2,9 @@
 @use '../../style/util.scss' as *;
 @use './css-var.scss' as *;
 
-@include set-modal-var($ele);
+@include set-dialog-var($ele);
 
-.ele-modal {
+.ele-dialog {
   &.el-overlay {
     height: auto;
   }
@@ -20,9 +20,9 @@
       padding: 0;
       flex-shrink: 0;
       position: relative;
-      background: eleVar('modal', 'bg');
-      border-radius: eleVar('modal', 'radius');
-      margin-bottom: eleVar('modal', 'mobile-space');
+      background: eleVar('dialog', 'bg');
+      border-radius: eleVar('dialog', 'radius');
+      margin-bottom: eleVar('dialog', 'mobile-space');
 
       // 让 model 外层不出现滚动条
       position: absolute!important;
@@ -55,118 +55,118 @@
 }
 
 /* header */
-.ele-modal-header {
+.ele-dialog-header {
   display: flex;
   align-items: center;
   box-sizing: border-box;
-  padding: eleVar('modal', 'header-padding');
-  border-bottom: eleVar('modal', 'header-border');
+  padding: eleVar('dialog', 'header-padding');
+  border-bottom: eleVar('dialog', 'header-border');
 }
 
-.ele-modal-title {
+.ele-dialog-title {
   flex: 1;
-  color: eleVar('modal', 'header-color');
-  font-size: eleVar('modal', 'header-font-size');
-  line-height: eleVar('modal', 'header-line-height');
-  font-weight: eleVar('modal', 'header-font-weight');
+  color: eleVar('dialog', 'header-color');
+  font-size: eleVar('dialog', 'header-font-size');
+  line-height: eleVar('dialog', 'header-line-height');
+  font-weight: eleVar('dialog', 'header-font-weight');
   box-sizing: border-box;
 }
 
 /* 图标按钮 */
-.ele-modal-tool {
+.ele-dialog-tool {
   flex-shrink: 0;
   display: flex;
   align-items: center;
   justify-content: center;
-  width: eleVar('modal', 'icon-size');
-  height: eleVar('modal', 'icon-size');
-  line-height: eleVar('modal', 'icon-size');
-  color: eleVar('modal', 'icon-color');
-  font-size: eleVar('modal', 'icon-font-size');
-  border-radius: eleVar('modal', 'icon-radius');
+  width: eleVar('dialog', 'icon-size');
+  height: eleVar('dialog', 'icon-size');
+  line-height: eleVar('dialog', 'icon-size');
+  color: eleVar('dialog', 'icon-color');
+  font-size: eleVar('dialog', 'icon-font-size');
+  border-radius: eleVar('dialog', 'icon-radius');
   transition: (color $transition-base, background-color $transition-base);
   box-sizing: border-box;
   cursor: pointer;
 
   &:hover {
-    color: eleVar('modal', 'icon-hover-color');
-    background: eleVar('modal', 'icon-hover-bg');
+    color: eleVar('dialog', 'icon-hover-color');
+    background: eleVar('dialog', 'icon-hover-bg');
   }
 
-  & + .ele-modal-tool {
-    margin-left: eleVar('modal', 'icon-space');
+  & + .ele-dialog-tool {
+    margin-left: eleVar('dialog', 'icon-space');
   }
 }
 
 /* body */
-.ele-modal-body {
-  padding: eleVar('modal', 'body-padding');
+.ele-dialog-body {
+  padding: eleVar('dialog', 'body-padding');
   box-sizing: border-box;
 
   &.is-form {
-    padding: eleVar('modal', 'form-body-padding');
+    padding: eleVar('dialog', 'form-body-padding');
   }
 }
 
 /* footer */
-.ele-modal-footer {
-  padding: eleVar('modal', 'footer-padding');
-  border-top: eleVar('modal', 'footer-border');
+.ele-dialog-footer {
+  padding: eleVar('dialog', 'footer-padding');
+  border-top: eleVar('dialog', 'footer-border');
   box-sizing: border-box;
 }
 
 /* 默认位置 */
-.ele-modal-top > .el-overlay-dialog > .el-dialog {
+.ele-dialog-top > .el-overlay-dialog > .el-dialog {
   margin: 0;
 }
 
-.ele-modal-center > .el-overlay-dialog > .el-dialog {
+.ele-dialog-center > .el-overlay-dialog > .el-dialog {
   margin: auto;
 }
 
-.ele-modal-bottom > .el-overlay-dialog > .el-dialog {
+.ele-dialog-bottom > .el-overlay-dialog > .el-dialog {
   margin: auto auto 0 auto;
 }
 
-.ele-modal-left > .el-overlay-dialog > .el-dialog {
+.ele-dialog-left > .el-overlay-dialog > .el-dialog {
   margin: auto auto auto 0;
 }
 
-.ele-modal-right > .el-overlay-dialog > .el-dialog {
+.ele-dialog-right > .el-overlay-dialog > .el-dialog {
   margin: auto 0 auto auto;
 }
 
-.ele-modal-left-top > .el-overlay-dialog > .el-dialog {
+.ele-dialog-left-top > .el-overlay-dialog > .el-dialog {
   margin: 0 auto 0 0;
 }
 
-.ele-modal-left-bottom > .el-overlay-dialog > .el-dialog {
+.ele-dialog-left-bottom > .el-overlay-dialog > .el-dialog {
   margin: auto auto 0 0;
 }
 
-.ele-modal-right-top > .el-overlay-dialog > .el-dialog {
+.ele-dialog-right-top > .el-overlay-dialog > .el-dialog {
   margin: 0 0 0 auto;
 }
 
-.ele-modal-right-bottom > .el-overlay-dialog > .el-dialog {
+.ele-dialog-right-bottom > .el-overlay-dialog > .el-dialog {
   margin: auto 0 0 auto;
 }
 
 /* 支持拖拽 */
-.ele-modal-movable > .el-overlay-dialog > .el-dialog > .el-dialog__header {
+.ele-dialog-movable > .el-overlay-dialog > .el-dialog > .el-dialog__header {
   cursor: move;
   user-select: none;
 }
 
 /* 支持拉伸 */
-.ele-modal-resize-icon {
+.ele-dialog-resize-icon {
   position: absolute;
   right: 2px;
   bottom: 2px;
   display: flex;
   align-items: center;
   justify-content: center;
-  color: eleVar('modal', 'icon-color');
+  color: eleVar('dialog', 'icon-color');
   font-size: 12px;
   cursor: se-resize;
 
@@ -179,8 +179,8 @@
   }
 }
 
-.ele-modal-resizable > .el-overlay-dialog > .el-dialog,
-.ele-modal-fullscreen > .el-overlay-dialog > .el-dialog {
+.ele-dialog-resizable > .el-overlay-dialog > .el-dialog,
+.ele-dialog-fullscreen > .el-overlay-dialog > .el-dialog {
   display: flex;
   flex-direction: column;
 
@@ -191,7 +191,7 @@
 }
 
 /* 全屏 */
-.ele-modal-fullscreen > .el-overlay-dialog > .el-dialog {
+.ele-dialog-fullscreen > .el-overlay-dialog > .el-dialog {
   top: 0 !important;
   left: 0 !important;
   margin: 0 !important;
@@ -207,14 +207,14 @@
   & > .el-dialog__header {
     cursor: default;
 
-    & > .ele-modal-resize-icon {
+    & > .ele-dialog-resize-icon {
       display: none;
     }
   }
 }
 
 /* 同时打开多个 */
-.ele-modal-container {
+.ele-dialog-container {
   position: absolute;
   top: 0;
   left: 0;
@@ -228,7 +228,7 @@
   overflow: hidden;
 }
 
-.ele-modal-multiple {
+.ele-dialog-multiple {
   pointer-events: none !important;
   position: absolute !important;
 
@@ -243,17 +243,17 @@
 }
 
 /* 失活状态 */
-.ele-modal-hide {
+.ele-dialog-hide {
   display: none !important;
 }
 
 /* 最大宽度适应屏幕 */
-.ele-modal-responsive > .el-overlay-dialog > .el-dialog {
-  max-width: calc(100% - #{eleVar('modal', 'mobile-space')} * 2);
+.ele-dialog-responsive > .el-overlay-dialog > .el-dialog {
+  max-width: calc(100% - #{eleVar('dialog', 'mobile-space')} * 2);
 }
 
 /* 限制在主体区域 */
-.ele-admin-modals > .ele-modal {
+.ele-admin-dialogs > .ele-dialog {
   pointer-events: auto;
   position: absolute !important;
 }

package/lib/ele-dialog/util.cjs

@@ -3,9 +3,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const vue = require("vue");
 const core = require("../utils/core");
 const hook = require("../utils/hook");
-const containerClass = "ele-modal-container";
-const wrapperClass = "ele-modal";
-const closedClass = "ele-modal-closed";
+const containerClass = "ele-dialog-container";
+const wrapperClass = "ele-dialog";
+const closedClass = "ele-dialog-closed";
 const fixTop = 0.65;
 const fixLeft = 0.65;
 function getModalEl(dialogRef) {

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

@@ -2,9 +2,9 @@ import { Ref } from 'vue';
 import { ElDialogInstance } from '../ele-app/el';
 import { ModalProps } from './props';
 
-export declare const containerClass = "ele-modal-container";
-export declare const wrapperClass = "ele-modal";
-export declare const closedClass = "ele-modal-closed";
+export declare const containerClass = "ele-dialog-container";
+export declare const wrapperClass = "ele-dialog";
+export declare const closedClass = "ele-dialog-closed";
 /**
  * 获取弹窗容器
  * @param inner 是否限制在主体内部

package/lib/ele-drawer/index.cjs

@@ -4,7 +4,7 @@ const elementPlus = require("element-plus");
 const icons = require("../icons");
 const ReceiverView = require("../ele-config-provider/components/receiver-view");
 const util = require("../ele-pro-layout/util");
-const util$1 = require("../ele-modal/util");
+const util$1 = require("../ele-dialog/util");
 const props = require("./props");
 const _sfc_main = vue.defineComponent({
   name: "EleDrawer",
@@ -32,7 +32,7 @@ const _sfc_main = vue.defineComponent({
       return classes.join(" ");
     });
     const teleportTo = vue.computed(() => {
-      return util$1.getModalContainer(
+      return util$1.getDialogContainer(
         props2.inner,
         false,
         props2.appendTo,

package/lib/ele-map-picker/index.cjs

@@ -3,7 +3,7 @@ const vue = require("vue");
 const core = require("../utils/core");
 const receiver = require("../ele-config-provider/receiver");
 const util = require("../ele-pro-layout/util");
-const EleModal = require("../ele-modal/index");
+const EleModal = require("../ele-dialog/index");
 const MapView = require("./components/map-view");
 const props = require("./props");
 const _sfc_main = vue.defineComponent({

package/lib/ele-map-picker/style/index.cjs

@@ -5,5 +5,5 @@ require("element-plus/es/components/button/style/index");
 require("element-plus/es/components/icon/style/index");
 require("element-plus/es/components/empty/style/index");
 require("../../ele-loading/style/index");
-require("../../ele-modal/style/index");
+require("../../ele-dialog/style/index");
 require("./index.scss");

package/lib/ele-map-picker/style/index.scss

@@ -4,7 +4,7 @@
 
 @include set-map-var($ele);
 
-.ele-modal .ele-map-picker .ele-modal-body {
+.ele-dialog .ele-map-picker .ele-dialog-body {
   padding: 0;
 }
 
@@ -258,8 +258,8 @@
     & > .el-dialog__header {
       flex-shrink: 0;
 
-      .ele-modal-tool-max,
-      .ele-modal-resize-icon {
+      .ele-dialog-tool-max,
+      .ele-dialog-resize-icon {
         display: none;
       }
     }
@@ -268,7 +268,7 @@
       flex: 1;
       overflow: hidden;
 
-      & > .ele-modal-body {
+      & > .ele-dialog-body {
         height: 100%;
         overflow: hidden;
       }

package/lib/ele-modal/index.cjs

@@ -29,47 +29,47 @@ const _sfc_main = vue.defineComponent({
     const dialogClass = vue.computed(() => {
       const classes = [util$1.wrapperClass];
       if (props2.responsive ?? isResponsive.value ?? true) {
-        classes.push("ele-modal-responsive");
+        classes.push("ele-dialog-responsive");
       }
       if (props2.alignCenter || props2.position === "center") {
-        classes.push("ele-modal-center");
+        classes.push("ele-dialog-center");
       } else if (props2.position === "top") {
-        classes.push("ele-modal-top");
+        classes.push("ele-dialog-top");
       } else if (props2.position === "bottom") {
-        classes.push("ele-modal-bottom");
+        classes.push("ele-dialog-bottom");
       } else if (props2.position === "left") {
-        classes.push("ele-modal-left");
+        classes.push("ele-dialog-left");
       } else if (props2.position === "right") {
-        classes.push("ele-modal-right");
+        classes.push("ele-dialog-right");
       } else if (props2.position === "leftTop") {
-        classes.push("ele-modal-left-top");
+        classes.push("ele-dialog-left-top");
       } else if (props2.position === "leftBottom") {
-        classes.push("ele-modal-left-bottom");
+        classes.push("ele-dialog-left-bottom");
       } else if (props2.position === "rightTop") {
-        classes.push("ele-modal-right-top");
+        classes.push("ele-dialog-right-top");
       } else if (props2.position === "rightBottom") {
-        classes.push("ele-modal-right-bottom");
+        classes.push("ele-dialog-right-bottom");
       }
       if (props2.draggable) {
-        classes.push("ele-modal-movable");
+        classes.push("ele-dialog-movable");
       }
       if (props2.resizable) {
-        classes.push("ele-modal-resizable");
+        classes.push("ele-dialog-resizable");
       }
       if (props2.multiple) {
-        classes.push("ele-modal-multiple");
+        classes.push("ele-dialog-multiple");
       }
       if (isFullscreen.value) {
-        classes.push("ele-modal-fullscreen");
+        classes.push("ele-dialog-fullscreen");
       }
       if (!props2.modelValue) {
         classes.push(util$1.closedClass);
       }
       if (!isActivated.value && props2.modelValue) {
-        classes.push("ele-modal-hide");
+        classes.push("ele-dialog-hide");
       }
       if (props2.inner) {
-        classes.push("ele-modal-inner");
+        classes.push("ele-dialog-inner");
       }
       if (props2.modalClass) {
         classes.push(props2.modalClass);
@@ -77,7 +77,7 @@ const _sfc_main = vue.defineComponent({
       return classes.join(" ");
     });
     const teleportTo = vue.computed(() => {
-      return util$1.getModalContainer(
+      return util$1.getDialogContainer(
         props2.inner,
         props2.multiple,
         props2.appendTo,
@@ -232,12 +232,12 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       header: vue.withCtx(({ close, titleId, titleClass }) => [
         vue.createElementVNode("div", {
           style: vue.normalizeStyle(_ctx.headerStyle),
-          class: "ele-modal-header",
+          class: "ele-dialog-header",
           onMousedown: _cache[6] || (_cache[6] = (...args) => _ctx.handleHeaderMousedown && _ctx.handleHeaderMousedown(...args)),
           onTouchstart: _cache[7] || (_cache[7] = (...args) => _ctx.handleHeaderTouchstart && _ctx.handleHeaderTouchstart(...args))
         }, [
           vue.createElementVNode("div", {
-            class: "ele-modal-title",
+            class: "ele-dialog-title",
             style: vue.normalizeStyle(_ctx.titleStyle)
           }, [
             vue.renderSlot(_ctx.$slots, "header", {
@@ -250,7 +250,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           ], 4),
           _ctx.maxable ? (vue.openBlock(), vue.createElementBlock("div", {
             key: 0,
-            class: "ele-modal-tool ele-modal-tool-max",
+            class: "ele-dialog-tool ele-dialog-tool-max",
             style: vue.normalizeStyle(_ctx.fullscreenBtnStyle),
             onClick: _cache[0] || (_cache[0] = ($event) => _ctx.toggleFullscreen()),
             onMousedown: _cache[1] || (_cache[1] = vue.withModifiers(() => {
@@ -269,7 +269,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           ], 36)) : vue.createCommentVNode("", true),
           _ctx.showClose ? (vue.openBlock(), vue.createElementBlock("div", {
             key: 1,
-            class: "ele-modal-tool",
+            class: "ele-dialog-tool",
             style: vue.normalizeStyle(_ctx.closeBtnStyle),
             onClick: _cache[3] || (_cache[3] = ($event) => _ctx.updateModelValue(false)),
             onMousedown: _cache[4] || (_cache[4] = vue.withModifiers(() => {
@@ -290,7 +290,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         _ctx.resizable ? (vue.openBlock(), vue.createElementBlock("div", {
           key: 0,
           class: vue.normalizeClass([
-            "ele-modal-resize-icon",
+            "ele-dialog-resize-icon",
             { "is-horizontal": _ctx.resizable === "horizontal" },
             { "is-vertical": _ctx.resizable === "vertical" }
           ]),
@@ -311,7 +311,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       default: vue.withCtx(() => [
         vue.createVNode(_component_ReceiverView, {
           wrapPosition: false,
-          class: vue.normalizeClass(["ele-modal-body", { "is-form": _ctx.form }]),
+          class: vue.normalizeClass(["ele-dialog-body", { "is-form": _ctx.form }]),
           style: vue.normalizeStyle(_ctx.bodyStyle)
         }, {
           default: vue.withCtx(() => [
@@ -326,7 +326,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         name: "footer",
         fn: vue.withCtx(() => [
           vue.createElementVNode("div", {
-            class: "ele-modal-footer",
+            class: "ele-dialog-footer",
             style: vue.normalizeStyle(_ctx.footerStyle)
           }, [
             vue.renderSlot(_ctx.$slots, "footer")

package/lib/ele-modal/style/css-var.scss

@@ -1,8 +1,8 @@
 @use '../../style/util.scss' as *;
 
 /* 弹窗主题变量 */
-@mixin set-modal-var($var) {
-  .ele-modal {
+@mixin set-dialog-var($var) {
+  .ele-dialog {
     @include set-ele-var('modal', $var);
   }
 }

package/lib/ele-modal/style/index.scss

@@ -2,9 +2,9 @@
 @use '../../style/util.scss' as *;
 @use './css-var.scss' as *;
 
-@include set-modal-var($ele);
+@include set-dialog-var($ele);
 
-.ele-modal {
+.ele-dialog {
   &.el-overlay {
     height: auto;
   }
@@ -55,7 +55,7 @@
 }
 
 /* header */
-.ele-modal-header {
+.ele-dialog-header {
   display: flex;
   align-items: center;
   box-sizing: border-box;
@@ -63,7 +63,7 @@
   border-bottom: eleVar('modal', 'header-border');
 }
 
-.ele-modal-title {
+.ele-dialog-title {
   flex: 1;
   color: eleVar('modal', 'header-color');
   font-size: eleVar('modal', 'header-font-size');
@@ -73,7 +73,7 @@
 }
 
 /* 图标按钮 */
-.ele-modal-tool {
+.ele-dialog-tool {
   flex-shrink: 0;
   display: flex;
   align-items: center;
@@ -93,13 +93,13 @@
     background: eleVar('modal', 'icon-hover-bg');
   }
 
-  & + .ele-modal-tool {
+  & + .ele-dialog-tool {
     margin-left: eleVar('modal', 'icon-space');
   }
 }
 
 /* body */
-.ele-modal-body {
+.ele-dialog-body {
   padding: eleVar('modal', 'body-padding');
   box-sizing: border-box;
 
@@ -109,57 +109,57 @@
 }
 
 /* footer */
-.ele-modal-footer {
+.ele-dialog-footer {
   padding: eleVar('modal', 'footer-padding');
   border-top: eleVar('modal', 'footer-border');
   box-sizing: border-box;
 }
 
 /* 默认位置 */
-.ele-modal-top > .el-overlay-dialog > .el-dialog {
+.ele-dialog-top > .el-overlay-dialog > .el-dialog {
   margin: 0;
 }
 
-.ele-modal-center > .el-overlay-dialog > .el-dialog {
+.ele-dialog-center > .el-overlay-dialog > .el-dialog {
   margin: auto;
 }
 
-.ele-modal-bottom > .el-overlay-dialog > .el-dialog {
+.ele-dialog-bottom > .el-overlay-dialog > .el-dialog {
   margin: auto auto 0 auto;
 }
 
-.ele-modal-left > .el-overlay-dialog > .el-dialog {
+.ele-dialog-left > .el-overlay-dialog > .el-dialog {
   margin: auto auto auto 0;
 }
 
-.ele-modal-right > .el-overlay-dialog > .el-dialog {
+.ele-dialog-right > .el-overlay-dialog > .el-dialog {
   margin: auto 0 auto auto;
 }
 
-.ele-modal-left-top > .el-overlay-dialog > .el-dialog {
+.ele-dialog-left-top > .el-overlay-dialog > .el-dialog {
   margin: 0 auto 0 0;
 }
 
-.ele-modal-left-bottom > .el-overlay-dialog > .el-dialog {
+.ele-dialog-left-bottom > .el-overlay-dialog > .el-dialog {
   margin: auto auto 0 0;
 }
 
-.ele-modal-right-top > .el-overlay-dialog > .el-dialog {
+.ele-dialog-right-top > .el-overlay-dialog > .el-dialog {
   margin: 0 0 0 auto;
 }
 
-.ele-modal-right-bottom > .el-overlay-dialog > .el-dialog {
+.ele-dialog-right-bottom > .el-overlay-dialog > .el-dialog {
   margin: auto 0 0 auto;
 }
 
 /* 支持拖拽 */
-.ele-modal-movable > .el-overlay-dialog > .el-dialog > .el-dialog__header {
+.ele-dialog-movable > .el-overlay-dialog > .el-dialog > .el-dialog__header {
   cursor: move;
   user-select: none;
 }
 
 /* 支持拉伸 */
-.ele-modal-resize-icon {
+.ele-dialog-resize-icon {
   position: absolute;
   right: 2px;
   bottom: 2px;
@@ -179,8 +179,8 @@
   }
 }
 
-.ele-modal-resizable > .el-overlay-dialog > .el-dialog,
-.ele-modal-fullscreen > .el-overlay-dialog > .el-dialog {
+.ele-dialog-resizable > .el-overlay-dialog > .el-dialog,
+.ele-dialog-fullscreen > .el-overlay-dialog > .el-dialog {
   display: flex;
   flex-direction: column;
 
@@ -191,7 +191,7 @@
 }
 
 /* 全屏 */
-.ele-modal-fullscreen > .el-overlay-dialog > .el-dialog {
+.ele-dialog-fullscreen > .el-overlay-dialog > .el-dialog {
   top: 0 !important;
   left: 0 !important;
   margin: 0 !important;
@@ -207,14 +207,14 @@
   & > .el-dialog__header {
     cursor: default;
 
-    & > .ele-modal-resize-icon {
+    & > .ele-dialog-resize-icon {
       display: none;
     }
   }
 }
 
 /* 同时打开多个 */
-.ele-modal-container {
+.ele-dialog-container {
   position: absolute;
   top: 0;
   left: 0;
@@ -228,7 +228,7 @@
   overflow: hidden;
 }
 
-.ele-modal-multiple {
+.ele-dialog-multiple {
   pointer-events: none !important;
   position: absolute !important;
 
@@ -243,17 +243,17 @@
 }
 
 /* 失活状态 */
-.ele-modal-hide {
+.ele-dialog-hide {
   display: none !important;
 }
 
 /* 最大宽度适应屏幕 */
-.ele-modal-responsive > .el-overlay-dialog > .el-dialog {
+.ele-dialog-responsive > .el-overlay-dialog > .el-dialog {
   max-width: calc(100% - #{eleVar('modal', 'mobile-space')} * 2);
 }
 
 /* 限制在主体区域 */
-.ele-admin-modals > .ele-modal {
+.ele-admin-modals > .ele-dialog {
   pointer-events: auto;
   position: absolute !important;
 }