bkui-vue 0.0.1-beta.98 → 0.0.1

package/lib/modal/index.js

@@ -1 +1 @@
-!function(e,o){if("object"==typeof exports&&"object"==typeof module)module.exports=o(require("../shared"),require("vue"));else if("function"==typeof define&&define.amd)define(["../shared","vue"],o);else{var t="object"==typeof exports?o(require("../shared"),require("vue")):o(e["../shared"],e.vue);for(var i in t)("object"==typeof exports?exports:e)[i]=t[i]}}(self,((e,o)=>(()=>{"use strict";var t={4212:o=>{o.exports=e},748:e=>{e.exports=o}},i={};function s(e){var o=i[e];if(void 0!==o)return o.exports;var r=i[e]={exports:{}};return t[e](r,r.exports,s),r.exports}s.d=(e,o)=>{for(var t in o)s.o(o,t)&&!s.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:o[t]})},s.o=(e,o)=>Object.prototype.hasOwnProperty.call(e,o),s.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var r={};return(()=>{s.r(r),s.d(r,{BkModal:()=>n,default:()=>a,propsMixin:()=>t});var e=s(4212),o=s(748),t={isShow:e.PropTypes.bool.def(!1),width:e.PropTypes.oneOfType([String,Number]).def("50%"),height:e.PropTypes.oneOfType([String,Number]).def("50%"),customClass:e.PropTypes.string||e.PropTypes.array,scrollable:e.PropTypes.bool.def(!0),showMask:e.PropTypes.bool.def(!0),closeIcon:e.PropTypes.bool.def(!0),escClose:e.PropTypes.bool.def(!0),maskClose:e.PropTypes.bool.def(!0),fullscreen:e.PropTypes.bool.def(!1),extCls:e.PropTypes.string.def(""),size:e.PropTypes.commonType(["normal","small","medium","large"],"size").def("normal"),draggable:e.PropTypes.bool.def(!0),quickClose:e.PropTypes.bool.def(!0),transfer:e.PropTypes.bool.def(!1),maxHeight:e.PropTypes.string,direction:e.PropTypes.string,animateType:e.PropTypes.string.def("slide"),renderDirective:e.PropTypes.commonType(["show","if"],"renderDirective").def("show"),beforeClose:e.PropTypes.custom((function(){return!0})),dialogType:e.PropTypes.commonType(["show","operation","confirm","process"],"dialogType").def("operation"),multiInstance:e.PropTypes.bool.def(!0)};const i=(0,o.defineComponent)({name:"Modal",props:Object.assign({},t),data:function(){return{visible:!1}},computed:{dialogWidth:function(){return/^\d+$/.test("".concat(this.width))?"".concat(this.width,"px"):this.width},dialogHeight:function(){return/^\d+$/.test("".concat(this.height))?"".concat(this.height,"px"):this.height},compStyle:function(){return{width:this.dialogWidth,height:this.dialogHeight,minHeigth:"".concat(200,"px"),display:this.visible?"inherit":"none"}}},watch:{isShow:{handler:function(e){var o=this;e?this.visible=e:(this.$emit("hidden"),setTimeout((function(){o.visible=e}),250))},deep:!0},visible:function(o){var t=this;o?this.$nextTick((function(){var o=t.showMask?{}:{"background-color":"rgba(0,0,0,0)"};e.bkPopIndexManager.show(t.$el,t.showMask,o,t.transfer),t.$emit("shown")})):e.bkPopIndexManager.hide(this.$el,this.transfer)}},beforeUnmount:function(){e.bkPopIndexManager.hide(this.$el)},methods:{handleClickOutSide:function(){this.quickClose&&this.$emit("close")}},render:function(){var e,t,i,s,r,n,a,l,d,p=this,c=this.maxHeight?{maxHeight:this.maxHeight}:{},h="bk-modal-body ".concat("slide"===this.animateType?this.direction:"");return(0,o.createVNode)("div",{class:["bk-modal-wrapper",this.customClass],style:this.compStyle},[(0,o.withDirectives)((0,o.createVNode)("div",{class:"bk-modal-outside",onClick:this.handleClickOutSide},null),[[o.vShow,this.isShow]]),(0,o.createVNode)(o.Transition,{name:this.animateType},{default:function(){return[p.isShow?(0,o.createVNode)("div",{class:h},[(0,o.createVNode)("div",{class:"bk-modal-header"},[null!==(i=null===(t=(e=p.$slots).header)||void 0===t?void 0:t.call(e))&&void 0!==i?i:""]),(0,o.createVNode)("div",{class:"bk-modal-content",style:["show"===p.dialogType?"height: calc(100% - 74px);margin-bottom: 0px":"",Object.assign({},c)]},[null!==(n=null===(r=(s=p.$slots).default)||void 0===r?void 0:r.call(s))&&void 0!==n?n:""]),"show"===p.dialogType?"":(0,o.createVNode)("div",{class:"bk-modal-footer"},[null!==(d=null===(l=(a=p.$slots).footer)||void 0===l?void 0:l.call(a))&&void 0!==d?d:""])]):""]}})])}});var n=(0,e.withInstallProps)(i,{propsMixin:t},!0);const a=n})(),r})()));
+!function(e,o){if("object"==typeof exports&&"object"==typeof module)module.exports=o(require("../shared"),require("vue"),require("vue-types"));else if("function"==typeof define&&define.amd)define(["../shared","vue","vue-types"],o);else{var t="object"==typeof exports?o(require("../shared"),require("vue"),require("vue-types")):o(e["../shared"],e.vue,e["vue-types"]);for(var i in t)("object"==typeof exports?exports:e)[i]=t[i]}}(self,((e,o,t)=>(()=>{"use strict";var i={4212:o=>{o.exports=e},748:e=>{e.exports=o},210:e=>{e.exports=t}},s={};function r(e){var o=s[e];if(void 0!==o)return o.exports;var t=s[e]={exports:{}};return i[e](t,t.exports,r),t.exports}r.d=(e,o)=>{for(var t in o)r.o(o,t)&&!r.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:o[t]})},r.o=(e,o)=>Object.prototype.hasOwnProperty.call(e,o),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};return(()=>{r.r(n),r.d(n,{BkModal:()=>a,default:()=>d,propsMixin:()=>s});var e,o=r(4212),t=r(748),i=r(210);!function(e){e.NORMAL="normal",e.SMALL="small",e.MEDIUM="medium",e.LARGE="large"}(e||(e={}));var s={isShow:o.PropTypes.bool.def(!1),width:o.PropTypes.oneOfType([String,Number]).def("50%"),height:o.PropTypes.oneOfType([String,Number]).def("50%"),extCls:o.PropTypes.string||o.PropTypes.array,scrollable:o.PropTypes.bool.def(!0),showMask:o.PropTypes.bool.def(!0),closeIcon:o.PropTypes.bool.def(!0),escClose:o.PropTypes.bool.def(!0),fullscreen:o.PropTypes.bool.def(!1),size:(0,i.toType)("size",{}),draggable:o.PropTypes.bool.def(!0),quickClose:o.PropTypes.bool.def(!0),transfer:o.PropTypes.oneOfType([Boolean,String,HTMLElement]).def(!1),zIndex:o.PropTypes.oneOfType([String,Number]).def("inherit"),maxHeight:o.PropTypes.string,direction:o.PropTypes.string,title:o.PropTypes.string.def(""),animateType:o.PropTypes.string.def("slide"),renderDirective:(0,o.renderDirectiveType)(),beforeClose:o.PropTypes.custom((function(){return!0})),dialogType:(0,o.dialogTypeUnion)(),multiInstance:o.PropTypes.bool.def(!0),infoType:o.PropTypes.theme()};const l=(0,t.defineComponent)({name:"Modal",props:Object.assign({},s),emits:["quick-close","quickClose","hidden","shown","close"],data:function(){return{visible:!1,closeTimer:null,bkPopIndexManager:null}},computed:{dialogWidth:function(){return/^\d+\.?\d*$/.test("".concat(this.width))?"".concat(this.width,"px"):this.width},dialogHeight:function(){return/^\d+\.?\d*$/.test("".concat(this.height))?"".concat(this.height,"px"):this.height},compStyle:function(){return{width:this.dialogWidth,height:this.dialogHeight,minHeigth:"".concat(200,"px"),display:this.visible?"inherit":"none",zIndex:this.zIndex||"inherit"}},fullscreenStyle:function(){return{width:"".concat(100,"%"),height:"".concat(100,"%")}}},watch:{isShow:{handler:function(e){var o=this;e?(this.closeTimer&&clearTimeout(this.closeTimer),this.closeTimer=null,this.visible=e):this.closeTimer=setTimeout((function(){o.$emit("hidden"),o.visible=e}),250)},immediate:!0},visible:{handler:function(e){var o,t,i=this;e?this.$nextTick((function(){i.bkPopIndexManager.onMaskClick((function(e){i.handleClickOutSide()}),i.$el);var e=i.showMask?{}:{"background-color":"rgba(0,0,0,0)"};i.bkPopIndexManager.show(i.$el,i.showMask,e,!!i.transfer,i.zIndex),i.$emit("shown")})):(null===(o=this.bkPopIndexManager)||void 0===o||o.hide(this.$el,!!this.transfer),null===(t=this.bkPopIndexManager)||void 0===t||t.destroy())},immediate:!0}},created:function(){},mounted:function(){var e,t=Object.assign(Object.assign({},this.$props),{transfer:"parent"===this.transfer?null===(e=this.$el)||void 0===e?void 0:e.parentElement:this.transfer});this.bkPopIndexManager=new o.BKPopIndexManager(t)},beforeUnmount:function(){var e,o;this.visible&&(null===(e=this.bkPopIndexManager)||void 0===e||e.hide(this.$el),null===(o=this.bkPopIndexManager)||void 0===o||o.destroy())},methods:{handleClickOutSide:function(){this.quickClose&&(this.$emit("close"),this.$emit("quick-close",this.$el),this.$emit("quickClose",this.$el))}},render:function(){var e,i,s,r,n,l,a,d,c,p,h,u,f=this,m=this.maxHeight?{maxHeight:this.maxHeight}:{},v="".concat((0,o.resolveClassName)("modal-body")," ").concat("slide"===this.animateType?this.direction:"");return(0,t.createVNode)("div",{class:[(0,o.resolveClassName)("modal-wrapper"),this.extCls,this.size,this.fullscreen?"fullscreen":""],style:[this.compStyle,this.fullscreen?this.fullscreenStyle:""]},[(0,t.createVNode)(t.Transition,{name:this.animateType},{default:function(){return[f.isShow?(0,t.createVNode)("div",{class:v},[(0,t.createVNode)("div",{class:(0,o.resolveClassName)("modal-header")},[null!==(s=null===(i=(e=f.$slots).header)||void 0===i?void 0:i.call(e))&&void 0!==s?s:""]),(0,t.createVNode)("div",{class:(0,o.resolveClassName)("modal-content"),style:["show"===f.dialogType?"padding-bottom: 20px":"",Object.assign({},m)]},[null!==(l=null===(n=(r=f.$slots).default)||void 0===n?void 0:n.call(r))&&void 0!==l?l:""]),"show"===f.dialogType?"":(0,t.createVNode)("div",{class:(0,o.resolveClassName)("modal-footer")},[null!==(c=null===(d=(a=f.$slots).footer)||void 0===d?void 0:d.call(a))&&void 0!==c?c:""]),(0,t.createVNode)("div",{class:[(0,o.resolveClassName)("modal-close"),f.closeIcon?"":"close-icon"]},[null!==(u=null===(h=(p=f.$slots).close)||void 0===h?void 0:h.call(p))&&void 0!==u?u:""])]):""]}})])}});var a=(0,o.withInstallProps)(l,{propsMixin:s},!0);const d=a})(),n})()));

package/lib/modal/modal.css

@@ -1,7 +1,46 @@
+.bk-modal-wrapper.bk-info-wrapper {
+  width: 440px;
+}
+.bk-modal-wrapper.bk-info-wrapper.normal {
+  width: 440px;
+}
+.bk-modal-wrapper.bk-info-wrapper.small {
+  width: 400px;
+}
+.bk-modal-wrapper.bk-info-wrapper .bk-modal-body {
+  border-radius: 2px;
+}
+.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header {
+  padding: 24px 24px 0;
+}
+.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header .bk-dialog-title {
+  height: 27px;
+  margin: 15px 0 10px;
+}
+.bk-modal-wrapper.bk-info-wrapper .bk-modal-content {
+  height: 100%;
+  max-height: 100%;
+  min-height: 100%;
+  padding: 0 50px 10px;
+}
+.bk-modal-wrapper.bk-info-wrapper .bk-modal-content .bk-info-sub-title {
+  margin-bottom: 10px;
+  text-align: center;
+}
+.bk-modal-wrapper.bk-info-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 {
+  min-width: 88px;
+}
 .bk-modal-wrapper {
   position: absolute;
   top: 50%;
   left: 50%;
+  width: 480px;
+  border-radius: 2px;
   transform: translate(-50%, -50%);
 }
 .bk-modal-wrapper .bk-modal-outside {
@@ -11,12 +50,6 @@
   bottom: 0;
   left: 0;
 }
-.bk-modal-wrapper.bk-model-fullscreen {
-  width: 100%;
-  height: 100%;
-  background: #fff;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
-}
 .bk-modal-wrapper.normal {
   width: 480px;
   height: 240px;

package/lib/modal/modal.d.ts

@@ -10,7 +10,7 @@ declare const _default: import("vue").DefineComponent<{
     height: import("vue-types").VueTypeDef<string | number> & {
         default: string | number;
     };
-    customClass: (import("vue-types").VueTypeValidableDef<string> & {
+    extCls: (import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     }) | (import("vue-types").VueTypeValidableDef<unknown[]> & {
         default: () => unknown[];
@@ -35,24 +35,12 @@ declare const _default: import("vue").DefineComponent<{
     } & {
         default: boolean;
     };
-    maskClose: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
     fullscreen: import("vue-types").VueTypeValidableDef<boolean> & {
         default: boolean;
     } & {
         default: boolean;
     };
-    extCls: import("vue-types").VueTypeValidableDef<string> & {
-        default: string;
-    } & {
-        default: string;
-    };
-    size: import("vue-types").VueTypeDef<string> & {
-        default: string;
-    };
+    size: import("vue-types").VueTypeDef<"small" | "medium" | "large" | "normal">;
     draggable: import("vue-types").VueTypeValidableDef<boolean> & {
         default: boolean;
     } & {
@@ -63,10 +51,11 @@ declare const _default: import("vue").DefineComponent<{
     } & {
         default: boolean;
     };
-    transfer: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
+    transfer: import("vue-types").VueTypeDef<string | boolean | HTMLElement> & {
+        default: string | boolean | (() => HTMLElement);
+    };
+    zIndex: import("vue-types").VueTypeDef<string | number> & {
+        default: string | number;
     };
     maxHeight: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
@@ -74,32 +63,39 @@ declare const _default: import("vue").DefineComponent<{
     direction: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     };
-    animateType: import("vue-types").VueTypeValidableDef<string> & {
+    title: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     } & {
         default: string;
     };
-    renderDirective: import("vue-types").VueTypeDef<string> & {
+    animateType: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
-    };
-    beforeClose: import("vue-types").VueTypeDef<unknown>;
-    dialogType: import("vue-types").VueTypeDef<string> & {
+    } & {
         default: string;
     };
+    renderDirective: import("vue-types").VueTypeValidableDef<"show" | "if"> & {
+        default: "show" | "if";
+    };
+    beforeClose: import("vue-types").VueTypeDef<unknown>;
+    dialogType: import("vue-types").VueTypeDef<"process" | "show" | "operation" | "confirm">;
     multiInstance: import("vue-types").VueTypeValidableDef<boolean> & {
         default: boolean;
     } & {
         default: boolean;
     };
+    infoType: import("vue-types").VueTypeDef<"success" | "warning" | "danger" | "primary">;
 }, unknown, {
     visible: boolean;
+    closeTimer: any;
+    bkPopIndexManager: any;
 }, {
     dialogWidth(): String | Number;
     dialogHeight(): String | Number;
     compStyle(): any;
+    fullscreenStyle(): any;
 }, {
     handleClickOutSide(): void;
-}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("close" | "shown" | "hidden" | "quick-close" | "quickClose")[], "close" | "shown" | "hidden" | "quick-close" | "quickClose", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     isShow: import("vue-types").VueTypeValidableDef<boolean> & {
         default: boolean;
     } & {
@@ -111,7 +107,7 @@ declare const _default: import("vue").DefineComponent<{
     height: import("vue-types").VueTypeDef<string | number> & {
         default: string | number;
     };
-    customClass: (import("vue-types").VueTypeValidableDef<string> & {
+    extCls: (import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     }) | (import("vue-types").VueTypeValidableDef<unknown[]> & {
         default: () => unknown[];
@@ -136,24 +132,12 @@ declare const _default: import("vue").DefineComponent<{
     } & {
         default: boolean;
     };
-    maskClose: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
     fullscreen: import("vue-types").VueTypeValidableDef<boolean> & {
         default: boolean;
     } & {
         default: boolean;
     };
-    extCls: import("vue-types").VueTypeValidableDef<string> & {
-        default: string;
-    } & {
-        default: string;
-    };
-    size: import("vue-types").VueTypeDef<string> & {
-        default: string;
-    };
+    size: import("vue-types").VueTypeDef<"small" | "medium" | "large" | "normal">;
     draggable: import("vue-types").VueTypeValidableDef<boolean> & {
         default: boolean;
     } & {
@@ -164,10 +148,11 @@ declare const _default: import("vue").DefineComponent<{
     } & {
         default: boolean;
     };
-    transfer: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
+    transfer: import("vue-types").VueTypeDef<string | boolean | HTMLElement> & {
+        default: string | boolean | (() => HTMLElement);
+    };
+    zIndex: import("vue-types").VueTypeDef<string | number> & {
+        default: string | number;
     };
     maxHeight: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
@@ -175,44 +160,52 @@ declare const _default: import("vue").DefineComponent<{
     direction: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     };
-    animateType: import("vue-types").VueTypeValidableDef<string> & {
+    title: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     } & {
         default: string;
     };
-    renderDirective: import("vue-types").VueTypeDef<string> & {
+    animateType: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
-    };
-    beforeClose: import("vue-types").VueTypeDef<unknown>;
-    dialogType: import("vue-types").VueTypeDef<string> & {
+    } & {
         default: string;
     };
+    renderDirective: import("vue-types").VueTypeValidableDef<"show" | "if"> & {
+        default: "show" | "if";
+    };
+    beforeClose: import("vue-types").VueTypeDef<unknown>;
+    dialogType: import("vue-types").VueTypeDef<"process" | "show" | "operation" | "confirm">;
     multiInstance: import("vue-types").VueTypeValidableDef<boolean> & {
         default: boolean;
     } & {
         default: boolean;
     };
-}>>, {
-    multiInstance: boolean;
-    showMask: boolean;
+    infoType: import("vue-types").VueTypeDef<"success" | "warning" | "danger" | "primary">;
+}>> & {
+    onClose?: (...args: any[]) => any;
+    onShown?: (...args: any[]) => any;
+    onHidden?: (...args: any[]) => any;
+    "onQuick-close"?: (...args: any[]) => any;
+    onQuickClose?: (...args: any[]) => any;
+}, {
+    title: string;
+    transfer: string | boolean | HTMLElement;
     width: string | number;
     height: string | number;
-    draggable: boolean;
-    size: string;
-    extCls: string;
-    direction: string;
     maxHeight: string;
+    extCls: string | unknown[];
     isShow: boolean;
-    transfer: boolean;
-    renderDirective: string;
-    dialogType: string;
-    customClass: string | unknown[];
+    zIndex: string | number;
+    draggable: boolean;
+    showMask: boolean;
+    multiInstance: boolean;
+    direction: string;
+    renderDirective: "show" | "if";
+    quickClose: boolean;
     scrollable: boolean;
     closeIcon: boolean;
     escClose: boolean;
-    maskClose: boolean;
     fullscreen: boolean;
-    quickClose: boolean;
     animateType: string;
-}>;
+}, {}>;
 export default _default;

package/lib/modal/modal.less

@@ -1,11 +1,16 @@
-.bk-modal-wrapper {
+@import '../styles/themes/themes.less';
+@import '../info-box/info-box.less';
+
+.@{bk-prefix}-modal-wrapper {
   position: absolute;
   top: 50%;
   left: 50%;
+  width: 480px;
+  border-radius: 2px;
   // background: #fff;
   transform: translate(-50%, -50%);
 
-  .bk-modal-outside {
+  .@{bk-prefix}-modal-outside {
     position: fixed;
     top: 0;
     right: 0;
@@ -13,13 +18,6 @@
     left: 0;
   }
 
-  &.bk-model-fullscreen {
-    width: 100%;
-    height: 100%;
-    background: #fff;
-    box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
-  }
-
   &.normal {
     width: 480px;
     height: 240px;
@@ -40,7 +38,7 @@
     height: 720px;
   }
 
-  .bk-modal-body {
+  .@{bk-prefix}-modal-body {
     height: 100%;
     background: #fff;
     box-shadow: 0 4px 12px rgba(0,0,0,.15);

package/lib/modal/modal.variable.css

@@ -1,7 +1,168 @@
+:root {
+  --bk-prefix: bk;
+  --popover-max-height: 216px;
+  --primary-color: #3a84ff;
+  --success-color: #2dcb56;
+  --warning-color: #ff9c01;
+  --danger-color: #ea3636;
+  --default-color: #63656e;
+  --gray-color: #979ba5;
+  --light-gray: #c4c6cc;
+  --white-color: white;
+  --whitesmoke-color: #fafbfd;
+  --disable-color: #dcdee5;
+  --font-size-base: 12px;
+  --font-size-medium: 14px;
+  --font-size-large: 16px;
+  --line-height-base: 16px;
+  --line-height-medium: 16px;
+  --line-height-large: 18px;
+  --component-size-small: 26px;
+  --component-size-base: 32px;
+  --component-size-large: 40px;
+  --border-width-base: 1px;
+  --border-style-base: solid;
+  --border-radius-base: 2px;
+  --border-style-color: var(--light-gray);
+  --input-disabled-bg: #fafbfd;
+  --input-disabled-border: var(--disable-color);
+  --input-height-base: var(--component-size-base);
+  --input-color: var(--default-color);
+  --input-bg: white;
+  --input-border-color: var(--light-gray);
+  --input-broder-radius: 3px;
+  --input-shadow-color: #a3c5fd;
+  --input-horizontal-padding: 10px;
+  --input-block-color: #f5f7fa;
+  --input-block-hover-color: #eaebf0;
+  --input-icon-size: var(--font-size-medium);
+  --input-maxlength-color: #979ba5;
+  --button-primary-hover-color: #5594fa;
+  --button-danger-hover-color: #ff5656;
+  --button-success-hover-color: #45e35f;
+  --button-warning-hover-color: #ffb848;
+  --button-default-hover-border-color: #979ba5;
+  --button-primary-active-color: #2c77f4;
+  --button-danger-active-color: #db2626;
+  --button-success-active-color: #1ab943;
+  --button-warning-active-color: #eb9000;
+  --button-selected-bg-color: #e1ecff;
+  --button-disabled-selected-bg-color: #f0f1f5;
+  --radio-font-color: #63656e;
+  --radio-active-color: #5594fa;
+  --radio-hover-border-color: #979ba5;
+  --radio-disabled-border: #dcdee5;
+  --radio-disabled-font-color: #c4c6cc;
+  --radio-disabled-checked-bg: #a3c5fd;
+  --radio-button-checked-bg: #e1ecff;
+  --radio-button-disabled-checked-bg: #fafbfd;
+  --checkbox-disabled-checked-bg: #a3c5fd;
+  --fixed-navbar-background: #fff;
+  --fixed-navbar-boxshadow-color: rgba(0, 0, 0, 0.1);
+  --switch-default-color: #fff;
+  --switch-grey-color: #c4c6cc;
+  --breadcrumb-black-color: #979ba5;
+  --breadcrumb-primary-hover-color: #0082ff;
+  --breadcrumb-fn-main-color: #63656e;
+  --link-default-hover-color: #979ba5;
+  --link-primary-hover-color: #699df4;
+  --link-success-hover-color: #45e35f;
+  --link-warning-hover-color: #ffb848;
+  --link-danger-hover-color: #ff5656;
+  --link-default-disabled-color: #dcdee5;
+  --link-primary-disabled-color: #a3c5fd;
+  --link-success-disabled-color: #94f5a4;
+  --link-warning-disabled-color: #ffd695;
+  --link-danger-disabled-color: #fd9c9c;
+  --message-color: var(--default-color);
+  --message-primary-bg-color: #f0f8ff;
+  --message-primary-border-color: #e1ecff;
+  --message-primary-shadow-color: #e1e8f4;
+  --message-warning-bg-color: #fff4e2;
+  --message-warning-border-color: #ffe8c3;
+  --message-warning-shadow-color: #ede6db;
+  --message-success-bg-color: #f2fff4;
+  --message-success-border-color: #dcffe2;
+  --message-success-shadow-color: #cef0d7;
+  --message-danger-bg-color: #ffeded;
+  --message-danger-border-color: #ffdddd;
+  --message-danger-shadow-color: #f6dada;
+  --slider-default-bg: #dcdee5;
+  --slider-disable-bar-bg: #979ba5;
+  --menu-bg-color: #182132;
+  --submenu-bg-color: #151d2c;
+  --menu-active-bg-color: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
+  --menu-color: #96a2b9;
+  --menu-group-color: var(--default-color);
+  --menu-width: 260px;
+  --menu-collapse-width: 60px;
+  --menu-active-color: white;
+  --nav-header-bg-color: #182132;
+  --nav-bg-color: #182132;
+  --date-picker-disabled-bg: #fafbfd;
+  --date-picker-dropdown-mb: 4px;
+  --date-picker-dropdown-bg: #fff;
+  --table-bg-color: var(--white-color);
+  --table-border-color: #dcdee5;
+  --table-head-bg-color: #fafbfd;
+  --table-head-font-color: #313238;
+  --table-body-font-color: #63656E;
+  --table-row-hover-bg-color: #f5f7fa;
+  --table-row-active-bg-color: #f0f1f5;
+  --cascader-panel-border-color: #dcdee5;
+  --cascader-panel-hover: #f5f7fa;
+  --cascader-panel-active: #e1ecff;
+  --cascader-panel-disabled-bg: #fff;
+  --search-select-focus-border-color: var(--primary-color);
+  --search-select-focus-color: #3c96ff;
+  --search-select-font-color: var(--default-color);
+  --search-select-placeholder-color: var(--light-gray);
+  --search-select-message-color: var(--danger-color);
+  --search-select-menu-border-color: var(--disable-color);
+}
+.bk-modal-wrapper.bk-info-wrapper {
+  width: 440px;
+}
+.bk-modal-wrapper.bk-info-wrapper.normal {
+  width: 440px;
+}
+.bk-modal-wrapper.bk-info-wrapper.small {
+  width: 400px;
+}
+.bk-modal-wrapper.bk-info-wrapper .bk-modal-body {
+  border-radius: 2px;
+}
+.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header {
+  padding: 24px 24px 0;
+}
+.bk-modal-wrapper.bk-info-wrapper .bk-dialog-header .bk-dialog-title {
+  height: 27px;
+  margin: 15px 0 10px;
+}
+.bk-modal-wrapper.bk-info-wrapper .bk-modal-content {
+  height: 100%;
+  max-height: 100%;
+  min-height: 100%;
+  padding: 0 50px 10px;
+}
+.bk-modal-wrapper.bk-info-wrapper .bk-modal-content .bk-info-sub-title {
+  margin-bottom: 10px;
+  text-align: center;
+}
+.bk-modal-wrapper.bk-info-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 {
+  min-width: 88px;
+}
 .bk-modal-wrapper {
   position: absolute;
   top: 50%;
   left: 50%;
+  width: 480px;
+  border-radius: 2px;
   transform: translate(-50%, -50%);
 }
 .bk-modal-wrapper .bk-modal-outside {
@@ -11,12 +172,6 @@
   bottom: 0;
   left: 0;
 }
-.bk-modal-wrapper.bk-model-fullscreen {
-  width: 100%;
-  height: 100%;
-  background: #fff;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
-}
 .bk-modal-wrapper.normal {
   width: 480px;
   height: 240px;

package/lib/modal/props.mixin.d.ts

@@ -10,7 +10,7 @@ export declare const propsMixin: {
     height: import("vue-types").VueTypeDef<string | number> & {
         default: string | number;
     };
-    customClass: (import("vue-types").VueTypeValidableDef<string> & {
+    extCls: (import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     }) | (import("vue-types").VueTypeValidableDef<unknown[]> & {
         default: () => unknown[];
@@ -35,24 +35,12 @@ export declare const propsMixin: {
     } & {
         default: boolean;
     };
-    maskClose: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
     fullscreen: import("vue-types").VueTypeValidableDef<boolean> & {
         default: boolean;
     } & {
         default: boolean;
     };
-    extCls: import("vue-types").VueTypeValidableDef<string> & {
-        default: string;
-    } & {
-        default: string;
-    };
-    size: import("vue-types").VueTypeDef<string> & {
-        default: string;
-    };
+    size: import("vue-types").VueTypeDef<"small" | "medium" | "large" | "normal">;
     draggable: import("vue-types").VueTypeValidableDef<boolean> & {
         default: boolean;
     } & {
@@ -63,10 +51,11 @@ export declare const propsMixin: {
     } & {
         default: boolean;
     };
-    transfer: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
+    transfer: import("vue-types").VueTypeDef<string | boolean | HTMLElement> & {
+        default: string | boolean | (() => HTMLElement);
+    };
+    zIndex: import("vue-types").VueTypeDef<string | number> & {
+        default: string | number;
     };
     maxHeight: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
@@ -74,21 +63,25 @@ export declare const propsMixin: {
     direction: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     };
-    animateType: import("vue-types").VueTypeValidableDef<string> & {
+    title: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     } & {
         default: string;
     };
-    renderDirective: import("vue-types").VueTypeDef<string> & {
+    animateType: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
-    };
-    beforeClose: import("vue-types").VueTypeDef<unknown>;
-    dialogType: import("vue-types").VueTypeDef<string> & {
+    } & {
         default: string;
     };
+    renderDirective: import("vue-types").VueTypeValidableDef<"show" | "if"> & {
+        default: "show" | "if";
+    };
+    beforeClose: import("vue-types").VueTypeDef<unknown>;
+    dialogType: import("vue-types").VueTypeDef<"process" | "show" | "operation" | "confirm">;
     multiInstance: import("vue-types").VueTypeValidableDef<boolean> & {
         default: boolean;
     } & {
         default: boolean;
     };
+    infoType: import("vue-types").VueTypeDef<"success" | "warning" | "danger" | "primary">;
 };