bkui-vue 0.0.1-beta.118 → 0.0.1-beta.120

package/dist/index.esm.js

@@ -9088,6 +9088,7 @@ const buttonProps = {
   loadingMode: PropTypes.commonType(Object.values(BkLoadingMode)),
   outline: PropTypes.bool,
   text: PropTypes.bool,
+  selected: PropTypes.bool,
   nativeType: {
     type: String,
     default: "button"
@@ -9116,6 +9117,7 @@ var Component$y = defineComponent({
         "is-outline": props.outline,
         "is-text": isText.value,
         "is-loading": props.loading,
+        "is-selected": props.selected,
         [`${btnClsPrefix}-${props.size}`]: props.size && btnSizes.includes(props.size),
         "no-slot": !showSlot
       }, `${themeCls} ${btnClsPrefix} ${hoverTheme}`);
@@ -9301,6 +9303,12 @@ var Component$x = defineComponent({
     const clearCls = computed(() => classes({
       "show-clear-only-hover": props.showClearOnlyHover
     }, suffixCls));
+    const incControlCls = computed(() => classes({
+      "is-disabled": props.disabled || props.modelValue >= props.max
+    }));
+    const decControlCls = computed(() => classes({
+      "is-disabled": props.disabled || props.modelValue <= props.min
+    }));
     ctx.expose({
       focus() {
         inputRef.value.focus();
@@ -9370,10 +9378,14 @@ var Component$x = defineComponent({
       return +newVal.toFixed(precision);
     }
     function handleInc() {
+      if (props.disabled)
+        return;
       const newVal = handleNumber(props.step);
       ctx.emit(EVENTS$2.UPDATE, newVal);
     }
     function handleDec() {
+      if (props.disabled)
+        return;
       const newVal = handleNumber(props.step, false);
       ctx.emit(EVENTS$2.UPDATE, newVal);
     }
@@ -9431,8 +9443,10 @@ var Component$x = defineComponent({
       }, [props.modelValue.toString().length, createTextVNode("/"), createVNode("span", null, [ceilMaxLength.value])]), isNumberInput.value && props.showControl && createVNode("div", {
         "class": getCls("number-control")
       }, [createVNode(downSmall, {
+        "class": incControlCls.value,
         "onClick": handleInc
       }, null), createVNode(downSmall, {
+        "class": decControlCls.value,
         "onClick": handleDec
       }, null)]), (_f = (_e = (_d = ctx.slots) == null ? void 0 : _d.suffix) == null ? void 0 : _e.call(_d)) != null ? _f : props.suffix && createVNode("div", {
         "class": getCls("suffix-area")
@@ -9925,6 +9939,7 @@ const propsMixin$1 = {
   transfer: PropTypes.bool.def(false),
   maxHeight: PropTypes.string,
   direction: PropTypes.string,
+  title: PropTypes.string.def(""),
   animateType: PropTypes.string.def("slide"),
   renderDirective: PropTypes.commonType(["show", "if"], "renderDirective").def("show"),
   beforeClose: PropTypes.custom(() => true),
@@ -9933,7 +9948,6 @@ const propsMixin$1 = {
 };
 var Component$t = defineComponent({
   name: "Modal",
-  inheritAttrs: false,
   props: __spreadValues({}, propsMixin$1),
   emits: ["quick-close", "quickClose", "hidden", "shown", "close"],
   data() {
@@ -13672,7 +13686,7 @@ var BkOption = defineComponent({
   name: "Option",
   props: {
     value: PropTypes.any,
-    label: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    label: PropTypes.string.def(""),
     disabled: PropTypes.bool.def(false)
   },
   setup(props) {
@@ -13690,7 +13704,7 @@ var BkOption = defineComponent({
     const group = inject(optionGroupKey, null);
     const selected = computed(() => {
       var _a;
-      return (_a = select2 == null ? void 0 : select2.selected) == null ? void 0 : _a.some((val) => val === value.value);
+      return (_a = select2 == null ? void 0 : select2.selected) == null ? void 0 : _a.some((item) => item.value === value.value);
     });
     const multiple = computed(() => select2 == null ? void 0 : select2.multiple);
     const isHover = computed(() => (select2 == null ? void 0 : select2.activeOptionValue) === value.value);
@@ -13947,13 +13961,13 @@ var SelectTagInput = defineComponent({
     var _a, _b, _c, _d;
     return createVNode("div", {
       "class": "bk-select-tag"
-    }, [(_b = (_a = this.$slots) == null ? void 0 : _a.prefix) == null ? void 0 : _b.call(_a), this.selected.map((val) => {
+    }, [(_b = (_a = this.$slots) == null ? void 0 : _a.prefix) == null ? void 0 : _b.call(_a), this.selected.map((item) => {
       let _slot;
       return createVNode(BkTag, {
         "closable": true,
         "theme": this.tagTheme,
-        "onClose": () => this.handleRemoveTag(val)
-      }, _isSlot$5(_slot = this.handleGetLabelByValue(val)) ? _slot : {
+        "onClose": () => this.handleRemoveTag(item.value)
+      }, _isSlot$5(_slot = this.handleGetLabelByValue(item)) ? _slot : {
         default: () => [_slot]
       });
     }), withDirectives(createVNode("input", {
@@ -14036,7 +14050,7 @@ var Component$h = defineComponent({
       deep: true
     });
     const isDisabled = computed(() => disabled.value || loading2.value);
-    const selectedLabel = computed(() => selected.value.map((value) => handleGetLabelByValue(value)));
+    const selectedLabel = computed(() => selected.value.map((item) => handleGetLabelByValue(item)));
     const isAllSelected = computed(() => {
       const normalSelectedValues = options.value.reduce((pre, option) => {
         if (!option.disabled) {
@@ -14044,7 +14058,7 @@ var Component$h = defineComponent({
         }
         return pre;
       }, []);
-      return normalSelectedValues.length <= selected.value.length && normalSelectedValues.every((val) => selected.value.some((value) => value === val));
+      return normalSelectedValues.length <= selected.value.length && normalSelectedValues.every((val) => selected.value.some((item) => item.value === val));
     });
     const isGroup = computed(() => !!groupsMap.value.size);
     const isOptionsEmpty = computed(() => !options.value.length);
@@ -14105,10 +14119,10 @@ var Component$h = defineComponent({
     });
     const initActiveOptionValue = () => {
       var _a;
-      const firstValue = selected.value[0];
-      const option = optionsMap.value.get(firstValue);
+      const firstSelected = selected.value[0];
+      const option = optionsMap.value.get(firstSelected == null ? void 0 : firstSelected.value);
       if (option && !option.disabled && option.visible) {
-        activeOptionValue.value = firstValue;
+        activeOptionValue.value = firstSelected == null ? void 0 : firstSelected.value;
       } else {
         activeOptionValue.value = (_a = options.value.find((option2) => !option2.disabled && option2.visible)) == null ? void 0 : _a.value;
       }
@@ -14144,7 +14158,8 @@ var Component$h = defineComponent({
         return;
       searchKey.value = value;
     };
-    const handleInputEnter = (value, e) => {
+    const handleInputEnter = (val, e) => {
+      const value = String(val);
       if (!allowCreate.value || !value || filterable.value && options.value.find((data3) => toLowerCase(String(data3.label)) === toLowerCase(value)))
         return;
       const data2 = optionsMap.value.get(value);
@@ -14152,10 +14167,16 @@ var Component$h = defineComponent({
         return;
       e.stopPropagation();
       if (multiple.value) {
-        selected.value.push(value);
-        emitChange(selected.value);
+        selected.value.push({
+          value,
+          label: value
+        });
+        emitChange(selected.value.map((item) => item.value));
       } else {
-        selected.value = [value];
+        selected.value = [{
+          value,
+          label: value
+        }];
         emitChange(value);
         hidePopover();
       }
@@ -14165,15 +14186,21 @@ var Component$h = defineComponent({
       if (isDisabled.value || !option)
         return;
       if (multiple.value) {
-        const index = selected.value.findIndex((value) => value === option.value);
+        const index = selected.value.findIndex((item) => item.value === option.value);
         if (index > -1) {
           selected.value.splice(index, 1);
         } else {
-          selected.value.push(option.value);
+          selected.value.push({
+            value: option.value,
+            label: option.label || option.value
+          });
         }
-        emitChange(selected.value);
+        emitChange(selected.value.map((item) => item.value));
       } else {
-        selected.value = [option.value];
+        selected.value = [{
+          label: option.label || option.value,
+          value: option.value
+        }];
         emitChange(option.value);
         hidePopover();
       }
@@ -14194,17 +14221,23 @@ var Component$h = defineComponent({
       emit("clear", multiple.value ? [] : "");
       hidePopover();
     };
+    const handleSelectedAllOptionMouseEnter = () => {
+      activeOptionValue.value = "";
+    };
     const handleToggleAll = () => {
       if (isAllSelected.value) {
         selected.value = [];
       } else {
         options.value.forEach((option) => {
-          if (option.disabled || selected.value.find((value) => value === option.value))
+          if (option.disabled || selected.value.find((item) => item.value === option.value))
             return;
-          selected.value.push(option.value);
+          selected.value.push({
+            value: option.value,
+            label: option.label || option.value
+          });
         });
       }
-      emitChange(selected.value);
+      emitChange(selected.value.map((item) => item.value));
       focus();
     };
     const handleScroll = (e) => {
@@ -14218,21 +14251,27 @@ var Component$h = defineComponent({
       }
     };
     const handleDeleteTag = (val) => {
-      const index = selected.value.findIndex((value) => value === val);
+      const index = selected.value.findIndex((item) => item.value === val);
       if (index > -1) {
         selected.value.splice(index, 1);
-        emitChange(selected.value);
+        emitChange(selected.value.map((item) => item.value));
       }
     };
-    const handleGetLabelByValue = (val) => {
+    const handleGetLabelByValue = (item) => {
       var _a, _b;
-      return ((_b = (_a = optionsMap.value) == null ? void 0 : _a.get(val)) == null ? void 0 : _b.label) || val;
+      return ((_b = (_a = optionsMap.value) == null ? void 0 : _a.get(item.value)) == null ? void 0 : _b.label) || item.label || item.value;
     };
     const handleSetSelectedData = () => {
       if (Array.isArray(modelValue.value)) {
-        selected.value = [...modelValue.value];
+        selected.value = [...modelValue.value.map((value) => ({
+          value,
+          label: value
+        }))];
       } else if (modelValue.value !== void 0) {
-        selected.value = [modelValue.value];
+        selected.value = [{
+          value: modelValue.value,
+          label: modelValue.value
+        }];
       }
     };
     const handleKeydown = (e) => {
@@ -14258,7 +14297,7 @@ var Component$h = defineComponent({
           if (!multiple.value || !selected.value.length || searchKey.value.length)
             return;
           selected.value.pop();
-          emitChange(selected.value);
+          emitChange(selected.value.map((item) => item.value));
           break;
         }
         case "Enter": {
@@ -14335,7 +14374,8 @@ var Component$h = defineComponent({
       handleDeleteTag,
       handleInputChange,
       handleInputEnter,
-      handleKeydown
+      handleKeydown,
+      handleSelectedAllOptionMouseEnter
     };
   },
   render() {
@@ -14361,6 +14401,7 @@ var Component$h = defineComponent({
       if (this.loading) {
         return createVNode(BkLoading, {
           "loading": true,
+          "theme": "primary",
           "class": "spinner",
           "mode": "spin",
           "size": "mini"
@@ -14433,10 +14474,11 @@ var Component$h = defineComponent({
         "class": "bk-select-empty"
       }, [this.searchLoading && createVNode(BkLoading, {
         "class": "mr5",
+        "theme": "primary",
         "loading": true,
         "mode": "spin",
         "size": "mini"
-      }, null), this.curContentText]), createVNode("div", {
+      }, null), createVNode("span", null, [this.curContentText])]), createVNode("div", {
         "class": "bk-select-content"
       }, [createVNode("div", {
         "class": "bk-select-dropdown",
@@ -14448,6 +14490,7 @@ var Component$h = defineComponent({
         "class": "bk-select-options"
       }, [this.multiple && this.showSelectAll && (!this.searchKey || !this.filterable) && createVNode("li", {
         "class": "bk-select-option",
+        "onMouseenter": this.handleSelectedAllOptionMouseEnter,
         "onClick": this.handleToggleAll
       }, [this.selectAllText]), (_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a), this.scrollLoading && createVNode("li", {
         "class": "bk-select-options-loading"
@@ -14457,7 +14500,7 @@ var Component$h = defineComponent({
         "loading": true,
         "mode": "spin",
         "size": "mini"
-      }, null), this.loadingText])]), [[vShow, this.isShowSelectContent]])]), this.$slots.extension && createVNode("div", {
+      }, null), createVNode("span", null, [this.loadingText])])]), [[vShow, this.isShowSelectContent]])]), this.$slots.extension && createVNode("div", {
         "class": "bk-select-extension"
       }, [this.$slots.extension()])])]);
     };
@@ -14492,6 +14535,10 @@ var Component$g = defineComponent({
       type: String,
       default: ""
     },
+    extCls: {
+      type: String,
+      default: ""
+    },
     direction: {
       type: String,
       default: "right",
@@ -14563,7 +14610,7 @@ var Component$g = defineComponent({
       const maxHeight = slots.footer ? "calc(100vh - 114px)" : "calc(100vh - 60px)";
       return createVNode(BkModal, mergeProps(props, {
         "maxHeight": maxHeight,
-        "class": className,
+        "extCls": className,
         "style": `${props.direction}: 0;`,
         "onHidden": handleHidden,
         "onShown": handleShown,