bkui-vue 1.0.3-beta.53 → 1.0.3-beta.54

package/lib/dialog/dialog.css

@@ -12,25 +12,21 @@
   word-break: break-all;
 }
 .bk-modal-ctx {
+  position: fixed;
   top: 0px;
   left: 0px;
+  display: none;
   width: 100%;
   height: 100%;
   pointer-events: auto;
 }
-.bk-modal-ctx.--show {
-  position: fixed;
-}
-.bk-modal-ctx.--show .bk-modal-ctx-mask {
+.bk-modal-ctx.is-show {
   display: block;
 }
-.bk-modal-ctx.--hide {
-  display: none;
-}
 .bk-modal-ctx-mask {
+  position: fixed;
   top: 0;
   left: 0;
-  display: none;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.6);
@@ -57,6 +53,7 @@
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
 }
 .bk-modal-content {
+  max-height: 100vh;
   overflow: auto;
   scrollbar-gutter: stable;
 }

package/lib/dialog/dialog.variable.css

@@ -141,25 +141,21 @@
   word-break: break-all;
 }
 .bk-modal-ctx {
+  position: fixed;
   top: 0px;
   left: 0px;
+  display: none;
   width: 100%;
   height: 100%;
   pointer-events: auto;
 }
-.bk-modal-ctx.--show {
-  position: fixed;
-}
-.bk-modal-ctx.--show .bk-modal-ctx-mask {
+.bk-modal-ctx.is-show {
   display: block;
 }
-.bk-modal-ctx.--hide {
-  display: none;
-}
 .bk-modal-ctx-mask {
+  position: fixed;
   top: 0;
   left: 0;
-  display: none;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.6);
@@ -186,6 +182,7 @@
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
 }
 .bk-modal-content {
+  max-height: 100vh;
   overflow: auto;
   scrollbar-gutter: stable;
 }

package/lib/modal/index.js

@@ -557,20 +557,22 @@ var useContentResize = function useContentResize(root, resizeTarget, props) {
     var calcContentScroll = (0,throttle_namespaceObject["default"])(function () {
       var _root$value$querySele = root.value.querySelector(".".concat(resolveClassName('modal-header'))).getBoundingClientRect(),
         headerHeight = _root$value$querySele.height;
-      var _root$value$querySele2 = root.value.querySelector(".".concat(resolveClassName('modal-content'))).getBoundingClientRect(),
+      var _root$value$querySele2 = root.value.querySelector(".".concat(resolveClassName('modal-content'), " div")).getBoundingClientRect(),
         contentHeight = _root$value$querySele2.height;
       var _root$value$querySele3 = root.value.querySelector(".".concat(resolveClassName('modal-footer'))).getBoundingClientRect(),
         footerHeight = _root$value$querySele3.height;
       var windowInnerHeight = window.innerHeight;
-      isContentScroll.value = windowInnerHeight < headerHeight + contentHeight + footerHeight;
+      isContentScroll.value = windowInnerHeight < headerHeight + contentHeight + footerHeight + 20;
       if (isContentScroll.value || props.fullscreen) {
         contentStyles.value = {
           height: "".concat(windowInnerHeight - headerHeight - footerHeight, "px")
         };
+        // fullscreen 时默认为 true
+        isContentScroll.value = true;
       } else {
         contentStyles.value = {};
       }
-    }, 100);
+    }, 30);
     observer = new ResizeObserver(function () {
       calcContentScroll();
     });
@@ -932,7 +934,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
       _this = this;
     return (0,external_vue_namespaceObject.createVNode)("div", {
       "ref": "refRoot",
-      "class": _defineProperty(_defineProperty(_defineProperty({}, this.resolveClassName('modal-ctx'), true), '--show', this.visible), '--hide', !this.visible),
+      "class": _defineProperty(_defineProperty({}, this.resolveClassName('modal-ctx'), true), 'is-show', this.visible),
       "style": {
         zIndex: this.zIndex
       }
@@ -955,7 +957,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
           "class": _this.resolveClassName('modal-content'),
           "style": _this.contentStyles
         }, [(0,external_vue_namespaceObject.createVNode)("div", {
-          "style": "position: relative; display: table-cell;"
+          "style": "position: relative; display: inline-block; width: 100%;"
         }, [(_this$$slots$default = (_this$$slots2 = _this.$slots)["default"]) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots2), (0,external_vue_namespaceObject.createVNode)("div", {
           "ref": "resizeTargetRef",
           "style": "position: absolute; top: 0; bottom: 0;"

package/lib/modal/modal.css

@@ -12,25 +12,21 @@
   word-break: break-all;
 }
 .bk-modal-ctx {
+  position: fixed;
   top: 0px;
   left: 0px;
+  display: none;
   width: 100%;
   height: 100%;
   pointer-events: auto;
 }
-.bk-modal-ctx.--show {
-  position: fixed;
-}
-.bk-modal-ctx.--show .bk-modal-ctx-mask {
+.bk-modal-ctx.is-show {
   display: block;
 }
-.bk-modal-ctx.--hide {
-  display: none;
-}
 .bk-modal-ctx-mask {
+  position: fixed;
   top: 0;
   left: 0;
-  display: none;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.6);
@@ -57,6 +53,7 @@
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
 }
 .bk-modal-content {
+  max-height: 100vh;
   overflow: auto;
   scrollbar-gutter: stable;
 }

package/lib/modal/modal.less

@@ -2,28 +2,23 @@
 @import '../info-box/info-box.less';
 
 .@{bk-prefix}-modal-ctx {
+  position: fixed;
   top: 0px;
   left: 0px;
+  display: none;
   width: 100%;
   height: 100%;
   pointer-events: auto;
 
-  &.--show {
-    position: fixed;
-    .@{bk-prefix}-modal-ctx-mask {
-      display: block;
-    }
-  }
-
-  &.--hide {
-    display: none;
+  &.is-show {
+    display: block;
   }
 }
 
 .@{bk-prefix}-modal-ctx-mask {
+  position: fixed;
   top: 0;
   left: 0;
-  display: none;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.6);
@@ -54,6 +49,7 @@
 }
 
 .@{bk-prefix}-modal-content {
+  max-height: 100vh;
   overflow: auto;
   scrollbar-gutter: stable;
 }

package/lib/modal/modal.variable.css

@@ -141,25 +141,21 @@
   word-break: break-all;
 }
 .bk-modal-ctx {
+  position: fixed;
   top: 0px;
   left: 0px;
+  display: none;
   width: 100%;
   height: 100%;
   pointer-events: auto;
 }
-.bk-modal-ctx.--show {
-  position: fixed;
-}
-.bk-modal-ctx.--show .bk-modal-ctx-mask {
+.bk-modal-ctx.is-show {
   display: block;
 }
-.bk-modal-ctx.--hide {
-  display: none;
-}
 .bk-modal-ctx-mask {
+  position: fixed;
   top: 0;
   left: 0;
-  display: none;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.6);
@@ -186,6 +182,7 @@
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
 }
 .bk-modal-content {
+  max-height: 100vh;
   overflow: auto;
   scrollbar-gutter: stable;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bkui-vue",
-  "version": "1.0.3-beta.53",
+  "version": "1.0.3-beta.54",
   "workspaces": {
     "packages": [
       "packages/!(**.bak)*",