bkui-vue 0.0.2-modal-refactor.1 → 0.0.2-modal-refactor.2

package/lib/date-picker/use-calendar.d.ts

@@ -0,0 +1,24 @@
+import { type ComponentPublicInstance } from 'vue';
+import type { DatePickerPanelType } from './interface';
+export declare function useCalendar(props: any, slots: any, emit: any): {
+    resolveClassName: (cls: string) => string;
+    longWidthCls: import("vue").ComputedRef<string>;
+    fontSizeCls: import("vue").ComputedRef<string>;
+    forceInputRerender: import("vue").Ref<number>;
+    internalValue: any;
+    localReadonly: import("vue").ComputedRef<any>;
+    displayValue: import("vue").ComputedRef<any>;
+    inputRef: any;
+    setInputRef: (el: Element | ComponentPublicInstance | null) => void;
+    handleFocus: (e: any) => void;
+    handleBlur: (e: any) => void;
+    showClose: import("vue").Ref<boolean>;
+    handleIconClick: () => void;
+    handleKeydown: (e: KeyboardEvent) => void;
+    handleInputChange: (e: any) => void;
+    handleInputInput: (e: any) => void;
+    handleClear: () => void;
+    panel: import("vue").ComputedRef<DatePickerPanelType>;
+    opened: import("vue").ComputedRef<any>;
+};
+export declare function defaultTrigger(props: any, slots: any, emit: any): JSX.Element;

package/lib/dialog/dialog.css

@@ -1,40 +1,40 @@
-.bk-modal-wrapper.bk-info-wrapper {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.normal {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.normal {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.small {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.small {
   width: 400px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-body {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-body {
   border-radius: 2px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header {
   padding: 24px 24px 0;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header .bk-dialog-title {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header .bk-dialog-title {
   height: 27px;
   margin: 15px 0 10px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-content {
   height: 100%;
   max-height: 100%;
   min-height: 100%;
   padding: 0 50px 10px;
   word-break: break-all;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content .bk-info-sub-title {
+.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-wrapper.bk-info-wrapper .bk-modal-footer {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer {
   padding: 0 65px 33px;
   background-color: #fff;
   border-top: none;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-footer .bk-dialog-footer button {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer .bk-dialog-footer button {
   min-width: 88px;
 }
 .bk-modal-ctx {

package/lib/dialog/dialog.d.ts

@@ -287,16 +287,16 @@ declare const _default: import("vue").DefineComponent<{
     theme: "success" | "warning" | "danger" | "primary";
     draggable: boolean;
     transfer: string | boolean | HTMLElement;
-    showMask: boolean;
-    multiInstance: boolean;
     direction: string;
     renderDirective: "show" | "if";
     quickClose: boolean;
     scrollable: boolean;
+    showMask: boolean;
     closeIcon: boolean;
     escClose: boolean;
     fullscreen: boolean;
     animateType: string;
+    multiInstance: boolean;
     confirmText: string;
     cancelText: string;
     prevText: string;

package/lib/dialog/dialog.variable.css

@@ -124,43 +124,43 @@
   --search-select-message-color: var(--danger-color);
   --search-select-menu-border-color: var(--disable-color);
 }
-.bk-modal-wrapper.bk-info-wrapper {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.normal {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.normal {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.small {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.small {
   width: 400px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-body {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-body {
   border-radius: 2px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header {
   padding: 24px 24px 0;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header .bk-dialog-title {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header .bk-dialog-title {
   height: 27px;
   margin: 15px 0 10px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-content {
   height: 100%;
   max-height: 100%;
   min-height: 100%;
   padding: 0 50px 10px;
   word-break: break-all;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content .bk-info-sub-title {
+.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-wrapper.bk-info-wrapper .bk-modal-footer {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer {
   padding: 0 65px 33px;
   background-color: #fff;
   border-top: none;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-footer .bk-dialog-footer button {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer .bk-dialog-footer button {
   min-width: 88px;
 }
 .bk-modal-ctx {

package/lib/dialog/index.d.ts

@@ -14,16 +14,16 @@ declare const BkDialog: {
             theme?: "success" | "warning" | "danger" | "primary";
             draggable?: boolean;
             transfer?: string | boolean | HTMLElement;
-            showMask?: boolean;
-            multiInstance?: boolean;
             direction?: string;
             renderDirective?: "show" | "if";
             quickClose?: boolean;
             scrollable?: boolean;
+            showMask?: boolean;
             closeIcon?: boolean;
             escClose?: boolean;
             fullscreen?: boolean;
             animateType?: string;
+            multiInstance?: boolean;
             confirmText?: string;
             cancelText?: string;
             prevText?: string;
@@ -267,16 +267,16 @@ declare const BkDialog: {
             theme: "success" | "warning" | "danger" | "primary";
             draggable: boolean;
             transfer: string | boolean | HTMLElement;
-            showMask: boolean;
-            multiInstance: boolean;
             direction: string;
             renderDirective: "show" | "if";
             quickClose: boolean;
             scrollable: boolean;
+            showMask: boolean;
             closeIcon: boolean;
             escClose: boolean;
             fullscreen: boolean;
             animateType: string;
+            multiInstance: boolean;
             confirmText: string;
             cancelText: string;
             prevText: string;
@@ -628,16 +628,16 @@ declare const BkDialog: {
     theme: "success" | "warning" | "danger" | "primary";
     draggable: boolean;
     transfer: string | boolean | HTMLElement;
-    showMask: boolean;
-    multiInstance: boolean;
     direction: string;
     renderDirective: "show" | "if";
     quickClose: boolean;
     scrollable: boolean;
+    showMask: boolean;
     closeIcon: boolean;
     escClose: boolean;
     fullscreen: boolean;
     animateType: string;
+    multiInstance: boolean;
     confirmText: string;
     cancelText: string;
     prevText: string;

package/lib/info-box/index.js

@@ -998,19 +998,13 @@ function info_box_objectSpread(target) { for (var i = 1; i < arguments.length; i
 
 var InfoBox = function InfoBox(config) {
   var container = document.createElement('div');
-  var isShow = (0,external_vue_namespaceObject.ref)(false);
   var modalFuncProps = (0,external_vue_namespaceObject.shallowRef)(config);
+  var isShow = (0,external_vue_namespaceObject.ref)(modalFuncProps.value.isShow !== false);
+  var app;
   var dialog = (0,external_vue_namespaceObject.defineComponent)({
     name: 'DialogConfirm',
     setup: function setup(_props, _ref) {
       var expose = _ref.expose;
-      (0,external_vue_namespaceObject.onMounted)(function () {
-        var dom = document.activeElement || document.body;
-        dom.blur();
-        if (modalFuncProps.value.isShow !== false) {
-          isShow.value = true;
-        }
-      });
       var onClosed = /*#__PURE__*/function () {
         var _ref2 = _asyncToGenerator( /*#__PURE__*/regenerator_default().mark(function _callee() {
           var _modalFuncProps$value;
@@ -1093,6 +1087,9 @@ var InfoBox = function InfoBox(config) {
         }
         return subTitleBox;
       };
+      var onHidden = function onHidden() {
+        container.remove();
+      };
       return function () {
         return (0,external_vue_namespaceObject.createVNode)(src_dialog, info_box_objectSpread(info_box_objectSpread({
           "class": resolveClassName('info-wrapper'),
@@ -1103,24 +1100,38 @@ var InfoBox = function InfoBox(config) {
         }, modalFuncProps.value), {}, {
           isShow: isShow.value,
           onClosed: onClosed,
-          onConfirm: onConfirm
-        }), getContent());
+          onConfirm: onConfirm,
+          onHidden: onHidden
+        }), getContent);
       };
     }
   });
-  var app = (0,external_vue_namespaceObject.createApp)(dialog).mount(container);
+  var beforeShow = function beforeShow() {
+    if (!app) {
+      document.body.append(container);
+      app = (0,external_vue_namespaceObject.createApp)(dialog).mount(container);
+    }
+  };
+  if (isShow.value) {
+    beforeShow();
+  }
   return {
     show: function show() {
+      beforeShow();
       isShow.value = true;
     },
     hide: function hide() {
       isShow.value = false;
     },
     update: function update(config) {
-      app.update(config);
+      var _app;
+      beforeShow();
+      (_app = app) === null || _app === void 0 ? void 0 : _app.update(config);
     },
     destroy: function destroy() {
-      app.unmount();
+      var _app2;
+      container.remove();
+      (_app2 = app) === null || _app2 === void 0 ? void 0 : _app2.unmount();
       app = null;
     }
   };

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

@@ -1,39 +1,39 @@
-.bk-modal-wrapper.bk-info-wrapper {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.normal {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.normal {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.small {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.small {
   width: 400px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-body {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-body {
   border-radius: 2px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header {
   padding: 24px 24px 0;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header .bk-dialog-title {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header .bk-dialog-title {
   height: 27px;
   margin: 15px 0 10px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-content {
   height: 100%;
   max-height: 100%;
   min-height: 100%;
   padding: 0 50px 10px;
   word-break: break-all;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content .bk-info-sub-title {
+.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-wrapper.bk-info-wrapper .bk-modal-footer {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer {
   padding: 0 65px 33px;
   background-color: #fff;
   border-top: none;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-footer .bk-dialog-footer button {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer .bk-dialog-footer button {
   min-width: 88px;
 }

package/lib/info-box/info-box.less

@@ -1,52 +1,55 @@
 @import '../styles/themes/themes.less';
-.@{bk-prefix}-modal-wrapper {
+.@{bk-prefix}-modal-ctx {
   &.@{bk-prefix}-info-wrapper {
-    width: 440px;
-
-    &.normal {
+    .@{bk-prefix}-modal-wrapper {
       width: 440px;
-    }
 
-    &.small {
-      width: 400px;
-    }
+      &.normal {
+        width: 440px;
+      }
 
-    .@{bk-prefix}-modal-body {
-      border-radius: 2px;
-    }
+      &.small {
+        width: 400px;
+      }
 
-    .@{bk-prefix}-dialog-header {
-      padding: 24px 24px 0;
+      .@{bk-prefix}-modal-body {
+        border-radius: 2px;
+      }
 
-      .@{bk-prefix}-dialog-title {
-        height: 27px;
-        margin: 15px 0 10px;
+      .@{bk-prefix}-dialog-header {
+        padding: 24px 24px 0;
+
+        .@{bk-prefix}-dialog-title {
+          height: 27px;
+          margin: 15px 0 10px;
+        }
       }
-    }
 
-    .@{bk-prefix}-modal-content {
-      height: 100%;
-      max-height: 100%;
-      min-height: 100%;
-      padding: 0 50px 10px;
-      word-break: break-all;
-      .@{bk-prefix}-info-sub-title {
-        margin-bottom: 10px;
-        text-align: center;
+      .@{bk-prefix}-modal-content {
+        height: 100%;
+        max-height: 100%;
+        min-height: 100%;
+        padding: 0 50px 10px;
         word-break: break-all;
+        .@{bk-prefix}-info-sub-title {
+          margin-bottom: 10px;
+          text-align: center;
+          word-break: break-all;
+        }
       }
-    }
 
-    .@{bk-prefix}-modal-footer {
-      padding: 0 65px 33px;
-      background-color: #fff;
-      border-top: none;
+      .@{bk-prefix}-modal-footer {
+        padding: 0 65px 33px;
+        background-color: #fff;
+        border-top: none;
 
-      .@{bk-prefix}-dialog-footer {
-        button {
-          min-width: 88px;
+        .@{bk-prefix}-dialog-footer {
+          button {
+            min-width: 88px;
+          }
         }
       }
     }
+
   }
 }

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

@@ -124,42 +124,42 @@
   --search-select-message-color: var(--danger-color);
   --search-select-menu-border-color: var(--disable-color);
 }
-.bk-modal-wrapper.bk-info-wrapper {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.normal {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.normal {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.small {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.small {
   width: 400px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-body {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-body {
   border-radius: 2px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header {
   padding: 24px 24px 0;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header .bk-dialog-title {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header .bk-dialog-title {
   height: 27px;
   margin: 15px 0 10px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-content {
   height: 100%;
   max-height: 100%;
   min-height: 100%;
   padding: 0 50px 10px;
   word-break: break-all;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content .bk-info-sub-title {
+.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-wrapper.bk-info-wrapper .bk-modal-footer {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer {
   padding: 0 65px 33px;
   background-color: #fff;
   border-top: none;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-footer .bk-dialog-footer button {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer .bk-dialog-footer button {
   min-width: 88px;
 }

package/lib/modal/index.d.ts

@@ -14,16 +14,16 @@ declare const BkModal: {
             isShow?: boolean;
             draggable?: boolean;
             transfer?: string | boolean | HTMLElement;
-            showMask?: boolean;
-            multiInstance?: boolean;
             direction?: string;
             renderDirective?: "show" | "if";
             quickClose?: boolean;
             scrollable?: boolean;
+            showMask?: boolean;
             closeIcon?: boolean;
             escClose?: boolean;
             fullscreen?: boolean;
             animateType?: string;
+            multiInstance?: boolean;
             class?: unknown;
             style?: unknown;
             ref?: import("vue").VNodeRef;
@@ -219,16 +219,16 @@ declare const BkModal: {
             isShow: boolean;
             draggable: boolean;
             transfer: string | boolean | HTMLElement;
-            showMask: boolean;
-            multiInstance: boolean;
             direction: string;
             renderDirective: "show" | "if";
             quickClose: boolean;
             scrollable: boolean;
+            showMask: boolean;
             closeIcon: boolean;
             escClose: boolean;
             fullscreen: boolean;
             animateType: string;
+            multiInstance: boolean;
         }, {}, string, {}> & {
             beforeCreate?: (() => void) | (() => void)[];
             created?: (() => void) | (() => void)[];
@@ -496,16 +496,16 @@ declare const BkModal: {
     isShow: boolean;
     draggable: boolean;
     transfer: string | boolean | HTMLElement;
-    showMask: boolean;
-    multiInstance: boolean;
     direction: string;
     renderDirective: "show" | "if";
     quickClose: boolean;
     scrollable: boolean;
+    showMask: boolean;
     closeIcon: boolean;
     escClose: boolean;
     fullscreen: boolean;
     animateType: string;
+    multiInstance: boolean;
 }, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("vue").Plugin<any[]> & Readonly<{
     propsMixin: {
         isShow: import("vue-types").VueTypeValidableDef<boolean> & {

package/lib/modal/modal.css

@@ -1,40 +1,40 @@
-.bk-modal-wrapper.bk-info-wrapper {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.normal {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.normal {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.small {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.small {
   width: 400px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-body {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-body {
   border-radius: 2px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header {
   padding: 24px 24px 0;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header .bk-dialog-title {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header .bk-dialog-title {
   height: 27px;
   margin: 15px 0 10px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-content {
   height: 100%;
   max-height: 100%;
   min-height: 100%;
   padding: 0 50px 10px;
   word-break: break-all;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content .bk-info-sub-title {
+.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-wrapper.bk-info-wrapper .bk-modal-footer {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer {
   padding: 0 65px 33px;
   background-color: #fff;
   border-top: none;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-footer .bk-dialog-footer button {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer .bk-dialog-footer button {
   min-width: 88px;
 }
 .bk-modal-ctx {

package/lib/modal/modal.d.ts

@@ -215,15 +215,15 @@ declare const _default: import("vue").DefineComponent<{
     isShow: boolean;
     draggable: boolean;
     transfer: string | boolean | HTMLElement;
-    showMask: boolean;
-    multiInstance: boolean;
     direction: string;
     renderDirective: "show" | "if";
     quickClose: boolean;
     scrollable: boolean;
+    showMask: boolean;
     closeIcon: boolean;
     escClose: boolean;
     fullscreen: boolean;
     animateType: string;
+    multiInstance: boolean;
 }, {}>;
 export default _default;

package/lib/modal/modal.variable.css

@@ -124,43 +124,43 @@
   --search-select-message-color: var(--danger-color);
   --search-select-menu-border-color: var(--disable-color);
 }
-.bk-modal-wrapper.bk-info-wrapper {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.normal {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.normal {
   width: 440px;
 }
-.bk-modal-wrapper.bk-info-wrapper.small {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper.small {
   width: 400px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-body {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-body {
   border-radius: 2px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header {
   padding: 24px 24px 0;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header .bk-dialog-title {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-dialog-header .bk-dialog-title {
   height: 27px;
   margin: 15px 0 10px;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-content {
   height: 100%;
   max-height: 100%;
   min-height: 100%;
   padding: 0 50px 10px;
   word-break: break-all;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-content .bk-info-sub-title {
+.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-wrapper.bk-info-wrapper .bk-modal-footer {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer {
   padding: 0 65px 33px;
   background-color: #fff;
   border-top: none;
 }
-.bk-modal-wrapper.bk-info-wrapper .bk-modal-footer .bk-dialog-footer button {
+.bk-modal-ctx.bk-info-wrapper .bk-modal-wrapper .bk-modal-footer .bk-dialog-footer button {
   min-width: 88px;
 }
 .bk-modal-ctx {

package/lib/shared/index.d.ts

@@ -28,8 +28,6 @@ export * from './dom';
 export * from './helper';
 export * from './hooks/use-form';
 export * from './hooks/use-form-item';
-export * from './mask-manager';
-export * from './pop-manager';
 export * from './popover';
 export * from './scrollbar-width';
 export * from './token';