bkui-vue 1.0.3-beta.4 → 1.0.3-beta.40

package/lib/image/index.js

@@ -40,7 +40,7 @@ __webpack_require__.d(__webpack_exports__, {
 ;// CONCATENATED MODULE: external "../shared"
 var x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var y = x => () => x
-const shared_namespaceObject = x({ ["PropTypes"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.PropTypes, ["bkZIndexManager"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.bkZIndexManager, ["withInstall"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.withInstall });
+const shared_namespaceObject = x({ ["PropTypes"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.PropTypes, ["bkZIndexManager"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.bkZIndexManager, ["getFullscreenRoot"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.getFullscreenRoot, ["withInstall"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.withInstall });
 ;// CONCATENATED MODULE: external "vue"
 var external_vue_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_vue_y = x => () => x
@@ -524,9 +524,12 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
     }
     var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
       resolveClassName = _usePrefix.resolveClassName;
+    var teleportTo = (0,external_vue_namespaceObject.computed)(function () {
+      return (0,shared_namespaceObject.getFullscreenRoot)();
+    });
     return function () {
       return (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Teleport, {
-        "to": "body"
+        "to": teleportTo.value
       }, {
         "default": function _default() {
           return [(0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Transition, null, {

package/lib/index.js

@@ -24,7 +24,6 @@
  * IN THE SOFTWARE.
  */
 // import './styles';
-
 export { default } from './preset';
 export * from './components';
 export * from './directives';

package/lib/info-box/index.js

@@ -3,11 +3,8 @@ import "./info-box.less";
 import * as __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__ from "../shared";
 import * as __WEBPACK_EXTERNAL_MODULE_vue__ from "vue";
 import * as __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__ from "../config-provider";
-import * as __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_button_a2ea7c9a__ from "../button";
-import "../button/button.less";
-import * as __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_icon_a97c79c3__ from "../icon";
-import * as __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_modal_d1344388__ from "../modal";
-import "../modal/modal.less";
+import * as __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_dialog_497cb4c3__ from "../dialog";
+import "../dialog/dialog.less";
 /******/ var __webpack_modules__ = ({
 
 /***/ 7609:
@@ -427,7 +424,7 @@ __webpack_require__.d(__webpack_exports__, {
 ;// CONCATENATED MODULE: external "../shared"
 var x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var y = x => () => x
-const shared_namespaceObject = x({ ["AlignEnum"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.AlignEnum, ["PropTypes"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.PropTypes, ["ThemeEnum"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.ThemeEnum, ["alignType"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.alignType, ["dialogTypeUnion"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.dialogTypeUnion, ["withInstall"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.withInstall });
+const shared_namespaceObject = x({ ["withInstall"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.withInstall });
 ;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/typeof.js
 function _typeof(o) {
   "@babel/helpers - typeof";
@@ -510,451 +507,25 @@ var regenerator_default = /*#__PURE__*/__webpack_require__.n(regenerator);
 ;// CONCATENATED MODULE: external "vue"
 var external_vue_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_vue_y = x => () => x
-const external_vue_namespaceObject = external_vue_x({ ["Fragment"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Fragment, ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createApp"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createApp, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["h"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.h, ["isVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.isVNode, ["mergeProps"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.mergeProps, ["onBeforeUnmount"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onBeforeUnmount, ["onMounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onMounted, ["reactive"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.reactive, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["shallowRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.shallowRef, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch });
+const external_vue_namespaceObject = external_vue_x({ ["createApp"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createApp, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["h"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.h, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["shallowRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.shallowRef });
 ;// CONCATENATED MODULE: external "../config-provider"
 var config_provider_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var config_provider_y = x => () => x
-const config_provider_namespaceObject = config_provider_x({ ["useLocale"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__.useLocale, ["usePrefix"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__.usePrefix });
-;// CONCATENATED MODULE: external "../button"
-var button_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var button_y = x => () => x
-const button_namespaceObject = button_x({ ["default"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_button_a2ea7c9a__["default"] });
-;// CONCATENATED MODULE: external "../button/button.less"
-var button_less_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var button_less_y = x => () => x
-const button_less_namespaceObject = button_less_x({  });
-;// CONCATENATED MODULE: external "../icon"
-var icon_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var icon_y = x => () => x
-const icon_namespaceObject = icon_x({ ["Close"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_icon_a97c79c3__.Close, ["Error"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_icon_a97c79c3__.Error, ["Spinner"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_icon_a97c79c3__.Spinner, ["Success"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_icon_a97c79c3__.Success, ["Warn"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_icon_a97c79c3__.Warn });
-;// CONCATENATED MODULE: external "../modal"
-var modal_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var modal_y = x => () => x
-const modal_namespaceObject = modal_x({ ["default"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_modal_d1344388__["default"], ["propsMixin"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_modal_d1344388__.propsMixin });
-;// CONCATENATED MODULE: external "../modal/modal.less"
-var modal_less_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var modal_less_y = x => () => x
-const modal_less_namespaceObject = modal_less_x({  });
-;// CONCATENATED MODULE: ../../packages/dialog/src/props.ts
-
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-/*
- * Tencent is pleased to support the open source community by making
- * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
- *
- * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
- *
- * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) is licensed under the MIT License.
- *
- * License for 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition):
- *
- * ---------------------------------------------------
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
- * documentation files (the "Software"), to deal in the Software without restriction, including without limitation
- * the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
- * to permit persons to whom the Software is furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial portions of
- * the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO
- * THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
- * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
- * IN THE SOFTWARE.
- */
-
-
-var props = _objectSpread(_objectSpread({}, modal_namespaceObject.propsMixin), {}, {
-  width: shared_namespaceObject.PropTypes.oneOfType([String, Number]).def(''),
-  height: shared_namespaceObject.PropTypes.oneOfType([String, Number]).def(''),
-  // 确认按钮文字
-  // confirmText: PropTypes.string.def('确定'),
-  confirmText: shared_namespaceObject.PropTypes.string,
-  // 取消按钮文字
-  // cancelText: PropTypes.string.def('取消'),
-  cancelText: shared_namespaceObject.PropTypes.string,
-  // 步骤按钮文字
-  // prevText: PropTypes.string.def('上一步'),
-  prevText: shared_namespaceObject.PropTypes.string,
-  // nextText: PropTypes.string.def('下一步'),
-  nextText: shared_namespaceObject.PropTypes.string,
-  // 当前步骤
-  current: shared_namespaceObject.PropTypes.number.def(1),
-  // 总步数
-  totalStep: shared_namespaceObject.PropTypes.number,
-  // 弹框的标题
-  title: shared_namespaceObject.PropTypes.string.def('title'),
-  // 显示 header 的位置
-  headerAlign: (0,shared_namespaceObject.alignType)().def(shared_namespaceObject.AlignEnum.LEFT),
-  // 显示 footer 的位置
-  footerAlign: (0,shared_namespaceObject.alignType)().def(shared_namespaceObject.AlignEnum.RIGHT),
-  // 颜色 按钮类型
-  theme: shared_namespaceObject.PropTypes.theme().def(shared_namespaceObject.ThemeEnum.PRIMARY),
-  // 对话框类型
-  dialogType: (0,shared_namespaceObject.dialogTypeUnion)(),
-  // 按钮loading
-  isLoading: shared_namespaceObject.PropTypes.bool.def(false)
-});
-/* harmony default export */ const src_props = (props);
-;// CONCATENATED MODULE: ../../packages/dialog/src/dialog.tsx
-
-
-
-/*
- * Tencent is pleased to support the open source community by making
- * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
- *
- * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
- *
- * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) is licensed under the MIT License.
- *
- * License for 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition):
- *
- * ---------------------------------------------------
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
- * documentation files (the "Software"), to deal in the Software without restriction, including without limitation
- * the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
- * to permit persons to whom the Software is furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial portions of
- * the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO
- * THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
- * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
- * IN THE SOFTWARE.
- */
-
-
-
-
-
-
-
-
-function _isSlot(s) {
-  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !(0,external_vue_namespaceObject.isVNode)(s);
-}
-/* harmony default export */ const src_dialog = ((0,external_vue_namespaceObject.defineComponent)({
-  // eslint-disable-next-line vue/no-reserved-component-names
-  name: 'Dialog',
-  props: src_props,
-  emits: ['closed', 'update:isShow', 'confirm', 'prev', 'next', 'value-change'],
-  setup: function setup(props, _ref) {
-    var emit = _ref.emit;
-    var t = (0,config_provider_namespaceObject.useLocale)('dialog');
-    var localConfirmText = (0,external_vue_namespaceObject.computed)(function () {
-      if (props.confirmText === undefined) {
-        return t.value.ok;
-      }
-      return props.confirmText;
-    });
-    var localCancelText = (0,external_vue_namespaceObject.computed)(function () {
-      if (props.cancelText === undefined) {
-        return t.value.cancel;
-      }
-      return props.cancelText;
-    });
-    var localPrevText = (0,external_vue_namespaceObject.computed)(function () {
-      if (props.prevText === undefined) {
-        return t.value.prev;
-      }
-      return props.prevText;
-    });
-    var localNextText = (0,external_vue_namespaceObject.computed)(function () {
-      if (props.nextText === undefined) {
-        return t.value.next;
-      }
-      return props.nextText;
-    });
-    var data = (0,external_vue_namespaceObject.reactive)({
-      positionX: 0,
-      positionY: 0,
-      moveStyle: {
-        top: '50%',
-        left: '50%'
-      }
-    });
-    var isModalShow = (0,external_vue_namespaceObject.ref)(props.isShow);
-    (0,external_vue_namespaceObject.onMounted)(function () {
-      if (props.escClose) {
-        addEventListener('keydown', escCloseHandler);
-      }
-    });
-    (0,external_vue_namespaceObject.onBeforeUnmount)(function () {
-      if (props.escClose) {
-        removeEventListener('keydown', escCloseHandler);
-      }
-    });
-    (0,external_vue_namespaceObject.watch)(function () {
-      return props.isShow;
-    }, function (val) {
-      if (!val) {
-        setTimeout(function () {
-          data.moveStyle = {
-            top: '50%',
-            left: '50%'
-          };
-          data.positionX = 0;
-          data.positionY = 0;
-          isModalShow.value = false;
-        }, 250);
-      } else {
-        isModalShow.value = true;
-      }
-      emit('value-change', val);
-    });
-    // 关闭弹框
-    var handleClose = /*#__PURE__*/function () {
-      var _ref2 = _asyncToGenerator( /*#__PURE__*/regenerator_default().mark(function _callee() {
-        var shouldClose;
-        return regenerator_default().wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              shouldClose = true;
-              if (!(typeof props.beforeClose === 'function')) {
-                _context.next = 5;
-                break;
-              }
-              _context.next = 4;
-              return props.beforeClose();
-            case 4:
-              shouldClose = _context.sent;
-            case 5:
-              if (shouldClose) {
-                emit('update:isShow', false);
-                emit('closed');
-                isModalShow.value = false;
-              }
-            case 6:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee);
-      }));
-      return function handleClose() {
-        return _ref2.apply(this, arguments);
-      };
-    }();
-    var handleConfirm = function handleConfirm() {
-      emit('update:isShow', false);
-      emit('confirm');
-      // isModalShow.value = false; 影响异步关闭
-    };
-    var hasFooter = (0,external_vue_namespaceObject.computed)(function () {
-      return ['process', 'operation', 'confirm'].includes(props.dialogType);
-    });
-    // 按 esc 关闭弹框
-    var escCloseHandler = function escCloseHandler(e) {
-      if (props.isShow && props.closeIcon) {
-        if (e.keyCode === 27) {
-          handleClose();
-        }
-      }
-    };
-    // 上一步
-    var handlePrevStep = function handlePrevStep() {
-      emit('prev');
-    };
-    // 下一步
-    var handleNextStep = function handleNextStep() {
-      emit('next');
-    };
-    // 拖拽事件
-    var moveHandler = function moveHandler(e) {
-      if (props.fullscreen) {
-        return false;
-      }
-      if (!props.draggable) {
-        return false;
-      }
-      var odiv = e.target;
-      var parentHeight = e.currentTarget.parentNode.parentNode.offsetHeight;
-      var parentWidth = e.currentTarget.parentNode.parentNode.offsetWidth;
-      var disX;
-      var disY;
-      if (data.positionX !== 0 && data.positionY !== 0) {
-        disX = e.clientX - data.positionX;
-        disY = e.clientY - data.positionY;
-      } else {
-        disX = e.clientX - odiv.offsetLeft;
-        disY = e.clientY - odiv.offsetTop;
-      }
-      document.onmousemove = function (e) {
-        var boxLeft = window.innerWidth - parentWidth;
-        var boxTop = window.innerHeight - parentHeight;
-        var left = e.clientX - disX;
-        var top = e.clientY - disY;
-        if (boxLeft / 2 - left <= 0) {
-          left = boxLeft / 2;
-        } else if (boxLeft / 2 + left <= 0) {
-          left = -boxLeft / 2;
-        }
-        if (boxTop / 2 - top <= 0) {
-          top = boxTop / 2;
-        } else if (boxTop / 2 + top <= 0) {
-          top = -boxTop / 2;
-        }
-        data.positionX = left;
-        data.positionY = top;
-        data.moveStyle.left = "calc(50% + ".concat(left, "px)");
-        data.moveStyle.top = "calc(50% + ".concat(top, "px)");
-      };
-      document.onmouseup = function () {
-        document.onmousemove = null;
-        document.onmouseup = null;
-      };
-    };
-    var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
-      resolveClassName = _usePrefix.resolveClassName;
-    return {
-      data: data,
-      handleClose: handleClose,
-      handleConfirm: handleConfirm,
-      escCloseHandler: escCloseHandler,
-      moveHandler: moveHandler,
-      handlePrevStep: handlePrevStep,
-      handleNextStep: handleNextStep,
-      hasFooter: hasFooter,
-      isModalShow: isModalShow,
-      localConfirmText: localConfirmText,
-      localCancelText: localCancelText,
-      localPrevText: localPrevText,
-      localNextText: localNextText,
-      resolveClassName: resolveClassName
-    };
-  },
-  render: function render() {
-    var _this = this;
-    var renderIcon = function renderIcon() {
-      var iconMap = {
-        loading: (0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Spinner, {
-          "class": [_this.resolveClassName('info-icon'), 'primary']
-        }, null),
-        warning: (0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Warn, {
-          "class": [_this.resolveClassName('info-icon'), 'warning']
-        }, null),
-        success: (0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Success, {
-          "class": [_this.resolveClassName('info-icon'), 'success']
-        }, null),
-        danger: (0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Close, {
-          "class": [_this.resolveClassName('info-icon'), 'danger']
-        }, null)
-      };
-      return iconMap[_this.infoType];
-    };
-    var dialogSlot = {
-      header: function header() {
-        var _this$$slots$tools, _this$$slots$tools2, _this$$slots, _this$$slots$header, _this$$slots$header2, _this$$slots2;
-        return [(0,external_vue_namespaceObject.createVNode)("div", {
-          "class": [_this.resolveClassName('dialog-tool'), _this.fullscreen || !_this.draggable ? '' : 'move', _this.draggable ? 'content-dragging' : ''],
-          "onMousedown": _this.moveHandler
-        }, [(_this$$slots$tools = (_this$$slots$tools2 = (_this$$slots = _this.$slots).tools) === null || _this$$slots$tools2 === void 0 ? void 0 : _this$$slots$tools2.call(_this$$slots)) !== null && _this$$slots$tools !== void 0 ? _this$$slots$tools : '']), (0,external_vue_namespaceObject.createVNode)("div", {
-          "class": _this.resolveClassName('dialog-header')
-        }, [(0,external_vue_namespaceObject.createVNode)("div", {
-          "class": _this.resolveClassName('header-icon')
-        }, [_this.infoType ? renderIcon() : (0,external_vue_namespaceObject.createVNode)("slot", {
-          "name": "info-icon"
-        }, null)]), (0,external_vue_namespaceObject.createVNode)("span", {
-          "class": _this.resolveClassName('dialog-title'),
-          "style": "text-align: ".concat(_this.headerAlign)
-        }, [(_this$$slots$header = (_this$$slots$header2 = (_this$$slots2 = _this.$slots).header) === null || _this$$slots$header2 === void 0 ? void 0 : _this$$slots$header2.call(_this$$slots2)) !== null && _this$$slots$header !== void 0 ? _this$$slots$header : _this.title])])];
-      },
-      "default": function _default() {
-        var _this$$slots$default, _this$$slots$default2, _this$$slots3;
-        return (_this$$slots$default = (_this$$slots$default2 = (_this$$slots3 = _this.$slots)["default"]) === null || _this$$slots$default2 === void 0 ? void 0 : _this$$slots$default2.call(_this$$slots3)) !== null && _this$$slots$default !== void 0 ? _this$$slots$default : 'default';
-      },
-      footer: function footer() {
-        var _this$$slots$footer, _this$$slots$footer2, _this$$slots4, _this$$slots$footer3, _this$$slots$footer4, _this$$slots5, _this$$slots$footer5, _this$$slots$footer6, _this$$slots6;
-        return (0,external_vue_namespaceObject.createVNode)("div", {
-          "class": _this.resolveClassName('dialog-footer'),
-          "style": "text-align: ".concat(_this.footerAlign)
-        }, [_this.dialogType === 'process' ? (_this$$slots$footer = (_this$$slots$footer2 = (_this$$slots4 = _this.$slots).footer) === null || _this$$slots$footer2 === void 0 ? void 0 : _this$$slots$footer2.call(_this$$slots4)) !== null && _this$$slots$footer !== void 0 ? _this$$slots$footer : (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [_this.current === 1 ? '' : (0,external_vue_namespaceObject.createVNode)(button_namespaceObject["default"], {
-          "class": _this.resolveClassName('dialog-perv'),
-          "onClick": _this.handlePrevStep
-        }, {
-          "default": function _default() {
-            return [_this.localPrevText];
-          }
-        }), _this.current === _this.totalStep ? '' : (0,external_vue_namespaceObject.createVNode)(button_namespaceObject["default"], {
-          "class": _this.resolveClassName('dialog-next'),
-          "onClick": _this.handleNextStep
-        }, {
-          "default": function _default() {
-            return [_this.localNextText];
-          }
-        }), _this.current === _this.totalStep ? (0,external_vue_namespaceObject.createVNode)(button_namespaceObject["default"], {
-          "onClick": _this.handleConfirm,
-          "theme": _this.theme,
-          "loading": _this.isLoading
-        }, {
-          "default": function _default() {
-            return [_this.localConfirmText];
-          }
-        }) : '', (0,external_vue_namespaceObject.createVNode)(button_namespaceObject["default"], {
-          "class": _this.resolveClassName('dialog-cancel'),
-          "onClick": _this.handleClose,
-          "disabled": _this.isLoading
-        }, {
-          "default": function _default() {
-            return [_this.localCancelText];
-          }
-        })]) : '', _this.dialogType === 'operation' ? (_this$$slots$footer3 = (_this$$slots$footer4 = (_this$$slots5 = _this.$slots).footer) === null || _this$$slots$footer4 === void 0 ? void 0 : _this$$slots$footer4.call(_this$$slots5)) !== null && _this$$slots$footer3 !== void 0 ? _this$$slots$footer3 : (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [(0,external_vue_namespaceObject.createVNode)(button_namespaceObject["default"], {
-          "onClick": _this.handleConfirm,
-          "theme": _this.theme,
-          "loading": _this.isLoading
-        }, {
-          "default": function _default() {
-            return [_this.localConfirmText];
-          }
-        }), (0,external_vue_namespaceObject.createVNode)(button_namespaceObject["default"], {
-          "class": _this.resolveClassName('dialog-cancel'),
-          "onClick": _this.handleClose,
-          "disabled": _this.isLoading
-        }, {
-          "default": function _default() {
-            return [_this.localCancelText];
-          }
-        })]) : '', _this.dialogType === 'confirm' ? (_this$$slots$footer5 = (_this$$slots$footer6 = (_this$$slots6 = _this.$slots).footer) === null || _this$$slots$footer6 === void 0 ? void 0 : _this$$slots$footer6.call(_this$$slots6)) !== null && _this$$slots$footer5 !== void 0 ? _this$$slots$footer5 : (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [(0,external_vue_namespaceObject.createVNode)(button_namespaceObject["default"], {
-          "onClick": _this.handleConfirm,
-          "theme": _this.theme,
-          "loading": _this.isLoading
-        }, {
-          "default": function _default() {
-            return [_this.localConfirmText];
-          }
-        })]) : '']);
-      },
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
-      close: function close() {
-        return (0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Error, {
-          "onClick": _this.handleClose
-        }, null);
-      }
-    };
-    var className = "".concat(this.resolveClassName('dialog-wrapper '), " ").concat(this.scrollable ? 'scroll-able' : '', " ").concat(this.multiInstance ? 'multi-instance' : '', " ").concat(this.hasFooter ? 'has-footer' : 'no-footer');
-    return (0,external_vue_namespaceObject.createVNode)(modal_namespaceObject["default"], (0,external_vue_namespaceObject.mergeProps)(this.$props, {
-      "class": className,
-      "onClose": this.handleClose,
-      "isShow": this.isModalShow,
-      "left": this.data.moveStyle.left,
-      "top": this.data.moveStyle.top
-    }), _isSlot(dialogSlot) ? dialogSlot : {
-      "default": function _default() {
-        return [dialogSlot];
-      }
-    });
-  }
-}));
+const config_provider_namespaceObject = config_provider_x({ ["usePrefix"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__.usePrefix });
+;// CONCATENATED MODULE: external "../dialog"
+var dialog_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
+var dialog_y = x => () => x
+const dialog_namespaceObject = dialog_x({ ["default"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_dialog_497cb4c3__["default"] });
+;// CONCATENATED MODULE: external "../dialog/dialog.less"
+var dialog_less_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
+var dialog_less_y = x => () => x
+const dialog_less_namespaceObject = dialog_less_x({  });
 ;// CONCATENATED MODULE: ../../packages/info-box/src/info-box.tsx
 
 
 
-function info_box_ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function info_box_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? info_box_ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : info_box_ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 
 /*
  * Tencent is pleased to support the open source community by making
@@ -984,15 +555,18 @@ function info_box_objectSpread(e) { for (var r = 1; r < arguments.length; r++) {
 
 
 
+
 var InfoBox = function InfoBox(config) {
   var container = document.createElement('div');
   var modalFuncProps = (0,external_vue_namespaceObject.shallowRef)(config);
   var isShow = (0,external_vue_namespaceObject.ref)(modalFuncProps.value.isShow !== false);
   var app;
+  var dialogConfirm;
   var dialog = (0,external_vue_namespaceObject.defineComponent)({
     name: 'DialogConfirm',
     setup: function setup(_props, _ref) {
       var expose = _ref.expose;
+      var isLoading = false;
       var beforeHiddenFn = [];
       var resolveUserCallbackFnBeforeClose = /*#__PURE__*/function () {
         var _ref2 = _asyncToGenerator( /*#__PURE__*/regenerator_default().mark(function _callee(userCallbackFn) {
@@ -1049,8 +623,12 @@ var InfoBox = function InfoBox(config) {
           return regenerator_default().wrap(function _callee3$(_context3) {
             while (1) switch (_context3.prev = _context3.next) {
               case 0:
-                resolveUserCallbackFnBeforeClose((_modalFuncProps$value2 = modalFuncProps.value) === null || _modalFuncProps$value2 === void 0 ? void 0 : _modalFuncProps$value2.onConfirm);
-              case 1:
+                isLoading = true;
+                _context3.next = 3;
+                return resolveUserCallbackFnBeforeClose((_modalFuncProps$value2 = modalFuncProps.value) === null || _modalFuncProps$value2 === void 0 ? void 0 : _modalFuncProps$value2.onConfirm);
+              case 3:
+                isLoading = false;
+              case 4:
               case "end":
                 return _context3.stop();
             }
@@ -1061,7 +639,7 @@ var InfoBox = function InfoBox(config) {
         };
       }();
       function update(newValue) {
-        modalFuncProps.value = info_box_objectSpread(info_box_objectSpread({}, modalFuncProps.value), newValue);
+        modalFuncProps.value = _objectSpread(_objectSpread({}, modalFuncProps.value), newValue);
       }
       expose({
         update: update
@@ -1097,14 +675,16 @@ var InfoBox = function InfoBox(config) {
           return fn();
         });
         beforeHiddenFn.length = 0;
+        unmountApp();
         container.remove();
       };
       return function () {
-        return (0,external_vue_namespaceObject.createVNode)(src_dialog, info_box_objectSpread(info_box_objectSpread({
+        return (0,external_vue_namespaceObject.createVNode)(dialog_namespaceObject["default"], _objectSpread(_objectSpread({
           "class": resolveClassName('info-wrapper'),
           headerAlign: 'center',
           footerAlign: 'center',
-          fullscreen: false
+          fullscreen: false,
+          isLoading: isLoading
         }, modalFuncProps.value), {}, {
           isShow: isShow.value,
           transfer: false,
@@ -1118,9 +698,15 @@ var InfoBox = function InfoBox(config) {
   var beforeShow = function beforeShow() {
     if (!app) {
       document.body.append(container);
-      app = (0,external_vue_namespaceObject.createApp)(dialog).mount(container);
+      app = (0,external_vue_namespaceObject.createApp)(dialog);
+      dialogConfirm = app.mount(container);
     }
   };
+  var unmountApp = function unmountApp() {
+    var _app;
+    (_app = app) === null || _app === void 0 || _app.unmount();
+    app = null;
+  };
   if (isShow.value) {
     beforeShow();
   }
@@ -1131,17 +717,16 @@ var InfoBox = function InfoBox(config) {
     },
     hide: function hide() {
       isShow.value = false;
+      unmountApp();
     },
     update: function update(config) {
-      var _app;
+      var _dialogConfirm;
       beforeShow();
-      (_app = app) === null || _app === void 0 || _app.update(config);
+      (_dialogConfirm = dialogConfirm) === null || _dialogConfirm === void 0 || _dialogConfirm.update(config);
     },
     destroy: function destroy() {
-      var _app2;
       container.remove();
-      (_app2 = app) === null || _app2 === void 0 || _app2.unmount();
-      app = null;
+      unmountApp();
     }
   };
 };

package/lib/info-box/info-box.css

@@ -10,27 +10,22 @@
 .bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-body {
   border-radius: 2px;
 }
-.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header {
-  padding: 24px 24px 0;
-}
 .bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header .bk-dialog-title {
-  height: 27px;
-  margin: 15px 0 10px;
+  margin-top: 16px;
 }
 .bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-content {
-  height: 100%;
-  max-height: 100%;
-  min-height: 100%;
-  padding: 0 50px 10px;
+  height: initial;
+  max-height: initial;
+  min-height: initial;
   word-break: break-all;
 }
 .bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-content .bk-info-sub-title {
-  margin-bottom: 10px;
   text-align: center;
   word-break: break-all;
 }
 .bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer {
-  padding: 0 65px 33px;
+  height: initial;
+  margin-top: 24px;
   background-color: #fff;
   border-top: none;
 }

package/lib/info-box/info-box.d.ts

@@ -4,7 +4,7 @@ export interface ModalFuncProps {
     width?: string | number;
     height?: string | number;
     'ext-cls': string | string[];
-    type?: 'primary' | 'warning' | 'success' | 'danger';
+    theme?: 'primary' | 'warning' | 'success' | 'danger';
     infoType?: 'success' | 'danger' | 'warning' | 'loading';
     title?: string | (() => VNode | string) | VNode;
     subTitle?: string | (() => VNode) | VNode;