bkui-vue 0.0.1-beta.29 → 0.0.1-beta.31

package/dist/bkui-vue.esm.js

@@ -33,7 +33,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { createVNode, h as h$1, mergeProps, defineComponent, reactive, ref, computed, watch, onMounted, onBeforeUnmount, Transition, getCurrentInstance, provide, inject, nextTick, isVNode, Fragment, createTextVNode, toRefs, customRef, onBeforeMount, withDirectives, vShow, toRef, unref, resolveDirective, vModelText, watchEffect, onUpdated, render, onUnmounted, Teleport } from "vue";
+import { createVNode, h as h$1, mergeProps, defineComponent, reactive, ref, computed, watch, onMounted, onBeforeUnmount, Transition, getCurrentInstance, provide, inject, Fragment, nextTick, isVNode, createTextVNode, toRefs, customRef, onBeforeMount, withDirectives, vShow, toRef, unref, resolveDirective, vModelText, watchEffect, onUpdated, render, onUnmounted, Teleport } from "vue";
 var reset = "";
 var alert = "";
 var backtop = "";
@@ -78,6 +78,7 @@ var virtualRender$1 = "";
 var transfer = "";
 var pagination = "";
 var timeline = "";
+var codeDiff = "";
 var resizeLayout = "";
 var tagInput = "";
 const BKLAYERD_INDEX_EFAULT_VALUE = {
@@ -8459,6 +8460,7 @@ const loadingTypes = {
     type: Function
   },
   loading: PropTypes.bool,
+  inline: PropTypes.bool.def(true),
   theme: PropTypes.theme(["white", "primary", "warning", "success", "danger"]),
   title: PropTypes.string.def(""),
   size: PropTypes.commonType(Object.values(BkLoadingSize)).def(BkLoadingSize.Normal),
@@ -8477,9 +8479,9 @@ var Component$r = defineComponent({
       "class": `oval oval-${i}`
     }, null))]);
     const loadingWrapperCls = computed(() => classes({
+      "bk-loading-wrapper": props.loading,
       "bk-nested-loading": !!ctx.slots.default
-    }, "bk-loading-wrapper"));
-    console.log(props.theme);
+    }));
     const containerCls = computed(() => classes({
       [`bk-loading-size-${props.size}`]: !!props.size,
       [`bk-loading-${props.theme}`]: !!props.theme
@@ -8497,15 +8499,15 @@ var Component$r = defineComponent({
     });
     return () => {
       var _a, _b;
-      return ctx.slots.default && !props.loading ? (_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a) : createVNode("div", {
+      return createVNode("div", {
         "class": loadingWrapperCls.value
-      }, [createVNode("div", {
+      }, [props.loading && createVNode(Fragment, null, [createVNode("div", {
         "class": containerCls.value
       }, [indicator.value, hasTitle.value && createVNode("div", {
         "class": "bk-loading-title"
       }, [props.title])]), ctx.slots.default && createVNode("div", {
         "class": "bk-loading-mask"
-      }, [ctx.slots.default()])]);
+      }, null)]), (_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)]);
     };
   }
 });
@@ -9919,7 +9921,7 @@ var Component$e = defineComponent({
   render() {
     const radioClass = classes({
       "bk-radio": true,
-      "is-focus": this.isFocus,
+      "is-focusd": this.isFocus,
       "is-disabled": this.isDisabled,
       "is-checked": this.isCheck
     });
@@ -9978,7 +9980,7 @@ var RadioButton = defineComponent({
   render() {
     const radioClass = classes({
       "bk-radio-button": true,
-      "is-focus": this.isFocus,
+      "is-focusd": this.isFocus,
       "is-disabled": this.isDisabled,
       "is-checked": this.isCheck
     });
@@ -10029,9 +10031,10 @@ var RadioGroup = defineComponent({
     return {};
   },
   render() {
+    var _a;
     return createVNode("div", {
       "class": "bk-radio-group"
-    }, [this.$slots.default()]);
+    }, [(_a = this.$slots) == null ? void 0 : _a.default()]);
   }
 });
 const BkRadio = withInstallProps(Component$e, { Group: RadioGroup, Button: RadioButton });
@@ -11708,7 +11711,7 @@ var Component$7 = defineComponent({
   }
 });
 const BkSwitcher = withInstall(Component$7);
-const EventProps$1 = {
+const EventProps = {
   onContentScroll: Function
 };
 const virtualRenderProps = __spreadValues({
@@ -11731,7 +11734,7 @@ const virtualRenderProps = __spreadValues({
   scrollPosition: PropTypes.string.def("content"),
   abosuteHeight: PropTypes.oneOfType([PropTypes.string.def("auto"), PropTypes.number]).def("auto"),
   throttleDelay: PropTypes.number.def(60)
-}, EventProps$1);
+}, EventProps);
 function getMatchedIndex(maxCount, maxHeight, groupItemCount, callback) {
   let startIndex = 0;
   let height = 0;
@@ -11960,10 +11963,7 @@ var Component$6 = defineComponent({
 });
 const BkVirtualRender = withInstall(Component$6);
 const BORDER_OPRIONS = ["none", "row", "col", "outer"];
-const EventProps = {
-  onRowClick: Function
-};
-const tableProps = __spreadValues({
+const tableProps = {
   data: PropTypes.arrayOf(PropTypes.any).def([]),
   columns: PropTypes.arrayOf(PropTypes.shape({
     label: PropTypes.oneOfType([PropTypes.func.def(() => ""), PropTypes.string.def("")]),
@@ -11982,7 +11982,7 @@ const tableProps = __spreadValues({
   border: PropTypes.arrayOf(PropTypes.commonType(BORDER_OPRIONS, "border")).def(["row"]),
   pagination: PropTypes.oneOfType([PropTypes.bool.def(false), PropTypes.object.def({})]).def(false),
   remotePagination: PropTypes.bool.def(false)
-}, EventProps);
+};
 function _isSlot(s2) {
   return typeof s2 === "function" || Object.prototype.toString.call(s2) === "[object Object]" && !isVNode(s2);
 }
@@ -12082,6 +12082,8 @@ var useList = () => {
         localCurrent.value = proxy.totalPageNum;
       }
     });
+  }, {
+    immediate: true
   });
   nextTick(() => {
     watch(() => proxy.totalPageNum, (totalPageNum) => {
@@ -12361,7 +12363,7 @@ const paginationProps = {
 var Component$5 = defineComponent({
   name: "Pagination",
   props: paginationProps,
-  emits: ["update:modelValue", "change", "update:limit", "limit-change"],
+  emits: ["update:modelValue", "change", "update:limit", "limitChange"],
   setup(props, context) {
     const totalPageNum = ref(0);
     const {
@@ -12396,7 +12398,7 @@ var Component$5 = defineComponent({
       context.emit("change", smallListCurrent2);
     });
     watch(localLimit, (localLimit2) => {
-      context.emit("limit-change", localLimit2);
+      context.emit("limitChange", localLimit2);
     });
     return {
       totalPageNum,
@@ -12601,14 +12603,14 @@ class TableRender {
     Object.assign(this.props.pagination, {
       limit
     });
-    this.context.emit("page-limit-change", limit);
+    this.context.emit("pageLimitChange", limit);
   }
   hanlePageChange(current) {
     Object.assign(this.props.pagination, {
       current,
       value: current
     });
-    this.context.emit("page-value-change", current);
+    this.context.emit("pageValueChange", current);
   }
   setColumnActive(index, single = false) {
     const col = this.propActiveCols.find((item) => item.index === index);
@@ -12693,7 +12695,7 @@ class TableRender {
 var Component$4 = defineComponent({
   name: "Table",
   props: tableProps,
-  emits: ["column-pick", "row-click", "page-limit-change", "page-value-change"],
+  emits: ["columnPick", "rowClick", "pageLimitChange", "pageValueChange"],
   setup(props, ctx) {
     const activeCols = reactive(resolveActiveColumns(props));
     const colgroups = reactive(props.columns.map((col) => __spreadProps(__spreadValues({}, col), {
@@ -13759,15 +13761,16 @@ var TagInput = defineComponent({
 TagInput.install = (Vue) => {
   Vue.component(TagInput.name, TagInput);
 };
+const dividerProps = {
+  direction: PropTypes.commonType(["horizontal", "vertical"], "direction").def("horizontal"),
+  align: PropTypes.commonType(["left", "center", "right"], "align").def("center"),
+  color: PropTypes.string.def("#dde4eb"),
+  width: PropTypes.number.def(1),
+  type: PropTypes.commonType(["dashed", "solid"], "lineType").def("dashed")
+};
 var bkDivider = defineComponent({
   name: "Divider",
-  props: {
-    direction: PropTypes.commonType(["horizontal", "vertical"], "direction").def("horizontal"),
-    align: PropTypes.commonType(["left", "center", "right"], "align").def("center"),
-    color: PropTypes.string.def("#dde4eb"),
-    width: PropTypes.number.def(1),
-    type: PropTypes.commonType(["dashed", "solid"], "lineType").def("dashed")
-  },
+  props: dividerProps,
   render() {
     const styles = () => {
       if (this.direction === "vertical") {
@@ -13792,46 +13795,73 @@ var bkDivider = defineComponent({
   }
 });
 const BkDivider = withInstall(bkDivider);
+const tabNavEventProps = {
+  tabAdd: {
+    type: Function,
+    default: () => ({})
+  },
+  tabChange: {
+    type: Function,
+    default: (name) => name
+  },
+  tabRemove: {
+    type: Function,
+    default: (name) => name
+  },
+  tabSort: {
+    type: Function,
+    default: () => ({})
+  },
+  tabDrag: {
+    type: Function,
+    default: () => ({})
+  }
+};
+const tabProps = {
+  active: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def(""),
+  type: PropTypes.commonType(["card", "border-card", "unborder-card"], "type").def("border-card"),
+  tabPosition: PropTypes.commonType(["left", "right", "top"], "position").def("top"),
+  closable: Boolean,
+  addable: Boolean,
+  sortable: Boolean,
+  sortType: PropTypes.commonType(["replace", "insert", "top"], "sortType").def("replace"),
+  labelHeight: PropTypes.number.def(50),
+  scrollStep: PropTypes.number.def(200),
+  extCls: PropTypes.string.def(""),
+  validateActive: PropTypes.bool.def(true),
+  showHeader: PropTypes.bool.def(true),
+  changeOnHover: PropTypes.bool.def(false),
+  changeOnHoverDelay: PropTypes.number.def(1e3)
+};
+const tabNavProps = __spreadValues({
+  active: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def(""),
+  panels: {
+    type: Array,
+    default: () => []
+  },
+  closable: Boolean,
+  addable: Boolean,
+  sortable: Boolean,
+  sortType: PropTypes.commonType(["replace", "insert", "top"], "sortType").def("replace"),
+  labelHeight: PropTypes.number.def(50),
+  scrollStep: PropTypes.number.def(200),
+  validateActive: PropTypes.bool.def(true),
+  changeOnHover: PropTypes.bool.def(false),
+  changeOnHoverDelay: PropTypes.number.def(1e3)
+}, tabNavEventProps);
+const tabPanelProps = {
+  name: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).def(""),
+  label: PropTypes.string || PropTypes.func,
+  closable: PropTypes.bool,
+  visible: PropTypes.bool.def(true),
+  disabled: PropTypes.bool,
+  sortable: PropTypes.bool,
+  renderDirective: PropTypes.commonType(["if", "show"], "render").def("show"),
+  panel: PropTypes.string || PropTypes.func
+};
 var TabNav = defineComponent({
   name: "TabNav",
-  props: {
-    active: {
-      type: String || Number
-    },
-    panels: {
-      type: Array,
-      default: () => []
-    },
-    closable: PropTypes.bool.def(false),
-    addable: PropTypes.bool.def(false),
-    sortable: PropTypes.bool.def(false),
-    sortType: PropTypes.commonType(["replace", "insert", "top"], "sortType").def("replace"),
-    labelHeight: PropTypes.number.def(50),
-    scrollStep: PropTypes.number.def(200),
-    validateActive: PropTypes.bool.def(true),
-    changeOnHover: PropTypes.bool.def(false),
-    changeOnHoverDelay: PropTypes.number.def(1e3),
-    tabAdd: {
-      type: Function,
-      default: () => ({})
-    },
-    tabChange: {
-      type: Function,
-      default: () => ({})
-    },
-    tabRemove: {
-      type: Function,
-      default: () => ({})
-    },
-    tabSort: {
-      type: Function,
-      default: () => ({})
-    },
-    tabDrag: {
-      type: Function,
-      default: () => ({})
-    }
-  },
+  props: tabNavProps,
   setup(props) {
     const navs = computed(() => {
       if (!Array.isArray(props.panels) || !props.panels.length) {
@@ -13902,18 +13932,15 @@ var TabNav = defineComponent({
     distinctRoots(el1, el2) {
       return el1 === el2;
     },
-    swapArr(arr, a2, b2) {
-      const swap = arr[a2];
-      arr[a2] = arr[b2];
-      arr[b2] = swap;
-    },
     handleTabAdd(e) {
       this.tabAdd(e);
     },
     dragstart(index, $event) {
       this.dragStartIndex = index;
       this.draggingEle = this.guid;
-      $event.dataTransfer.effectAllowed = "move";
+      Object.assign($event.dataTransfer, {
+        effectAllowed: "move"
+      });
       this.tabDrag(index, $event);
     },
     dragenter(index) {
@@ -13930,20 +13957,7 @@ var TabNav = defineComponent({
       if (!this.distinctRoots(this.draggingEle, this.guid)) {
         return false;
       }
-      if (sortType === "insert") {
-        if (this.dragStartIndex < index) {
-          this.panels.splice(index + 1, 0, this.panels[this.dragStartIndex]);
-          this.panels.splice(this.dragStartIndex, 1);
-        } else if (this.dragStartIndex > index) {
-          this.panels.splice(index, 0, this.panels[this.dragStartIndex]);
-          this.panels.splice(this.dragStartIndex + 1, 1);
-        } else {
-          return false;
-        }
-      } else {
-        this.swapArr(this.panels, this.dragStartIndex, index);
-      }
-      this.tabSort(this.dragStartIndex, index);
+      this.tabSort(this.dragStartIndex, index, sortType);
     },
     handleTabChange(name) {
       this.tabChange(name);
@@ -13984,7 +13998,7 @@ var TabNav = defineComponent({
         }
         return classNames.join(" ");
       };
-      const getValue = (value, value2) => typeof value === "boolean" ? value : value2;
+      const getValue = (curentValue, parentValue) => curentValue || parentValue;
       return createVNode("div", {
         "key": name,
         "onClick": () => this.handleTabChange(name),
@@ -14016,26 +14030,29 @@ var TabNav = defineComponent({
     });
     const renderSlot = () => {
       var _a, _b, _c, _d;
-      let addSlot;
       const list = [];
       if (typeof this.$slots.add === "function") {
-        addSlot = (_b = (_a = this.$slots).add) == null ? void 0 : _b.call(_a, h$1);
+        list.push((_b = (_a = this.$slots).add) == null ? void 0 : _b.call(_a, h$1));
       } else if (addable) {
-        addSlot = createVNode("div", {
+        list.push(createVNode("div", {
           "onClick": this.handleTabAdd
         }, [createVNode(plus, {
           "width": 26,
           "height": 26
-        }, null)]);
+        }, null)]));
       }
-      list.push(addSlot);
       if (typeof this.$slots.setting === "function") {
         list.push((_d = (_c = this.$slots).setting) == null ? void 0 : _d.call(_c, h$1));
       }
-      return list.map((item, index) => createVNode("div", {
-        "class": "bk-tab-header-item",
-        "key": index
-      }, [item]));
+      if (list.length) {
+        return createVNode("div", {
+          "class": "bk-tab-header-operation"
+        }, [list.map((item, index) => createVNode("div", {
+          "class": "bk-tab-header-item",
+          "key": index
+        }, [item]))]);
+      }
+      return null;
     };
     return createVNode("div", {
       "style": {
@@ -14044,9 +14061,7 @@ var TabNav = defineComponent({
       "class": "bk-tab-header"
     }, [createVNode("div", {
       "class": "bk-tab-header-nav"
-    }, [renderNavs()]), createVNode("div", {
-      "class": "bk-tab-header-operation"
-    }, [renderSlot()])]);
+    }, [renderNavs()]), renderSlot()]);
   }
 });
 var Tab = defineComponent({
@@ -14054,28 +14069,11 @@ var Tab = defineComponent({
   components: {
     TabNav
   },
-  props: {
-    active: {
-      type: String || Number
-    },
-    type: PropTypes.commonType(["card", "border-card", "unborder-card"], "type").def("border-card"),
-    tabPosition: PropTypes.commonType(["left", "right", "top"], "position").def("top"),
-    closable: PropTypes.bool.def(false),
-    addable: PropTypes.bool.def(false),
-    sortable: PropTypes.bool.def(false),
-    sortType: PropTypes.commonType(["replace", "insert", "top"], "sortType").def("replace"),
-    labelHeight: PropTypes.number.def(50),
-    scrollStep: PropTypes.number.def(200),
-    extCls: PropTypes.string.def(""),
-    validateActive: PropTypes.bool.def(true),
-    showHeader: PropTypes.bool.def(true),
-    changeOnHover: PropTypes.bool.def(false),
-    changeOnHoverDelay: PropTypes.number.def(1e3)
-  },
+  props: tabProps,
   emits: [
     "add-panel",
     "tab-change",
-    "close-panel",
+    "remove-panel",
     "sort-change",
     "on-drag-tab",
     "add",
@@ -14092,7 +14090,7 @@ var Tab = defineComponent({
     const panels = ref([]);
     const instance = getCurrentInstance();
     if (typeof slots.panel === "function") {
-      panels.value = slots.default();
+      panels.value = slots.panel();
     }
     if (typeof slots.default === "function") {
       panels.value = slots.default();
@@ -14157,11 +14155,26 @@ var Tab = defineComponent({
     },
     tabRemove(index, panel) {
       this.$emit("remove", index, panel);
-      this.$emit("close-panel", index, panel);
+      this.$emit("remove-panel", index, panel);
     },
-    tabSort(dragTabIndex, dropTabIndex) {
-      this.$emit("sort", dragTabIndex, dropTabIndex);
-      this.$emit("sort-change", dragTabIndex, dropTabIndex);
+    tabSort(dragTabIndex, dropTabIndex, sortType) {
+      if (sortType === "insert") {
+        if (dragTabIndex < dropTabIndex) {
+          this.panels.splice(dropTabIndex + 1, 0, this.panels[dragTabIndex]);
+          this.panels.splice(dragTabIndex, 1);
+        } else if (dragTabIndex > dropTabIndex) {
+          this.panels.splice(dropTabIndex, 0, this.panels[dragTabIndex]);
+          this.panels.splice(dragTabIndex + 1, 1);
+        } else {
+          return false;
+        }
+      } else {
+        const swap = this.panels[dropTabIndex];
+        this.panels[dropTabIndex] = this.panels[dragTabIndex];
+        this.panels[dragTabIndex] = swap;
+      }
+      this.$emit("sort", dragTabIndex, dropTabIndex, sortType);
+      this.$emit("sort-change", dragTabIndex, dropTabIndex, sortType);
     },
     tabDrag(dragTabIndex, dragEvent) {
       this.$emit("drag", dragTabIndex, dragEvent);
@@ -14229,18 +14242,7 @@ var Tab = defineComponent({
 });
 var TabPanel = defineComponent({
   name: "TabPanel",
-  props: {
-    name: {
-      type: String || Number
-    },
-    label: String || Function,
-    closable: Function || Boolean,
-    visible: PropTypes.bool.def(true),
-    disabled: PropTypes.bool.def(null) || void 0,
-    sortable: Function || Boolean,
-    renderDirective: PropTypes.commonType(["if", "show"], "render").def("show"),
-    panel: String || Function
-  },
+  props: tabPanelProps,
   render() {
     const active = this.name === this.$parent.active;
     const getContent = () => {
@@ -14264,8 +14266,7 @@ var TabPanel = defineComponent({
     }, [getContent()]), [[vShow, active]]);
   }
 });
-const BKTab = withInstall(Tab);
-const BKTabPanel = withInstall(TabPanel);
+const BkTab = withInstallProps(Tab, { TabPanel });
 const instances = {
   "top-left": [],
   "top-right": [],
@@ -20122,8 +20123,8 @@ var components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProp
   Tag: BkTag,
   TagInput,
   Divider: BkDivider,
-  Tab: BKTab,
-  TabPanel: BKTabPanel,
+  Tab: BkTab,
+  TabPanel,
   Message,
   Notify,
   Menu: BkMenu,
@@ -20151,4 +20152,4 @@ var preset = {
   install: createInstall(),
   version: "0.0.1"
 };
-export { BkAlert as Alert, BkAnimateNumber as AnimateNumber, BkBacktop as Backtop, BkBadge as Badge, BkOption, OptionGroup as BkOptionGroup, BkBreadcrumb as Breadcrumb, BreadcrumbItem, BkButton as Button, ButtonGroup, BkCard as Card, BkCheckbox as Checkbox, CheckboxGroup, BkCollaspe as Collapse, BkDatePicker as DatePicker, BkDialog as Dialog, BkDivider as Divider, BkException as Exception, BkFixedNavbar as FixedNavbar, BkForm as Form, FormItem, BkInput as Input, BkLink as Link, BkLoading as Loading, BkMenu as Menu, Message, BkModal as Modal, Navigation, Notify, BkPopover as Popover, BkProgress as Progress, BkRadio as Radio, RadioButton, RadioGroup, BkRate as Rate, BkSelect as Select, BkSideslider as Sideslider, BkSteps as Steps, BkSwiper as Swiper, BkSwitcher as Switcher, BKTab as Tab, BKTabPanel as TabPanel, BkTable as Table, BkTag as Tag, TagInput, Transfer, BkTree as Tree, BkVirtualRender as VirtualRender, tooltips as bkTooltips, ClickOutside as clickoutside, preset as default, mousewheel };
+export { BkAlert as Alert, BkAnimateNumber as AnimateNumber, BkBacktop as Backtop, BkBadge as Badge, BkOption, OptionGroup as BkOptionGroup, BkBreadcrumb as Breadcrumb, BreadcrumbItem, BkButton as Button, ButtonGroup, BkCard as Card, BkCheckbox as Checkbox, CheckboxGroup, BkCollaspe as Collapse, BkDatePicker as DatePicker, BkDialog as Dialog, BkDivider as Divider, BkException as Exception, BkFixedNavbar as FixedNavbar, BkForm as Form, FormItem, BkInput as Input, BkLink as Link, BkLoading as Loading, BkMenu as Menu, Message, BkModal as Modal, Navigation, Notify, BkPopover as Popover, BkProgress as Progress, BkRadio as Radio, RadioButton, RadioGroup, BkRate as Rate, BkSelect as Select, BkSideslider as Sideslider, BkSteps as Steps, BkSwiper as Swiper, BkSwitcher as Switcher, BkTab as Tab, TabPanel, BkTable as Table, BkTag as Tag, TagInput, Transfer, BkTree as Tree, BkVirtualRender as VirtualRender, tooltips as bkTooltips, ClickOutside as clickoutside, preset as default, mousewheel };