bkui-vue 0.0.1-beta.34 → 0.0.1-beta.37

package/dist/bkui-vue.cjs.js

@@ -9262,8 +9262,9 @@ const inputType = {
   showControl: PropTypes.bool.def(true),
   showClearOnlyHover: PropTypes.bool.def(false),
   precision: PropTypes.number.def(0).validate((val) => val >= 0 && val < 20),
-  modelValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  size: PropTypes.size()
+  modelValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).def(""),
+  size: PropTypes.size(),
+  rows: PropTypes.number
 };
 const inputEvents = ["update:modelValue", "focus", "blur", "change", "clear", "input", "keypress", "keydown", "keyup", "enter", "paste"];
 const EventEnum = stringEnum([...inputEvents]);
@@ -9275,7 +9276,8 @@ var Component$i = vue.defineComponent({
   setup(props, ctx) {
     const isFocused = vue.ref(false);
     const isCNInput = vue.ref(false);
-    const inputClsPrefix = "bk-input";
+    const isTextArea = vue.computed(() => props.type === "textarea");
+    const inputClsPrefix = vue.computed(() => isTextArea.value ? "bk-textarea" : "bk-input");
     const _a = ctx.attrs, {
       class: cls,
       style
@@ -9284,13 +9286,13 @@ var Component$i = vue.defineComponent({
       "style"
     ]);
     const inputCls = vue.computed(() => classes({
-      [`${inputClsPrefix}--${props.size}`]: !!props.size,
+      [`${inputClsPrefix.value}--${props.size}`]: !!props.size,
       "is-focused": isFocused.value,
       "is-readonly": props.readonly,
       "is-disabled": props.disabled,
       "is-simplicity": props.behavior === "simplicity",
       [`${cls}`]: !!cls
-    }, inputClsPrefix));
+    }, inputClsPrefix.value));
     const suffixIconMap = {
       search: () => vue.createVNode(search, null, null),
       password: () => vue.createVNode(eye, {
@@ -9376,11 +9378,28 @@ var Component$i = vue.defineComponent({
       ctx.emit(EventEnum["update:modelValue"], newVal);
     }
     function getCls(name) {
-      return `${inputClsPrefix}--${name}`;
+      return `${inputClsPrefix.value}--${name}`;
     }
     function handleVisibleChange() {
       pwdVisible.value = !pwdVisible.value;
     }
+    const bindProps = vue.computed(() => ({
+      value: props.modelValue,
+      maxlength: props.maxlength,
+      placeholder: props.placeholder,
+      readonly: props.readonly,
+      disabled: props.disabled,
+      onInput: handleInput,
+      onFocus: handleFocus,
+      onBlur: handleBlur,
+      onPaste: handlePaste,
+      onChange: handleChange,
+      onKeypress: handleKeyPress,
+      onKeydown: handleKeydown,
+      onKeyup: handleKeyup,
+      onCompositionstart: handleCompositionStart,
+      onCompositionend: handleCompositionEnd
+    }));
     return () => {
       var _a2, _b, _c, _d, _e, _f;
       return vue.createVNode("div", {
@@ -9390,31 +9409,18 @@ var Component$i = vue.defineComponent({
         "class": getCls("prefix-area")
       }, [vue.createVNode("span", {
         "class": getCls("prefix-area--text")
-      }, [props.prefix])]), vue.createVNode("input", vue.mergeProps(inputAttrs, {
-        "class": `${inputClsPrefix}--text`,
-        "value": props.modelValue,
+      }, [props.prefix])]), isTextArea.value ? vue.createVNode("textarea", vue.mergeProps(inputAttrs, bindProps.value, {
+        "rows": props.rows
+      }), null) : vue.createVNode("input", vue.mergeProps(inputAttrs, {
+        "class": `${inputClsPrefix.value}--text`,
         "type": pwdVisible.value && props.type === "password" ? "text" : props.type,
-        "maxlength": props.maxlength,
         "step": props.step,
         "max": props.max,
-        "min": props.min,
-        "placeholder": props.placeholder,
-        "readonly": props.readonly,
-        "disabled": props.disabled,
-        "onInput": handleInput,
-        "onFocus": handleFocus,
-        "onBlur": handleBlur,
-        "onPaste": handlePaste,
-        "onChange": handleChange,
-        "onKeypress": handleKeyPress,
-        "onKeydown": handleKeydown,
-        "onKeyup": handleKeyup,
-        "onCompositionstart": handleCompositionStart,
-        "onCompositionend": handleCompositionEnd
-      }), null), props.clearable && !!props.modelValue && vue.createVNode(close$1, {
+        "min": props.min
+      }, bindProps.value), null), !isTextArea.value && props.clearable && !!props.modelValue && vue.createVNode(close$1, {
         "onClick": clear,
         "class": clearCls.value
-      }, null), suffixIcon.value, typeof props.maxlength === "number" && props.showWordLimit && vue.createVNode("p", {
+      }, null), suffixIcon.value, typeof props.maxlength === "number" && (props.showWordLimit || isTextArea.value) && vue.createVNode("p", {
         "class": getCls("max-length")
       }, [props.modelValue.toString().length, vue.createTextVNode("/"), vue.createVNode("span", null, [ceilMaxLength.value])]), isNumberInput.value && props.showControl && vue.createVNode("div", {
         "class": getCls("number-control")
@@ -12489,7 +12495,7 @@ const resolveColumnWidth = (root, colgroups, autoWidth = 20) => {
   const {
     width
   } = root.getBoundingClientRect() || {};
-  let avgWidth = width;
+  let avgWidth = width - 4;
   const avgColIndexList = [];
   const resolveColNumberWidth = (col, numWidth, resetAvgWidth = true) => {
     Object.assign(col, {
@@ -12573,11 +12579,13 @@ const resolvePaginationOption = (propPagination, defVal) => {
 };
 class TableRender {
   constructor(props, ctx, reactiveProp, colgroups) {
+    __publicField(this, "getColumnClass", (colIndex) => `${this.uuid}-column-${colIndex}`);
     this.props = props;
     this.context = ctx;
     this.reactiveProp = reactiveProp;
     this.colgroups = colgroups;
     this.plugins = new TablePlugins(props, ctx);
+    this.uuid = random(8);
   }
   get propActiveCols() {
     return this.reactiveProp.activeColumns;
@@ -12659,12 +12667,13 @@ class TableRender {
         "style": rowStyle,
         "onClick": (e) => this.handleRowClick(e, row, index, rows),
         "onDblclick": (e) => this.handleRowDblClick(e, row, index, rows)
-      }, [this.props.columns.map((column) => vue.createVNode("td", {
+      }, [this.props.columns.map((column, index2) => vue.createVNode("td", {
+        "class": this.getColumnClass(index2),
         "colspan": 1,
         "rowspan": 1
       }, [vue.createVNode("div", {
         "class": "cell"
-      }, [this.renderCell(row, column, index, rows)])]))]);
+      }, [this.renderCell(row, column, index2, rows)])]))]);
     })]);
   }
   handleRowClick(e, row, index, rows) {
@@ -12688,12 +12697,10 @@ class TableRender {
       const colCls = classes({
         active: this.isColActive(index)
       });
-      const colStyle = {
-        width: resolveWidth(column.calcWidth)
-      };
+      const width = `${resolveWidth(column.calcWidth)}`.replace(/px$/i, "");
       return vue.createVNode("col", {
         "class": colCls,
-        "style": colStyle
+        "width": width
       }, null);
     })]);
   }
@@ -20091,6 +20098,125 @@ var FormItem = vue.defineComponent({
   }
 });
 const BkForm = withInstallProps(Form, { FormItem });
+var Dropdown = vue.defineComponent({
+  name: "BkDropdown",
+  props: {
+    isShow: PropTypes.bool.def(false),
+    placement: PropTypes.commonType(["auto", "auto-start", "auto-end", "top", "right", "bottom", "left", "top-start", "top-end", "bottom-start", "bottom-end", "right-start", "right-end", "left-start", "left-end"], "placement").def("bottom"),
+    trigger: PropTypes.commonType(["hover", "click", "manual"], "trigger").def("hover"),
+    disabled: PropTypes.bool.def(false),
+    extCls: PropTypes.string
+  },
+  emits: ["showChange"],
+  setup(props, {
+    emit
+  }) {
+    let popoverInstance = /* @__PURE__ */ Object.create(null);
+    const reference2 = vue.ref(null);
+    const refContent = vue.ref(null);
+    vue.onMounted(() => {
+      registerDropdown();
+    });
+    vue.onBeforeUnmount(() => {
+      destoryDropdown();
+    });
+    vue.watch(() => props.isShow, (val) => {
+      vue.nextTick(() => {
+        if (props.trigger === "manual" && popoverInstance && !props.disabled) {
+          val ? popoverInstance.show() : popoverInstance.hide();
+        }
+      });
+    });
+    vue.watch(() => props.disabled, (val) => handleUpdateDisabled(val));
+    const registerDropdown = () => {
+      if (props.disabled)
+        return;
+      popoverInstance = new BKPopover(reference2.value, refContent.value, {
+        placement: props.placement,
+        trigger: props.trigger
+      });
+      props.trigger === "manual" && props.isShow && popoverInstance.show();
+    };
+    const destoryDropdown = () => {
+      if (popoverInstance) {
+        const instance = popoverInstance;
+        instance.isShow && instance.hide();
+        instance.destroy();
+        popoverInstance = null;
+        props.trigger === "manual" && emit("showChange", false);
+      }
+    };
+    const handleUpdateDisabled = (val) => {
+      const instance = popoverInstance;
+      props.trigger === "manual" && !val && emit("showChange", false);
+      instance.updateDisabled(val);
+    };
+    return {
+      reference: reference2,
+      refContent
+    };
+  },
+  render() {
+    var _a, _b, _c, _d;
+    const wrapperClasses = classes({
+      "bk-dropdown": true
+    }, this.$props.extCls);
+    return vue.createVNode("div", {
+      "class": wrapperClasses
+    }, [vue.createVNode("div", {
+      "ref": "reference",
+      "class": "bk-dropdown-reference"
+    }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)]), vue.createVNode("div", {
+      "ref": "refContent",
+      "class": "bk-dropdown-content"
+    }, [(_d = (_c = this.$slots).content) == null ? void 0 : _d.call(_c)])]);
+  }
+});
+var DropdownItem = vue.defineComponent({
+  name: "BkDropdownItem",
+  props: {
+    extCls: PropTypes.string
+  },
+  emits: ["click"],
+  setup(props, {
+    emit
+  }) {
+    const handleClick = (evt) => {
+      emit("click", evt);
+    };
+    const wrapperCLasses = vue.computed(() => ["bk-dropdown-item", props.extCls]);
+    return {
+      wrapperCLasses,
+      handleClick
+    };
+  },
+  render() {
+    var _a, _b;
+    return vue.createVNode("li", {
+      "class": this.wrapperCLasses,
+      "onClick": this.handleClick
+    }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)]);
+  }
+});
+var DropdownMenu = vue.defineComponent({
+  name: "BkDropdownMenu",
+  props: {
+    extCls: PropTypes.string
+  },
+  setup(props) {
+    const wrapperCLasses = vue.computed(() => ["bk-dropdown-menu", props.extCls]);
+    return {
+      wrapperCLasses
+    };
+  },
+  render() {
+    var _a, _b;
+    return vue.createVNode("ul", {
+      "class": this.wrapperCLasses
+    }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)]);
+  }
+});
+const BkDropdown = withInstallProps(Dropdown, { DropdownMenu, DropdownItem });
 var components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   Alert: BkAlert,
@@ -20140,7 +20266,11 @@ var components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProp
   Tree: BkTree,
   VirtualRender: BkVirtualRender,
   Form: BkForm,
-  FormItem
+  FormItem,
+  Pagination: BkPagination,
+  Dropdown: BkDropdown,
+  DropdownMenu,
+  DropdownItem
 }, Symbol.toStringTag, { value: "Module" }));
 const createInstall = (prefix = "Bk") => (app) => {
   const pre = app.config.globalProperties.bkUIPrefix || prefix;
@@ -20175,6 +20305,9 @@ exports.Collapse = BkCollaspe;
 exports.DatePicker = BkDatePicker;
 exports.Dialog = BkDialog;
 exports.Divider = BkDivider;
+exports.Dropdown = BkDropdown;
+exports.DropdownItem = DropdownItem;
+exports.DropdownMenu = DropdownMenu;
 exports.Exception = BkException;
 exports.FixedNavbar = BkFixedNavbar;
 exports.Form = BkForm;
@@ -20187,6 +20320,7 @@ exports.Message = Message;
 exports.Modal = BkModal;
 exports.Navigation = Navigation;
 exports.Notify = Notify;
+exports.Pagination = BkPagination;
 exports.Popover = BkPopover;
 exports.Progress = BkProgress;
 exports.Radio = BkRadio;

package/dist/bkui-vue.esm.js

@@ -9260,8 +9260,9 @@ const inputType = {
   showControl: PropTypes.bool.def(true),
   showClearOnlyHover: PropTypes.bool.def(false),
   precision: PropTypes.number.def(0).validate((val) => val >= 0 && val < 20),
-  modelValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  size: PropTypes.size()
+  modelValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).def(""),
+  size: PropTypes.size(),
+  rows: PropTypes.number
 };
 const inputEvents = ["update:modelValue", "focus", "blur", "change", "clear", "input", "keypress", "keydown", "keyup", "enter", "paste"];
 const EventEnum = stringEnum([...inputEvents]);
@@ -9273,7 +9274,8 @@ var Component$i = defineComponent({
   setup(props, ctx) {
     const isFocused = ref(false);
     const isCNInput = ref(false);
-    const inputClsPrefix = "bk-input";
+    const isTextArea = computed(() => props.type === "textarea");
+    const inputClsPrefix = computed(() => isTextArea.value ? "bk-textarea" : "bk-input");
     const _a = ctx.attrs, {
       class: cls,
       style
@@ -9282,13 +9284,13 @@ var Component$i = defineComponent({
       "style"
     ]);
     const inputCls = computed(() => classes({
-      [`${inputClsPrefix}--${props.size}`]: !!props.size,
+      [`${inputClsPrefix.value}--${props.size}`]: !!props.size,
       "is-focused": isFocused.value,
       "is-readonly": props.readonly,
       "is-disabled": props.disabled,
       "is-simplicity": props.behavior === "simplicity",
       [`${cls}`]: !!cls
-    }, inputClsPrefix));
+    }, inputClsPrefix.value));
     const suffixIconMap = {
       search: () => createVNode(search, null, null),
       password: () => createVNode(eye, {
@@ -9374,11 +9376,28 @@ var Component$i = defineComponent({
       ctx.emit(EventEnum["update:modelValue"], newVal);
     }
     function getCls(name) {
-      return `${inputClsPrefix}--${name}`;
+      return `${inputClsPrefix.value}--${name}`;
     }
     function handleVisibleChange() {
       pwdVisible.value = !pwdVisible.value;
     }
+    const bindProps = computed(() => ({
+      value: props.modelValue,
+      maxlength: props.maxlength,
+      placeholder: props.placeholder,
+      readonly: props.readonly,
+      disabled: props.disabled,
+      onInput: handleInput,
+      onFocus: handleFocus,
+      onBlur: handleBlur,
+      onPaste: handlePaste,
+      onChange: handleChange,
+      onKeypress: handleKeyPress,
+      onKeydown: handleKeydown,
+      onKeyup: handleKeyup,
+      onCompositionstart: handleCompositionStart,
+      onCompositionend: handleCompositionEnd
+    }));
     return () => {
       var _a2, _b, _c, _d, _e, _f;
       return createVNode("div", {
@@ -9388,31 +9407,18 @@ var Component$i = defineComponent({
         "class": getCls("prefix-area")
       }, [createVNode("span", {
         "class": getCls("prefix-area--text")
-      }, [props.prefix])]), createVNode("input", mergeProps(inputAttrs, {
-        "class": `${inputClsPrefix}--text`,
-        "value": props.modelValue,
+      }, [props.prefix])]), isTextArea.value ? createVNode("textarea", mergeProps(inputAttrs, bindProps.value, {
+        "rows": props.rows
+      }), null) : createVNode("input", mergeProps(inputAttrs, {
+        "class": `${inputClsPrefix.value}--text`,
         "type": pwdVisible.value && props.type === "password" ? "text" : props.type,
-        "maxlength": props.maxlength,
         "step": props.step,
         "max": props.max,
-        "min": props.min,
-        "placeholder": props.placeholder,
-        "readonly": props.readonly,
-        "disabled": props.disabled,
-        "onInput": handleInput,
-        "onFocus": handleFocus,
-        "onBlur": handleBlur,
-        "onPaste": handlePaste,
-        "onChange": handleChange,
-        "onKeypress": handleKeyPress,
-        "onKeydown": handleKeydown,
-        "onKeyup": handleKeyup,
-        "onCompositionstart": handleCompositionStart,
-        "onCompositionend": handleCompositionEnd
-      }), null), props.clearable && !!props.modelValue && createVNode(close$1, {
+        "min": props.min
+      }, bindProps.value), null), !isTextArea.value && props.clearable && !!props.modelValue && createVNode(close$1, {
         "onClick": clear,
         "class": clearCls.value
-      }, null), suffixIcon.value, typeof props.maxlength === "number" && props.showWordLimit && createVNode("p", {
+      }, null), suffixIcon.value, typeof props.maxlength === "number" && (props.showWordLimit || isTextArea.value) && createVNode("p", {
         "class": getCls("max-length")
       }, [props.modelValue.toString().length, createTextVNode("/"), createVNode("span", null, [ceilMaxLength.value])]), isNumberInput.value && props.showControl && createVNode("div", {
         "class": getCls("number-control")
@@ -12487,7 +12493,7 @@ const resolveColumnWidth = (root, colgroups, autoWidth = 20) => {
   const {
     width
   } = root.getBoundingClientRect() || {};
-  let avgWidth = width;
+  let avgWidth = width - 4;
   const avgColIndexList = [];
   const resolveColNumberWidth = (col, numWidth, resetAvgWidth = true) => {
     Object.assign(col, {
@@ -12571,11 +12577,13 @@ const resolvePaginationOption = (propPagination, defVal) => {
 };
 class TableRender {
   constructor(props, ctx, reactiveProp, colgroups) {
+    __publicField(this, "getColumnClass", (colIndex) => `${this.uuid}-column-${colIndex}`);
     this.props = props;
     this.context = ctx;
     this.reactiveProp = reactiveProp;
     this.colgroups = colgroups;
     this.plugins = new TablePlugins(props, ctx);
+    this.uuid = random(8);
   }
   get propActiveCols() {
     return this.reactiveProp.activeColumns;
@@ -12657,12 +12665,13 @@ class TableRender {
         "style": rowStyle,
         "onClick": (e) => this.handleRowClick(e, row, index, rows),
         "onDblclick": (e) => this.handleRowDblClick(e, row, index, rows)
-      }, [this.props.columns.map((column) => createVNode("td", {
+      }, [this.props.columns.map((column, index2) => createVNode("td", {
+        "class": this.getColumnClass(index2),
         "colspan": 1,
         "rowspan": 1
       }, [createVNode("div", {
         "class": "cell"
-      }, [this.renderCell(row, column, index, rows)])]))]);
+      }, [this.renderCell(row, column, index2, rows)])]))]);
     })]);
   }
   handleRowClick(e, row, index, rows) {
@@ -12686,12 +12695,10 @@ class TableRender {
       const colCls = classes({
         active: this.isColActive(index)
       });
-      const colStyle = {
-        width: resolveWidth(column.calcWidth)
-      };
+      const width = `${resolveWidth(column.calcWidth)}`.replace(/px$/i, "");
       return createVNode("col", {
         "class": colCls,
-        "style": colStyle
+        "width": width
       }, null);
     })]);
   }
@@ -20089,6 +20096,125 @@ var FormItem = defineComponent({
   }
 });
 const BkForm = withInstallProps(Form, { FormItem });
+var Dropdown = defineComponent({
+  name: "BkDropdown",
+  props: {
+    isShow: PropTypes.bool.def(false),
+    placement: PropTypes.commonType(["auto", "auto-start", "auto-end", "top", "right", "bottom", "left", "top-start", "top-end", "bottom-start", "bottom-end", "right-start", "right-end", "left-start", "left-end"], "placement").def("bottom"),
+    trigger: PropTypes.commonType(["hover", "click", "manual"], "trigger").def("hover"),
+    disabled: PropTypes.bool.def(false),
+    extCls: PropTypes.string
+  },
+  emits: ["showChange"],
+  setup(props, {
+    emit
+  }) {
+    let popoverInstance = /* @__PURE__ */ Object.create(null);
+    const reference2 = ref(null);
+    const refContent = ref(null);
+    onMounted(() => {
+      registerDropdown();
+    });
+    onBeforeUnmount(() => {
+      destoryDropdown();
+    });
+    watch(() => props.isShow, (val) => {
+      nextTick(() => {
+        if (props.trigger === "manual" && popoverInstance && !props.disabled) {
+          val ? popoverInstance.show() : popoverInstance.hide();
+        }
+      });
+    });
+    watch(() => props.disabled, (val) => handleUpdateDisabled(val));
+    const registerDropdown = () => {
+      if (props.disabled)
+        return;
+      popoverInstance = new BKPopover(reference2.value, refContent.value, {
+        placement: props.placement,
+        trigger: props.trigger
+      });
+      props.trigger === "manual" && props.isShow && popoverInstance.show();
+    };
+    const destoryDropdown = () => {
+      if (popoverInstance) {
+        const instance = popoverInstance;
+        instance.isShow && instance.hide();
+        instance.destroy();
+        popoverInstance = null;
+        props.trigger === "manual" && emit("showChange", false);
+      }
+    };
+    const handleUpdateDisabled = (val) => {
+      const instance = popoverInstance;
+      props.trigger === "manual" && !val && emit("showChange", false);
+      instance.updateDisabled(val);
+    };
+    return {
+      reference: reference2,
+      refContent
+    };
+  },
+  render() {
+    var _a, _b, _c, _d;
+    const wrapperClasses = classes({
+      "bk-dropdown": true
+    }, this.$props.extCls);
+    return createVNode("div", {
+      "class": wrapperClasses
+    }, [createVNode("div", {
+      "ref": "reference",
+      "class": "bk-dropdown-reference"
+    }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)]), createVNode("div", {
+      "ref": "refContent",
+      "class": "bk-dropdown-content"
+    }, [(_d = (_c = this.$slots).content) == null ? void 0 : _d.call(_c)])]);
+  }
+});
+var DropdownItem = defineComponent({
+  name: "BkDropdownItem",
+  props: {
+    extCls: PropTypes.string
+  },
+  emits: ["click"],
+  setup(props, {
+    emit
+  }) {
+    const handleClick = (evt) => {
+      emit("click", evt);
+    };
+    const wrapperCLasses = computed(() => ["bk-dropdown-item", props.extCls]);
+    return {
+      wrapperCLasses,
+      handleClick
+    };
+  },
+  render() {
+    var _a, _b;
+    return createVNode("li", {
+      "class": this.wrapperCLasses,
+      "onClick": this.handleClick
+    }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)]);
+  }
+});
+var DropdownMenu = defineComponent({
+  name: "BkDropdownMenu",
+  props: {
+    extCls: PropTypes.string
+  },
+  setup(props) {
+    const wrapperCLasses = computed(() => ["bk-dropdown-menu", props.extCls]);
+    return {
+      wrapperCLasses
+    };
+  },
+  render() {
+    var _a, _b;
+    return createVNode("ul", {
+      "class": this.wrapperCLasses
+    }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)]);
+  }
+});
+const BkDropdown = withInstallProps(Dropdown, { DropdownMenu, DropdownItem });
 var components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   Alert: BkAlert,
@@ -20138,7 +20264,11 @@ var components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProp
   Tree: BkTree,
   VirtualRender: BkVirtualRender,
   Form: BkForm,
-  FormItem
+  FormItem,
+  Pagination: BkPagination,
+  Dropdown: BkDropdown,
+  DropdownMenu,
+  DropdownItem
 }, Symbol.toStringTag, { value: "Module" }));
 const createInstall = (prefix = "Bk") => (app) => {
   const pre = app.config.globalProperties.bkUIPrefix || prefix;
@@ -20156,4 +20286,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, 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, BkDropdown as Dropdown, DropdownItem, DropdownMenu, 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, BkPagination as Pagination, 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 };