bkui-vue 0.0.2-beta.133 → 0.0.2-beta.135

package/lib/cascader/cascader.css

@@ -70,7 +70,7 @@
 .bk-popper[data-popper-placement^='right'] > .bk-popper-arrow {
   left: -4px;
 }
-.bk-cascader-popover.bk-pop2-content {
+.bk-cascader-popover.bk-pop2-content.bk-popover {
   padding: 0;
 }
 .bk-cascader-popover-wrapper {

package/lib/cascader/cascader.d.ts

@@ -218,6 +218,7 @@ declare const _default: import("vue").DefineComponent<{
     displayText: import("vue").ComputedRef<any>;
     resolveClassName: (cls: string) => string;
     isShowPanel: import("vue").Ref<boolean>;
+    searchBlueHandler: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "focus" | "toggle" | "clear" | "update:modelValue")[], "change" | "focus" | "toggle" | "clear" | "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: import("vue-types").VueTypeDef<(string | number | string[])[]>;
     list: import("vue-types").VueTypeValidableDef<unknown[]> & {

package/lib/cascader/cascader.less

@@ -1,7 +1,7 @@
 @import '../styles/themes/themes.less';
 @import '../styles/mixins/mixins.less';
 
-.@{bk-prefix}-cascader-popover.@{bk-prefix}-pop2-content {
+.@{bk-prefix}-cascader-popover.@{bk-prefix}-pop2-content.bk-popover {
   padding: 0;
 }
 .@{bk-prefix}-cascader-popover-wrapper {

package/lib/cascader/cascader.variable.css

@@ -196,7 +196,7 @@
 .bk-popper[data-popper-placement^='right'] > .bk-popper-arrow {
   left: -4px;
 }
-.bk-cascader-popover.bk-pop2-content {
+.bk-cascader-popover.bk-pop2-content.bk-popover {
   padding: 0;
 }
 .bk-cascader-popover-wrapper {

package/lib/cascader/index.d.ts

@@ -318,6 +318,7 @@ declare const BkCascader: {
             displayText: import("vue").ComputedRef<any>;
             resolveClassName: (cls: string) => string;
             isShowPanel: import("vue").Ref<boolean>;
+            searchBlueHandler: () => void;
         }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "focus" | "toggle" | "clear" | "update:modelValue")[], string, {
             extCls: string;
             disabled: boolean;
@@ -589,6 +590,7 @@ declare const BkCascader: {
         displayText: import("vue").ComputedRef<any>;
         resolveClassName: (cls: string) => string;
         isShowPanel: import("vue").Ref<boolean>;
+        searchBlueHandler: () => void;
     }> & {} & import("vue").ComponentCustomProperties & {};
     __isFragment?: never;
     __isTeleport?: never;
@@ -818,6 +820,7 @@ declare const BkCascader: {
     displayText: import("vue").ComputedRef<any>;
     resolveClassName: (cls: string) => string;
     isShowPanel: import("vue").Ref<boolean>;
+    searchBlueHandler: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "focus" | "toggle" | "clear" | "update:modelValue")[], "change" | "focus" | "toggle" | "clear" | "update:modelValue", {
     extCls: string;
     disabled: boolean;

package/lib/cascader/index.js

@@ -1673,6 +1673,15 @@ var Store = /*#__PURE__*/function () {
     var updateSearchKey = function updateSearchKey() {
       searchKey.value = selectedText.value;
     };
+    var searchBlueHandler = function searchBlueHandler() {
+      // 单选搜索框与选择框互斥，因此一旦失去焦点，认为是没有选择，还原选择框的内容
+      if (!props.multiple) {
+        searchKey.value = selectedText.value;
+        return;
+      }
+      // 多选下，失去焦点则需要删除搜索框
+      searchKey.value = '';
+    };
     // 更新选中
     var updateValue = function updateValue(val) {
       // 更新多选情况下的选中标签
@@ -1737,6 +1746,8 @@ var Store = /*#__PURE__*/function () {
       oldValue !== undefined && emit('change', value); // oldValue = undefined代表初始化，init不派发change事件
       // 如果有过滤搜索，选择后，自动focus到input
       inputRef === null || inputRef === void 0 || (_inputRef$value = inputRef.value) === null || _inputRef$value === void 0 ? void 0 : _inputRef$value.focus();
+      // 选择后过滤条件清除，面板初始化渲染
+      isFiltering.value = false;
     };
     // list的监听函数
     var listChangeHandler = function listChangeHandler() {
@@ -1855,7 +1866,8 @@ var Store = /*#__PURE__*/function () {
       isEdit: isEdit,
       displayText: displayText,
       resolveClassName: resolveClassName,
-      isShowPanel: isShowPanel
+      isShowPanel: isShowPanel,
+      searchBlueHandler: searchBlueHandler
     };
   },
   render: function render() {
@@ -1952,6 +1964,7 @@ var Store = /*#__PURE__*/function () {
             }],
             "type": "text",
             "onInput": _this.searchInputHandler,
+            "onBlur": _this.searchBlueHandler,
             "placeholder": _this.calcuPlaceholder,
             "value": _this.searchKey,
             "disabled": _this.disabled,

package/lib/date-picker/index.js

@@ -2547,6 +2547,17 @@ var timeProps = {
   confirm: {
     type: Boolean,
     "default": false
+  },
+  selectionMode: {
+    type: String,
+    "default": 'date',
+    validator: function validator(v) {
+      if (['year', 'month', 'date', 'time'].indexOf(v) < 0) {
+        console.error("selectionMode property is not valid: '".concat(v, "'"));
+        return false;
+      }
+      return true;
+    }
   }
 };
 // function injectStrict<T>(key: InjectionKey<T>, fallback?: T) {
@@ -2642,7 +2653,8 @@ var timeProps = {
         return newDate["set".concat((0,external_shared_namespaceObject.capitalize)(type))](date[type]);
       });
       if (isEmit) {
-        emit('pick', newDate, true, 'time');
+        // pick 参数：dates, visible, type, isUseShortCut
+        emit('pick', newDate, true, props.selectionMode);
       }
     }
     function handlePickClick() {
@@ -2861,7 +2873,10 @@ var datePanelProps = {
         state.pickerTable = getTableType(state.currentView);
       }
     };
-    var handlePick = function handlePick(value, type) {
+    var handlePick = function handlePick(value) {
+      var _visible = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+      var type = arguments.length > 2 ? arguments[2] : undefined;
+      var _shortcut = arguments.length > 3 ? arguments[3] : undefined;
       var val = value;
       if (props.selectionMode === 'year') {
         val = new Date(value.getFullYear(), 0, 1);
@@ -2871,6 +2886,7 @@ var datePanelProps = {
         val = new Date(value);
       }
       state.dates = [val];
+      // pick 参数：dates, visible, type, isUseShortCut
       emit('pick', val, false, type || props.selectionMode);
     };
     var handlePickSuccess = function handlePickSuccess() {
@@ -2884,7 +2900,7 @@ var datePanelProps = {
     var handleShortcutClick = function handleShortcutClick(shortcut) {
       if (shortcut.value) {
         // pick 参数：dates, visible, type, isUseShortCut
-        emit('pick', shortcut.value(), false, undefined, shortcut);
+        emit('pick', shortcut.value(), false, props.selectionMode, shortcut);
       }
       if (shortcut.onClick) {
         shortcut.onClick(_this);
@@ -3099,6 +3115,7 @@ var datePanelProps = {
       "ref": "timePickerRef",
       "value": this.dates,
       "format": this.format,
+      "selectionMode": this.selectionMode,
       "disabledDate": this.disabledDate,
       "onPick": this.handlePick,
       "onPick-click": this.handlePickClick,
@@ -3175,6 +3192,17 @@ var timeRangeProps = {
   allowCrossDay: {
     type: Boolean,
     "default": false
+  },
+  selectionMode: {
+    type: String,
+    "default": 'date',
+    validator: function validator(v) {
+      if (['year', 'month', 'date', 'time'].indexOf(v) < 0) {
+        console.error("selectionMode property is not valid: '".concat(v, "'"));
+        return false;
+      }
+      return true;
+    }
   }
 };
 /* harmony default export */ const time_range = ((0,external_vue_namespaceObject.defineComponent)({
@@ -3285,7 +3313,8 @@ var timeRangeProps = {
         }
       }
       if (isEmit) {
-        emit('pick', [dateStart, dateEnd], true, 'time');
+        // pick 参数：dates, visible, type, isUseShortCut
+        emit('pick', [dateStart, dateEnd], true, props.selectionMode);
       }
     }
     function handleStartChange(date) {
@@ -3650,6 +3679,7 @@ var dateRangePanelProps = {
      * handleConfirm
      */
     var handleConfirm = function handleConfirm(visible, type) {
+      // pick 参数：dates, visible, type, isUseShortCut
       emit('pick', state.dates, visible, type || props.type);
     };
     /**
@@ -3680,7 +3710,7 @@ var dateRangePanelProps = {
             selecting: false
           };
         }
-        handleConfirm(false, type || 'date');
+        handleConfirm(false, type || props.selectionMode);
       } else {
         state.upToNowEnable = new Date(val).getTime() < new Date().getTime();
         state.rangeState = {
@@ -3726,6 +3756,7 @@ var dateRangePanelProps = {
       state.rangeState.to = to;
       state.dates = [form, to];
       state.selectedIndex = index;
+      // pick 参数：dates, visible, type, isUseShortCut
       emit('pick', value, false, 'shortcut', shortcut);
       if (props.shortcutClose) {
         emit('pick-success');
@@ -4079,6 +4110,7 @@ var dateRangePanelProps = {
       }
     }() : '']), [[external_vue_namespaceObject.vShow, !this.isTime]]), this.isTime ? (0,external_vue_namespaceObject.createVNode)(time_range, {
       "ref": "timePickerRef",
+      "selectionMode": this.selectionMode,
       "value": this.dates,
       "format": this.format,
       "disabledDate": this.disabledDate,
@@ -4162,7 +4194,7 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
     if (props.shortcutSelectedIndex !== -1) {
       shortcut = props.shortcuts[props.shortcutSelectedIndex] || null;
       if (shortcut) {
-        initialValue = shortcut.value();
+        initialValue = [shortcut.value()];
       }
     }
     var _usePrefix = (0,external_config_provider_namespaceObject.usePrefix)(),

package/lib/date-picker/panel/date.d.ts

@@ -108,7 +108,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: () => {};
     };
 }, {
-    panelPickerHandlers: import("vue").ComputedRef<(value: any, type: any) => void>;
+    panelPickerHandlers: import("vue").ComputedRef<(value: any, _visible: boolean, type: any, _shortcut: any) => void>;
     datePanelLabel: import("vue").ComputedRef<{
         separator: any;
         labels: any[];
@@ -126,7 +126,7 @@ declare const _default: import("vue").DefineComponent<{
     handleToggleTime: () => void;
     handlePickSuccess: () => void;
     handlePickClear: () => void;
-    handlePick: (value: any, type: any) => void;
+    handlePick: (value: any, _visible: boolean, type: any, _shortcut: any) => void;
     handlePickClick: () => void;
     timePickerRef: any;
     resolveClassName: (cls: string) => string;

package/lib/date-picker/panel/time-range.d.ts

@@ -1,4 +1,5 @@
 import type { ExtractPropTypes, PropType } from 'vue';
+import { SelectionModeType } from '../interface';
 declare const timeRangeProps: {
     steps: {
         type: PropType<number[]>;
@@ -16,6 +17,11 @@ declare const timeRangeProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
 };
 export type TimeRangePanelProps = Readonly<ExtractPropTypes<typeof timeRangeProps>>;
 declare const _default: import("vue").DefineComponent<{
@@ -35,6 +41,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -322,6 +333,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -492,5 +508,6 @@ declare const _default: import("vue").DefineComponent<{
     disabledSeconds: unknown[];
     hideDisabledOptions: boolean;
     enterMode: boolean;
+    selectionMode: SelectionModeType;
 }, {}>;
 export default _default;

package/lib/date-picker/panel/time.d.ts

@@ -1,5 +1,5 @@
 import type { ExtractPropTypes, PropType } from 'vue';
-import { IDisabledHMS } from '../interface';
+import { IDisabledHMS, SelectionModeType } from '../interface';
 declare const timeProps: {
     disabledDate: {
         type: FunctionConstructor;
@@ -21,6 +21,11 @@ declare const timeProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
 };
 export type TimePanelProps = Readonly<ExtractPropTypes<typeof timeProps>>;
 declare const _default: import("vue").DefineComponent<{
@@ -44,6 +49,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -273,6 +283,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -448,5 +463,6 @@ declare const _default: import("vue").DefineComponent<{
     disabledSeconds: unknown[];
     hideDisabledOptions: boolean;
     enterMode: boolean;
+    selectionMode: SelectionModeType;
 }, {}>;
 export default _default;

package/lib/search-select/index.js

@@ -475,7 +475,7 @@ function _defineProperty(obj, key, value) {
 ;// CONCATENATED MODULE: external "vue"
 var external_vue_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_vue_y = x => () => x
-const external_vue_namespaceObject = external_vue_x({ ["Fragment"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Fragment, ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createTextVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createTextVNode, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["inject"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.inject, ["nextTick"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.nextTick, ["onBeforeUnmount"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onBeforeUnmount, ["onMounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onMounted, ["provide"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.provide, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["resolveDirective"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.resolveDirective, ["shallowRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.shallowRef, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch, ["watchEffect"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watchEffect, ["withDirectives"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.withDirectives });
+const external_vue_namespaceObject = external_vue_x({ ["Fragment"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Fragment, ["computed"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.computed, ["createTextVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createTextVNode, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["inject"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.inject, ["onBeforeUnmount"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onBeforeUnmount, ["onMounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onMounted, ["provide"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.provide, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["resolveDirective"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.resolveDirective, ["shallowRef"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.shallowRef, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch, ["watchEffect"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watchEffect, ["withDirectives"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.withDirectives });
 ;// CONCATENATED MODULE: ../../node_modules/resize-detector/esm/index.js
 var raf = null;
 function requestAnimationFrame (callback) {
@@ -1696,7 +1696,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
       if (!usingItem.value && !keyword.value) {
         emit('delete');
         // eslint-disable-next-line @typescript-eslint/no-misused-promises
-        (0,external_vue_namespaceObject.nextTick)(setMenuList);
+        setTimeout(setMenuList, 16);
         return;
       }
       if ((_usingItem$value10 = usingItem.value) !== null && _usingItem$value10 !== void 0 && _usingItem$value10.values.length) {

package/lib/time-picker/time-picker.css

@@ -190,6 +190,7 @@
 }
 .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;

package/lib/time-picker/time-picker.less

@@ -223,6 +223,7 @@
 
 .@{bk-prefix}-picker-panel-content .@{bk-prefix}-picker-panel-content .@{bk-prefix}-time-picker-cells {
   min-width: 216px;
+  position: relative;
 }
 
 .@{bk-prefix}-picker-panel-content .@{bk-prefix}-picker-panel-content .@{bk-prefix}-time-picker-cells-with-seconds {

package/lib/time-picker/time-picker.variable.css

@@ -316,6 +316,7 @@
 }
 .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;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bkui-vue",
-  "version": "0.0.2-beta.133",
+  "version": "0.0.2-beta.135",
   "workspaces": {
     "packages": [
       "packages/!(**.bak)*",