bkui-vue 0.0.1-beta.367 → 0.0.1-beta.368

package/lib/input/input.variable.css

@@ -158,7 +158,7 @@
 .bk-popper.light {
   color: #63656e;
   background: #fff;
-  box-shadow: #dcdee5 0px 0px 6px 0px;
+  box-shadow: #dcdee5 0 0 6px 0;
 }
 .bk-popper .bk-popper-arrow,
 .bk-popper .bk-popper-arrow::before {
@@ -194,24 +194,23 @@
   display: inline-flex;
   width: 100%;
   min-height: 70px;
-  font-size: var(--font-size-base);
+  font-size: 12px;
   line-height: 20px;
-  color: var(--input-color);
+  color: #63656e;
   background-color: white;
-  border: var(--border-width-base) var(--border-style-base) var(--input-border-color);
+  border: 1px solid #c4c6cc;
   border-radius: 2px;
-  border-radius: var(--border-radius-base);
   box-sizing: border-box;
   transition: all 0.3s;
   flex-direction: column;
 }
 .bk-textarea ::placeholder {
-  color: var(--light-gray);
+  color: #c4c6cc;
 }
 .bk-textarea.is-disabled,
 .bk-textarea.is-readonly {
-  background-color: var(--input-disabled-bg);
-  border-color: var(--disable-color);
+  background-color: #fafbfd;
+  border-color: #dcdee5;
 }
 .bk-textarea.is-disabled .bk-input--prefix-area,
 .bk-textarea.is-readonly .bk-input--prefix-area,
@@ -220,14 +219,14 @@
 .bk-textarea.is-disabled .bk-input--suffix-icon,
 .bk-textarea.is-readonly .bk-input--suffix-icon {
   cursor: not-allowed;
-  background-color: var(--input-disabled-bg);
+  background-color: #fafbfd;
 }
 .bk-textarea.is-disabled input,
 .bk-textarea.is-readonly input,
 .bk-textarea.is-disabled textarea,
 .bk-textarea.is-readonly textarea {
   cursor: not-allowed;
-  background-color: var(--input-disabled-bg);
+  background-color: #fafbfd;
   opacity: 1;
 }
 .bk-textarea.is-readonly input,
@@ -245,7 +244,7 @@
   resize: none;
 }
 .bk-textarea--max-length {
-  padding-right: var(--input-horizontal-padding);
+  padding-right: 10px;
   margin: 0;
   margin-left: auto;
   font-size: 12px;
@@ -254,30 +253,30 @@
   justify-content: flex-end;
 }
 .bk-textarea--max-length span {
-  color: var(--input-maxlength-color);
+  color: #979ba5;
 }
 .bk-textarea.is-focused:not(.is-readonly) {
-  border-color: var(--primary-color);
+  border-color: #3a84ff;
   outline: 0;
-  box-shadow: 0px 0px 3px 0px var(--input-shadow-color);
+  box-shadow: 0px 0px 3px 0px #a3c5fd;
 }
 .bk-input {
   display: inline-flex;
   align-items: stretch;
   width: 100%;
-  height: var(--input-height-base);
-  font-size: var(--font-size-base);
-  border: var(--border-width-base) var(--border-style-base) var(--input-border-color);
-  border-radius: var(--border-radius-base);
+  height: 32px;
+  font-size: 12px;
+  border: 1px solid #c4c6cc;
+  border-radius: 2px;
   transition: all 0.3s;
 }
 .bk-input ::placeholder {
-  color: var(--light-gray);
+  color: #c4c6cc;
 }
 .bk-input.is-disabled,
 .bk-input.is-readonly {
-  background-color: var(--input-disabled-bg);
-  border-color: var(--disable-color);
+  background-color: #fafbfd;
+  border-color: #dcdee5;
 }
 .bk-input.is-disabled .bk-input--prefix-area,
 .bk-input.is-readonly .bk-input--prefix-area,
@@ -286,14 +285,14 @@
 .bk-input.is-disabled .bk-input--suffix-icon,
 .bk-input.is-readonly .bk-input--suffix-icon {
   cursor: not-allowed;
-  background-color: var(--input-disabled-bg);
+  background-color: #fafbfd;
 }
 .bk-input.is-disabled input,
 .bk-input.is-readonly input,
 .bk-input.is-disabled textarea,
 .bk-input.is-readonly textarea {
   cursor: not-allowed;
-  background-color: var(--input-disabled-bg);
+  background-color: #fafbfd;
   opacity: 1;
 }
 .bk-input.is-readonly input,
@@ -301,7 +300,7 @@
   cursor: auto;
 }
 .bk-input:hover:not(.is-disabled) {
-  border-color: var(--gray-color);
+  border-color: #979ba5;
 }
 .bk-input:hover:not(.is-disabled) .show-clear-only-hover {
   display: flex;
@@ -309,25 +308,25 @@
 .bk-input.is-simplicity {
   background-color: transparent;
   border-color: transparent;
-  border-bottom-color: var(--input-border-color);
+  border-bottom-color: #c4c6cc;
 }
 .bk-input.is-simplicity:hover:not(.is-disabled) {
-  background-color: var(--input-block-color);
+  background-color: #f5f7fa;
   border-color: transparent;
-  border-bottom-color: var(--light-gray);
+  border-bottom-color: #c4c6cc;
   box-shadow: none;
 }
 .bk-input.is-simplicity:hover:not(.is-disabled) .bk-input--text,
 .bk-input.is-simplicity:hover:not(.is-disabled) .bk-input--suffix-icon {
-  background-color: var(--input-block-color);
+  background-color: #f5f7fa;
 }
 .bk-input--suffix-icon {
   display: flex;
   height: 100%;
-  padding-right: var(--input-horizontal-padding);
-  font-size: var(--input-icon-size);
-  color: var(--light-gray);
-  background-color: var(--input-bg);
+  padding-right: 10px;
+  font-size: 14px;
+  color: #c4c6cc;
+  background-color: white;
   align-items: center;
   align-self: center;
 }
@@ -338,73 +337,73 @@
   cursor: pointer;
 }
 .bk-input--clear-icon:hover {
-  color: var(--gray-color);
+  color: #979ba5;
 }
 .bk-input--large {
-  height: var(--component-size-large);
-  font-size: var(--font-size-medium);
+  height: 40px;
+  font-size: 14px;
 }
 .bk-input--large .bk-input--max-length {
-  font-size: var(--font-size-large);
+  font-size: 16px;
 }
 .bk-input--large .bk-input--number-control span:first-child {
   margin-bottom: 4px;
 }
 .bk-input--small {
-  height: var(--component-size-small);
-  font-size: var(--font-size-base);
+  height: 26px;
+  font-size: 12px;
 }
 .bk-input--small .bk-input--max-length {
-  font-size: var(--font-size-base);
+  font-size: 12px;
 }
 .bk-input--default {
-  font-size: var(--font-size-base);
+  font-size: 12px;
 }
 .bk-input--default .bk-input--max-length {
-  font-size: var(--font-size-base);
+  font-size: 12px;
 }
 .bk-input.is-focused:not(.is-readonly) {
-  border-color: var(--primary-color);
+  border-color: #3a84ff;
   outline: 0;
-  box-shadow: 0px 0px 3px 0px var(--input-shadow-color);
+  box-shadow: 0px 0px 3px 0px #a3c5fd;
 }
 .bk-input.is-focused:not(.is-readonly).is-simplicity {
   border-color: transparent;
-  border-bottom-color: var(--primary-color);
+  border-bottom-color: #3a84ff;
   box-shadow: none;
 }
 .bk-input.is-focused:not(.is-readonly).is-simplicity .bk-input--text,
 .bk-input.is-focused:not(.is-readonly).is-simplicity .bk-input--suffix-icon {
-  background-color: var(--input-block-color);
+  background-color: #f5f7fa;
 }
 .bk-input--prefix-area,
 .bk-input--suffix-area {
   display: flex;
-  padding: 0 var(--input-horizontal-padding);
-  color: var(--default-color);
-  background-color: var(--input-block-color);
-  border-right: 1px solid var(--input-border-color);
+  padding: 0 10px;
+  color: #63656e;
+  background-color: #f5f7fa;
+  border-right: 1px solid #c4c6cc;
   align-items: center;
 }
 .bk-input--suffix-area {
   border: 0;
-  border-left: 1px solid var(--input-border-color);
+  border-left: 1px solid #c4c6cc;
 }
 .bk-input--max-length {
   align-self: center;
-  padding-right: var(--input-horizontal-padding);
+  padding-right: 10px;
   font-size: 12px;
   transform: scale(0.8);
 }
 .bk-input--max-length span {
-  color: var(--input-maxlength-color);
+  color: #979ba5;
 }
 .bk-input--text {
   width: 100%;
-  padding: 0 var(--input-horizontal-padding);
+  padding: 0 10px;
   line-height: 1;
-  color: var(--input-color);
-  background-color: var(--input-bg);
+  color: #63656e;
+  background-color: white;
   background-image: none;
   border: none;
   outline: none;
@@ -434,7 +433,7 @@
   appearance: none;
 }
 .bk-input--text::placeholder {
-  color: var(--light-gray);
+  color: #c4c6cc;
 }
 .bk-input--number-control {
   display: flex;
@@ -450,23 +449,23 @@
   display: flex;
   overflow: hidden;
   line-height: 1;
-  color: var(--gray-color);
+  color: #979ba5;
   text-align: center;
   cursor: pointer;
-  background-color: var(--input-block-color);
+  background-color: #f5f7fa;
   flex: 1;
   align-items: center;
 }
 .bk-input--number-control span.is-disabled {
-  color: var(--light-gray);
+  color: #c4c6cc;
   cursor: not-allowed;
 }
 .bk-input--number-control svg {
-  font-size: var(--input-icon-size);
+  font-size: 14px;
 }
 .bk-input--number-control span:first-child {
   transform: rotate(180deg);
 }
 .bk-input--number-control span:not(.is-disabled):hover {
-  background-color: var(--input-block-hover-color);
+  background-color: #eaebf0;
 }

package/lib/loading/loading.css

@@ -38,7 +38,7 @@
 .bk-popper.light {
   color: #63656e;
   background: #fff;
-  box-shadow: #dcdee5 0px 0px 6px 0px;
+  box-shadow: #dcdee5 0 0 6px 0;
 }
 .bk-popper .bk-popper-arrow,
 .bk-popper .bk-popper-arrow::before {

package/lib/loading/loading.variable.css

@@ -158,7 +158,7 @@
 .bk-popper.light {
   color: #63656e;
   background: #fff;
-  box-shadow: #dcdee5 0px 0px 6px 0px;
+  box-shadow: #dcdee5 0 0 6px 0;
 }
 .bk-popper .bk-popper-arrow,
 .bk-popper .bk-popper-arrow::before {
@@ -227,7 +227,7 @@
   position: absolute;
   width: 6px;
   height: 8px;
-  background-color: var(--default-color);
+  background-color: #63656e;
   border-radius: 8px;
   animation-duration: 1.2s;
   animation-iteration-count: infinite;
@@ -251,7 +251,7 @@
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-2,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-3,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-4 {
-  background-color: var(--success-color);
+  background-color: #2dcb56;
 }
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .oval,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot,
@@ -259,7 +259,7 @@
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-2,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-3,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-4 {
-  background-color: var(--danger-color);
+  background-color: #ea3636;
 }
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .oval,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot,
@@ -267,7 +267,7 @@
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-2,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-3,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-4 {
-  background-color: var(--warning-color);
+  background-color: #ff9c01;
 }
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .oval,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot,
@@ -275,7 +275,7 @@
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-2,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-3,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-4 {
-  background-color: var(--primary-color);
+  background-color: #3a84ff;
 }
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .oval,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot,
@@ -283,7 +283,7 @@
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-2,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-3,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-4 {
-  background-color: var(--white-color);
+  background-color: white;
 }
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .oval,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot,
@@ -291,22 +291,22 @@
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-2,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-3,
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-4 {
-  background-color: var(--light-gray);
+  background-color: #c4c6cc;
 }
 .bk-loading-wrapper .bk-loading-indicator .dot-1 {
-  background-color: var(--danger-color);
+  background-color: #ea3636;
   animation-delay: 0.1s;
 }
 .bk-loading-wrapper .bk-loading-indicator .dot-2 {
-  background-color: var(--warning-color);
+  background-color: #ff9c01;
   animation-delay: 0.25s;
 }
 .bk-loading-wrapper .bk-loading-indicator .dot-3 {
-  background-color: var(--success-color);
+  background-color: #2dcb56;
   animation-delay: 0.4s;
 }
 .bk-loading-wrapper .bk-loading-indicator .dot-4 {
-  background-color: var(--primary-color);
+  background-color: #3a84ff;
   animation-delay: 0.55s;
   margin-right: 0px;
 }
@@ -371,7 +371,7 @@
   transform-origin: center 8px;
 }
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .bk-loading-title {
-  font-size: var(--font-size-medium);
+  font-size: 14px;
 }
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .bk-spin-indicator {
   height: 22px;
@@ -392,7 +392,7 @@
   transform-origin: center 11px;
 }
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .bk-loading-title {
-  font-size: var(--font-size-base);
+  font-size: 12px;
 }
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .bk-spin-indicator {
   height: 52px;
@@ -413,12 +413,12 @@
   transform-origin: center 26px;
 }
 .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .bk-loading-title {
-  font-size: var(--font-size-medium);
+  font-size: 14px;
 }
 .bk-loading-wrapper .bk-loading-indicator .bk-loading-title {
   margin-top: 8px;
-  font-size: var(--font-size-medium);
+  font-size: 14px;
   line-height: normal;
-  color: var(--default-color);
+  color: #63656e;
   text-align: center;
 }

package/lib/menu/menu.css

@@ -38,7 +38,7 @@
 .bk-popper.light {
   color: #63656e;
   background: #fff;
-  box-shadow: #dcdee5 0px 0px 6px 0px;
+  box-shadow: #dcdee5 0 0 6px 0;
 }
 .bk-popper .bk-popper-arrow,
 .bk-popper .bk-popper-arrow::before {

package/lib/menu/menu.variable.css

@@ -158,7 +158,7 @@
 .bk-popper.light {
   color: #63656e;
   background: #fff;
-  box-shadow: #dcdee5 0px 0px 6px 0px;
+  box-shadow: #dcdee5 0 0 6px 0;
 }
 .bk-popper .bk-popper-arrow,
 .bk-popper .bk-popper-arrow::before {
@@ -191,20 +191,20 @@
   left: -4px;
 }
 .collapse {
-  width: var(--menu-collapse-width);
+  width: 60px;
 }
 .open {
-  background: var(--submenu-bg-color);
+  background: #151d2c;
 }
 .bk-menu {
   display: flex;
-  width: var(--menu-width);
-  background-color: var(--menu-bg-color);
+  width: 260px;
+  background-color: #182132;
   flex-direction: column;
   transition: width 0.3s ease-out;
 }
 .bk-menu.is-collapse {
-  width: var(--menu-collapse-width);
+  width: 60px;
 }
 .bk-menu-submenu {
   display: flex;
@@ -216,10 +216,10 @@
   transition: width 0.3s ease-out;
 }
 .bk-menu-submenu.is-opened {
-  background: var(--submenu-bg-color);
+  background: #151d2c;
 }
 .bk-menu-submenu:hover {
-  color: var(--menu-active-color);
+  color: white;
   cursor: pointer;
 }
 .bk-menu-submenu .submenu-header {
@@ -229,14 +229,14 @@
   align-items: center;
 }
 .bk-menu-submenu .submenu-header.is-collapse {
-  color: var(--menu-active-color);
-  background: var(--menu-active-bg-color);
+  color: white;
+  background: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
 }
 .bk-menu-submenu .submenu-header-icon {
   display: flex;
   height: 100%;
   font-size: 18px;
-  flex: 0 0 var(--menu-collapse-width);
+  flex: 0 0 60px;
   align-items: center;
   justify-content: center;
 }
@@ -289,25 +289,25 @@
   margin: 2px 0;
   overflow: hidden;
   font-size: 14px;
-  color: var(--menu-color);
+  color: #96a2b9;
   text-overflow: clip;
   white-space: nowrap;
   align-items: center;
   transition: width 0.3s ease-in-out;
 }
 .bk-menu-item:hover {
-  color: var(--menu-active-color);
+  color: white;
   cursor: pointer;
 }
 .bk-menu-item.is-active {
-  color: var(--menu-active-color);
-  background: var(--menu-active-bg-color);
+  color: white;
+  background: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
 }
 .bk-menu-item .item-icon {
   display: flex;
   height: 100%;
   font-size: 18px;
-  flex: 0 0 var(--menu-collapse-width);
+  flex: 0 0 60px;
   align-items: center;
   justify-content: center;
 }
@@ -315,8 +315,8 @@
   display: inline-block;
   width: 3px;
   height: 3px;
-  background: var(--menu-group-color);
-  background-color: var(--menu-active-color);
+  background: #63656e;
+  background-color: white;
   border-radius: 50%;
 }
 .bk-menu-item .item-content {
@@ -336,7 +336,7 @@
   overflow: hidden;
   font-size: 12px;
   line-height: 16px;
-  color: var(--menu-group-color);
+  color: #63656e;
   text-overflow: clip;
   white-space: nowrap;
   flex-wrap: nowrap;

package/lib/modal/index.js

@@ -1 +1 @@
-!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.bool.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}},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",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 t=this;e?(o.bkPopIndexManager.onMaskClick((function(e){t.handleClickOutSide()}),this.$el),this.$nextTick((function(){var e=t.showMask?{}:{"background-color":"rgba(0,0,0,0)"};o.bkPopIndexManager.show(t.$el,t.showMask,e,t.transfer,t.zIndex),t.$emit("shown")}))):(null===o.bkPopIndexManager||void 0===o.bkPopIndexManager||o.bkPopIndexManager.hide(this.$el,this.transfer),null===o.bkPopIndexManager||void 0===o.bkPopIndexManager||o.bkPopIndexManager.destroy())},immediate:!0}},beforeUnmount:function(){this.visible&&(null===o.bkPopIndexManager||void 0===o.bkPopIndexManager||o.bkPopIndexManager.hide(this.$el),null===o.bkPopIndexManager||void 0===o.bkPopIndexManager||o.bkPopIndexManager.destroy())},methods:{handleClickOutSide:function(){this.quickClose&&(this.$emit("close"),this.$emit("quick-close",this.$el),this.$emit("quickClose",this.$el))}},render:function(){var e,o,i,s,r,n,l,a,d,p,c,h,u=this,f=this.maxHeight?{maxHeight:this.maxHeight}:{},y="bk-modal-body ".concat("slide"===this.animateType?this.direction:"");return(0,t.createVNode)("div",{class:["bk-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[u.isShow?(0,t.createVNode)("div",{class:y},[(0,t.createVNode)("div",{class:"bk-modal-header"},[null!==(i=null===(o=(e=u.$slots).header)||void 0===o?void 0:o.call(e))&&void 0!==i?i:""]),(0,t.createVNode)("div",{class:"bk-modal-content",style:["show"===u.dialogType?"padding-bottom: 20px":"",Object.assign({},f)]},[null!==(n=null===(r=(s=u.$slots).default)||void 0===r?void 0:r.call(s))&&void 0!==n?n:""]),"show"===u.dialogType?"":(0,t.createVNode)("div",{class:"bk-modal-footer"},[null!==(d=null===(a=(l=u.$slots).footer)||void 0===a?void 0:a.call(l))&&void 0!==d?d:""]),(0,t.createVNode)("div",{class:["bk-modal-close",u.closeIcon?"":"close-icon"]},[null!==(h=null===(c=(p=u.$slots).close)||void 0===c?void 0:c.call(p))&&void 0!==h?h:""])]):""]}})])}});var a=(0,o.withInstallProps)(l,{propsMixin:s},!0);const d=a})(),n})()));
+!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.bool.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}},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",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 t=this;e?(o.bkPopIndexManager.onMaskClick((function(e){t.handleClickOutSide()}),this.$el),this.$nextTick((function(){var e=t.showMask?{}:{"background-color":"rgba(0,0,0,0)"};o.bkPopIndexManager.show(t.$el,t.showMask,e,t.transfer,t.zIndex),t.$emit("shown")}))):(null===o.bkPopIndexManager||void 0===o.bkPopIndexManager||o.bkPopIndexManager.hide(this.$el,this.transfer),null===o.bkPopIndexManager||void 0===o.bkPopIndexManager||o.bkPopIndexManager.destroy())},immediate:!0}},beforeUnmount:function(){this.visible&&(null===o.bkPopIndexManager||void 0===o.bkPopIndexManager||o.bkPopIndexManager.hide(this.$el),null===o.bkPopIndexManager||void 0===o.bkPopIndexManager||o.bkPopIndexManager.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}:{},y="".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:y},[(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.less

@@ -1,6 +1,7 @@
+@import '../styles/themes/themes.less';
 @import '../info-box/info-box.less';
 
-.bk-modal-wrapper {
+.@{bk-prefix}-modal-wrapper {
   position: absolute;
   top: 50%;
   left: 50%;
@@ -9,7 +10,7 @@
   // background: #fff;
   transform: translate(-50%, -50%);
 
-  .bk-modal-outside {
+  .@{bk-prefix}-modal-outside {
     position: fixed;
     top: 0;
     right: 0;
@@ -37,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);