bkui-vue 2.0.2-beta.2 → 2.0.2-beta.21

package/lib/components.d.ts

@@ -32,9 +32,8 @@ export { default as Navigation } from './navigation';
 export { default as Notify } from './notify';
 export { default as OverflowTitle } from './overflow-title';
 export { default as Pagination } from './pagination';
-export { default as $bkPopover } from './plugin-popover';
 export { default as PopConfirm } from './pop-confirm';
-export { default as Popover } from './popover';
+export { default as Popover, $bkPopover } from './popover';
 export { default as Popover2 } from './popover2';
 export { default as Process } from './process';
 export { default as Progress } from './progress';

package/lib/components.js

@@ -56,9 +56,8 @@ export { default as Navigation } from './navigation';
 export { default as Notify } from './notify';
 export { default as OverflowTitle } from './overflow-title';
 export { default as Pagination } from './pagination';
-export { default as $bkPopover } from './plugin-popover';
 export { default as PopConfirm } from './pop-confirm';
-export { default as Popover } from './popover';
+export { default as Popover, $bkPopover } from './popover';
 export { default as Popover2 } from './popover2';
 export { default as Process } from './process';
 export { default as Progress } from './progress';

package/lib/config-provider/index.js

@@ -39,15 +39,19 @@ __webpack_require__.d(__webpack_exports__, {
   usePrefix: () => (/* reexport */ usePrefix)
 });
 
-;// CONCATENATED MODULE: external "../shared"
-var x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var y = x => () => x
-const shared_namespaceObject = x({ ["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
-const external_vue_namespaceObject = external_vue_x({ ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["getCurrentInstance"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.getCurrentInstance, ["inject"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.inject, ["provide"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.provide, ["reactive"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.reactive, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch });
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/typeof.js
+;// external "../shared"
+var x = (y) => {
+	var x = {}; __webpack_require__.d(x, y); return x
+} 
+var y = (x) => (() => (x))
+const shared_namespaceObject = x({ ["withInstall"]: () => (__WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.withInstall) });
+;// 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({ ["computed"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.computed), ["defineComponent"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.defineComponent), ["getCurrentInstance"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.getCurrentInstance), ["inject"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.inject), ["provide"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.provide), ["reactive"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.reactive), ["watch"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.watch) });
+;// ../../node_modules/@babel/runtime/helpers/esm/typeof.js
 function _typeof(o) {
   "@babel/helpers - typeof";
 
@@ -57,7 +61,7 @@ function _typeof(o) {
     return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
   }, _typeof(o);
 }
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/toPrimitive.js
+;// ../../node_modules/@babel/runtime/helpers/esm/toPrimitive.js
 
 function toPrimitive(t, r) {
   if ("object" != _typeof(t) || !t) return t;
@@ -69,14 +73,14 @@ function toPrimitive(t, r) {
   }
   return ("string" === r ? String : Number)(t);
 }
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/toPropertyKey.js
+;// ../../node_modules/@babel/runtime/helpers/esm/toPropertyKey.js
 
 
 function toPropertyKey(t) {
   var i = toPrimitive(t, "string");
   return "symbol" == _typeof(i) ? i : String(i);
 }
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/defineProperty.js
+;// ../../node_modules/@babel/runtime/helpers/esm/defineProperty.js
 
 function _defineProperty(obj, key, value) {
   key = toPropertyKey(key);
@@ -92,15 +96,19 @@ function _defineProperty(obj, key, value) {
   }
   return obj;
 }
-;// CONCATENATED MODULE: external "lodash/merge"
-var merge_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var merge_y = x => () => x
-const merge_namespaceObject = merge_x({ ["default"]: () => __WEBPACK_EXTERNAL_MODULE_lodash_merge_cf99375a__["default"] });
-;// CONCATENATED MODULE: external "../locale"
-var locale_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var locale_y = x => () => x
-const locale_namespaceObject = locale_x({ ["zhCn"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_locale_5ed5ef28__.zhCn });
-;// CONCATENATED MODULE: ../../packages/config-provider/src/token.ts
+;// external "lodash/merge"
+var merge_x = (y) => {
+	var x = {}; __webpack_require__.d(x, y); return x
+} 
+var merge_y = (x) => (() => (x))
+const merge_namespaceObject = merge_x({ ["default"]: () => (__WEBPACK_EXTERNAL_MODULE_lodash_merge_cf99375a__["default"]) });
+;// external "../locale"
+var locale_x = (y) => {
+	var x = {}; __webpack_require__.d(x, y); return x
+} 
+var locale_y = (x) => (() => (x))
+const locale_namespaceObject = locale_x({ ["zhCn"]: () => (__WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_locale_5ed5ef28__.zhCn) });
+;// ../../packages/config-provider/src/token.ts
 /*
  * Tencent is pleased to support the open source community by making
  * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
@@ -132,7 +140,7 @@ var defaultRootConfig = {
   locale: locale_namespaceObject.zhCn,
   prefix: 'bk'
 };
-;// CONCATENATED MODULE: ../../packages/config-provider/src/use-global-config.ts
+;// ../../packages/config-provider/src/use-global-config.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; }
@@ -191,7 +199,7 @@ var useGlobalConfig = function useGlobalConfig() {
     return config;
   });
 };
-;// CONCATENATED MODULE: ../../packages/config-provider/src/config-provider.tsx
+;// ../../packages/config-provider/src/config-provider.tsx
 /*
  * Tencent is pleased to support the open source community by making
  * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
@@ -242,7 +250,7 @@ var configProviderProps = {
     };
   }
 }));
-;// CONCATENATED MODULE: ../../packages/config-provider/src/use-locale.ts
+;// ../../packages/config-provider/src/use-locale.ts
 /*
  * Tencent is pleased to support the open source community by making
  * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
@@ -278,7 +286,7 @@ function useLocale(compName) {
     return locale && compName ? locale[compName] : {};
   });
 }
-;// CONCATENATED MODULE: ../../packages/config-provider/src/use-prefix.ts
+;// ../../packages/config-provider/src/use-prefix.ts
 /*
  * Tencent is pleased to support the open source community by making
  * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
@@ -326,7 +334,7 @@ function usePrefix() {
     resolveClassName: resolveClassName
   };
 }
-;// CONCATENATED MODULE: ../../packages/config-provider/src/index.ts
+;// ../../packages/config-provider/src/index.ts
 /**
  * Tencent is pleased to support the open source community by making
  * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.

package/lib/container/index.js

@@ -35,19 +35,25 @@ __webpack_require__.d(__webpack_exports__, {
   "default": () => (/* binding */ src)
 });
 
-;// 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, ["withInstallProps"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.withInstallProps });
-;// 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({ ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["inject"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.inject, ["provide"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.provide });
-;// 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({ ["usePrefix"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__.usePrefix });
-;// CONCATENATED MODULE: ../../packages/container/src/interface.ts
+;// 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), ["withInstallProps"]: () => (__WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.withInstallProps) });
+;// 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({ ["computed"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.computed), ["createVNode"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.createVNode), ["defineComponent"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.defineComponent), ["inject"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.inject), ["provide"]: () => (__WEBPACK_EXTERNAL_MODULE_vue__.provide) });
+;// 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({ ["usePrefix"]: () => (__WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__.usePrefix) });
+;// ../../packages/container/src/interface.ts
 /*
  * Tencent is pleased to support the open source community by making
  * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
@@ -74,7 +80,7 @@ const config_provider_namespaceObject = config_provider_x({ ["usePrefix"]: () =>
  * IN THE SOFTWARE.
  */
 var containerKey = Symbol('containerProps');
-;// CONCATENATED MODULE: ../../packages/container/src/col.tsx
+;// ../../packages/container/src/col.tsx
 
 /*
  * Tencent is pleased to support the open source community by making
@@ -160,7 +166,7 @@ var colProps = {
     };
   }
 }));
-;// CONCATENATED MODULE: ../../packages/container/src/container.tsx
+;// ../../packages/container/src/container.tsx
 
 /*
  * Tencent is pleased to support the open source community by making
@@ -238,7 +244,7 @@ var containerProps = {
     };
   }
 }));
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/typeof.js
+;// ../../node_modules/@babel/runtime/helpers/esm/typeof.js
 function _typeof(o) {
   "@babel/helpers - typeof";
 
@@ -248,7 +254,7 @@ function _typeof(o) {
     return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
   }, _typeof(o);
 }
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/toPrimitive.js
+;// ../../node_modules/@babel/runtime/helpers/esm/toPrimitive.js
 
 function toPrimitive(t, r) {
   if ("object" != _typeof(t) || !t) return t;
@@ -260,14 +266,14 @@ function toPrimitive(t, r) {
   }
   return ("string" === r ? String : Number)(t);
 }
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/toPropertyKey.js
+;// ../../node_modules/@babel/runtime/helpers/esm/toPropertyKey.js
 
 
 function toPropertyKey(t) {
   var i = toPrimitive(t, "string");
   return "symbol" == _typeof(i) ? i : String(i);
 }
-;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/defineProperty.js
+;// ../../node_modules/@babel/runtime/helpers/esm/defineProperty.js
 
 function _defineProperty(obj, key, value) {
   key = toPropertyKey(key);
@@ -283,7 +289,7 @@ function _defineProperty(obj, key, value) {
   }
   return obj;
 }
-;// CONCATENATED MODULE: ../../packages/container/src/row.tsx
+;// ../../packages/container/src/row.tsx
 
 
 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; }
@@ -349,7 +355,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
     };
   }
 }));
-;// CONCATENATED MODULE: ../../packages/container/src/index.ts
+;// ../../packages/container/src/index.ts
 /*
  * Tencent is pleased to support the open source community by making
  * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.

package/lib/date-picker/date-picker.css

@@ -1,3 +1,219 @@
+.bk-time-picker-header {
+  height: 46px;
+  font-size: 14px;
+  font-weight: 700;
+  line-height: 46px;
+  color: #63656e;
+  text-align: center;
+  border-bottom: 1px solid #dcdee5;
+}
+.bk-time-picker-cells:after {
+  position: absolute;
+  right: 0;
+  left: 0;
+  z-index: 1;
+  height: 32px;
+  padding-top: 6px;
+  margin-top: 0;
+  color: #3a84ff;
+  text-align: left;
+  pointer-events: none;
+  background-color: rgba(58, 132, 255, 0.16);
+  content: '';
+  box-sizing: border-box;
+  mix-blend-mode: multiply;
+}
+.bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before,
+.bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):before {
+  position: absolute;
+  top: 55px;
+  left: 85px;
+  z-index: 1;
+  width: 2px;
+  padding-top: 2px;
+  background-color: #3a84ff;
+  border-radius: 50%;
+  content: '';
+}
+.bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after,
+.bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):after {
+  position: absolute;
+  top: calc(55px + 5px);
+  left: 85px;
+  z-index: 1;
+  width: 2px;
+  padding-top: 2px;
+  background-color: #3a84ff;
+  border-radius: 50%;
+  content: '';
+}
+.bk-time-picker-cells-title-wrapper {
+  width: 100%;
+  height: 42px;
+  line-height: 42px;
+}
+.bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title {
+  position: relative;
+  float: left;
+  width: 33.33%;
+  font-size: 14px;
+  font-weight: 700;
+  color: #63656e;
+  text-align: center;
+  list-style: none;
+}
+.bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title.active {
+  color: #3a84ff;
+}
+.bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before {
+  position: absolute;
+  top: 55px;
+  left: 133px;
+  z-index: 1;
+  width: 2px;
+  padding-top: 2px;
+  background-color: #3a84ff;
+  border-radius: 50%;
+  content: '';
+}
+.bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after {
+  position: absolute;
+  top: calc(55px + 5px);
+  left: 133px;
+  z-index: 1;
+  width: 2px;
+  padding-top: 2px;
+  background-color: #3a84ff;
+  border-radius: 50%;
+  content: '';
+}
+.bk-time-picker-cells-list {
+  position: relative;
+  float: left;
+  width: 33.33%;
+  max-height: 200px;
+  overflow: hidden;
+}
+.bk-time-picker-cells-list:hover {
+  overflow-y: auto;
+}
+.bk-time-picker-cells-list:first-child {
+  border-radius: 2px 0 0 2px;
+}
+.bk-time-picker-cells-list:last-child {
+  border-radius: 0 2px 2px 0;
+}
+.bk-time-picker-cells-list::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  background-color: rgba(204, 204, 204, 0);
+}
+.bk-time-picker-cells-list::-webkit-scrollbar-thumb {
+  width: 0;
+  height: 0;
+  background-color: transparent;
+}
+.bk-time-picker-cells-list .bk-time-picker-cells-ul {
+  width: 100%;
+  padding: 0 0 168px 0;
+  margin: 0;
+  list-style: none;
+}
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell {
+  position: relative;
+  width: 100%;
+  height: 32px;
+  padding: 0;
+  margin: 0;
+  font-size: 12px;
+  line-height: 32px;
+  color: #63656e;
+  text-align: center;
+  list-style: none;
+  cursor: pointer;
+  box-sizing: content-box;
+  transition: background 0.2s ease-in-out;
+  user-select: none;
+}
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell:hover {
+  color: #3a84ff;
+}
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled {
+  color: #c4c6cc;
+  cursor: not-allowed;
+}
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled:hover {
+  color: #c4c6cc;
+  cursor: not-allowed;
+  background-color: #fff;
+}
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected,
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected:hover {
+  color: #3a84ff;
+}
+.bk-time-picker-header {
+  height: 46px;
+  font-size: 14px;
+  font-weight: 700;
+  line-height: 46px;
+  color: #63656e;
+  text-align: center;
+  border-bottom: 1px solid #dcdee5;
+}
+.bk-time-picker-with-range .bk-picker-panel-content {
+  position: relative;
+  float: left;
+}
+.bk-time-picker-with-range .bk-picker-panel-content:after {
+  position: absolute;
+  top: 45px;
+  right: 0;
+  bottom: 0;
+  z-index: 1;
+  display: block;
+  width: 1px;
+  background: #e8eaec;
+  content: '';
+}
+.bk-time-picker-with-range .bk-picker-panel-content-right {
+  float: right;
+}
+.bk-time-picker-with-range .bk-picker-panel-content-right:after {
+  right: auto;
+  left: 0;
+}
+.bk-time-picker-with-range .bk-time-picker-cells-list:first-child {
+  border-radius: 0;
+}
+.bk-time-picker-with-range .bk-time-picker-cells-list:last-child {
+  border-radius: 0;
+}
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells {
+  min-width: 216px;
+  position: relative;
+}
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds {
+  min-width: 216px;
+}
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list {
+  width: 72px;
+}
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list ul li {
+  padding: 0;
+}
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list {
+  width: 108px;
+  max-height: 200px;
+}
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:first-child {
+  border-radius: 0;
+}
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:last-child {
+  border-radius: 0;
+}
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list ul {
+  padding: 0 0 168px 0;
+}
 .bk-date-picker {
   display: inline-block;
   width: 261px;
@@ -16,6 +232,7 @@
   position: relative;
 }
 .bk-date-picker-rel .bk-date-picker-editor {
+  box-sizing: border-box;
   display: block;
   width: 100%;
   height: 32px;
@@ -27,7 +244,6 @@
   border: 1px solid #c4c6cc;
   border-radius: 2px;
   outline: none;
-  box-sizing: border-box;
 }
 .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border {
   border-color: transparent transparent #c4c6cc transparent;
@@ -106,13 +322,13 @@
 .bk-date-picker-dropdown {
   position: absolute;
   z-index: 900;
+  box-sizing: border-box;
   padding: 5px 0 0 0;
   overflow: auto;
   background-color: #fff;
   border: 1px solid #dcdee5;
   border-radius: 2px;
   box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
-  box-sizing: border-box;
 }
 .bk-date-picker .bk-select-dropdown {
   max-height: none;
@@ -187,6 +403,7 @@
 }
 .bk-picker-confirm {
   display: flex;
+  justify-content: flex-end;
   height: 42px;
   padding: 0 20px;
   clear: both;
@@ -195,7 +412,6 @@
   text-align: right;
   background-color: #fafbfd;
   border-top: 1px solid #dcdee5;
-  justify-content: flex-end;
 }
 .bk-picker-confirm a {
   color: #979ba5;
@@ -326,10 +542,10 @@ span.bk-date-picker-cells-cell-disabled:hover {
   bottom: 0;
   left: 0;
   display: block;
+  content: '';
   background: #e1ecff;
   border: 0;
   border-radius: 0;
-  content: '';
 }
 .bk-date-picker-cells-cell-range em {
   position: relative;

package/lib/date-picker/date-picker.less

@@ -1,5 +1,5 @@
 @import '../styles/themes/themes.less';
-
+@import '../time-picker/time-picker.less';
 .@{bk-prefix}-date-picker {
   display: inline-block;
   width: 261px;
@@ -22,6 +22,7 @@
   position: relative;
 
   .@{bk-prefix}-date-picker-editor {
+    box-sizing: border-box;
     display: block;
     width: 100%;
     height: 32px;
@@ -33,7 +34,6 @@
     border: 1px solid @light-gray;
     border-radius: 2px;
     outline: none;
-    box-sizing: border-box;
 
     &.only-bottom-border {
       border-color: transparent transparent @light-gray transparent;
@@ -129,13 +129,13 @@
 .@{bk-prefix}-date-picker-dropdown {
   position: absolute;
   z-index: 900;
+  box-sizing: border-box;
   padding: 5px 0 0 0;
   overflow: auto;
   background-color: @date-picker-dropdown-bg;
   border: 1px solid @disable-color;
   border-radius: 2px;
   box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
-  box-sizing: border-box;
 }
 
 .@{bk-prefix}-date-picker .@{bk-prefix}-select-dropdown {
@@ -225,6 +225,7 @@
 
 .@{bk-prefix}-picker-confirm {
   display: flex;
+  justify-content: flex-end;
   height: 42px;
   padding: 0 20px;
   clear: both;
@@ -233,7 +234,6 @@
   text-align: right;
   background-color: #fafbfd;
   border-top: 1px solid #dcdee5;
-  justify-content: flex-end;
 
   a {
     color: #979ba5;
@@ -392,10 +392,10 @@ span.@{bk-prefix}-date-picker-cells-cell-disabled:hover {
     bottom: 0;
     left: 0;
     display: block;
+    content: '';
     background: #e1ecff;
     border: 0;
     border-radius: 0;
-    content: '';
   }
 
   em {