bkui-vue 2.0.2-beta.87 → 2.0.2-beta.89

package/lib/index.js

@@ -3,5 +3,5 @@ export * from './hooks';
 export { default } from './preset';
 export * from './config-provider';
 export * from './directives';
-export const version = "2.0.2-beta.87";
+export const version = "2.0.2-beta.89";
 window.__bkui_vue_version__ = version;

package/lib/input/index.d.ts

@@ -124,6 +124,7 @@ declare const BkInput: {
         onKeypress?: (_value: any, _evt: KeyboardEvent) => any;
         onKeyup?: (_value: any, _evt: KeyboardEvent) => any;
         onClear?: () => any;
+        onSearch?: (evt: Event) => any;
         onEnter?: (_value: any, _evt: KeyboardEvent) => any;
         "onUpdate:modelValue"?: (_value: any, _evt: KeyboardEvent) => any;
     }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -141,6 +142,7 @@ declare const BkInput: {
         compositionstart: (evt: CompositionEvent) => CompositionEvent;
         compositionupdate: (evt: CompositionEvent) => CompositionEvent;
         compositionend: (evt: CompositionEvent) => CompositionEvent;
+        search: (evt: Event) => Event;
     }, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{
         type: import("vue-types").VueTypeValidableDef<string> & {
             default: string;
@@ -266,6 +268,7 @@ declare const BkInput: {
         onKeypress?: (_value: any, _evt: KeyboardEvent) => any;
         onKeyup?: (_value: any, _evt: KeyboardEvent) => any;
         onClear?: () => any;
+        onSearch?: (evt: Event) => any;
         onEnter?: (_value: any, _evt: KeyboardEvent) => any;
         "onUpdate:modelValue"?: (_value: any, _evt: KeyboardEvent) => any;
     }, {
@@ -429,6 +432,7 @@ declare const BkInput: {
         onKeypress?: (_value: any, _evt: KeyboardEvent) => any;
         onKeyup?: (_value: any, _evt: KeyboardEvent) => any;
         onClear?: () => any;
+        onSearch?: (evt: Event) => any;
         onEnter?: (_value: any, _evt: KeyboardEvent) => any;
         "onUpdate:modelValue"?: (_value: any, _evt: KeyboardEvent) => any;
     }, () => JSX.Element, {}, {}, {}, {
@@ -589,6 +593,7 @@ declare const BkInput: {
     onKeypress?: (_value: any, _evt: KeyboardEvent) => any;
     onKeyup?: (_value: any, _evt: KeyboardEvent) => any;
     onClear?: () => any;
+    onSearch?: (evt: Event) => any;
     onEnter?: (_value: any, _evt: KeyboardEvent) => any;
     "onUpdate:modelValue"?: (_value: any, _evt: KeyboardEvent) => any;
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -606,6 +611,7 @@ declare const BkInput: {
     compositionstart: (evt: CompositionEvent) => CompositionEvent;
     compositionupdate: (evt: CompositionEvent) => CompositionEvent;
     compositionend: (evt: CompositionEvent) => CompositionEvent;
+    search: (evt: Event) => Event;
 }, string, {
     type: string;
     prefix: string;

package/lib/input/index.js

@@ -1658,6 +1658,7 @@ var EVENTS;
   EVENTS["KEYUP"] = "keyup";
   EVENTS["PASTE"] = "paste";
   EVENTS["UPDATE"] = "update:modelValue";
+  EVENTS["SEARCH"] = "search";
 })(EVENTS || (EVENTS = {}));
 /* eslint-disable-next-line */
 function EventFunction(_value, _evt) {
@@ -1676,7 +1677,9 @@ var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_definePro
   return evt;
 }), EVENTS.CHANGE, EventFunction), EVENTS.CLEAR, function () {
   return true;
-}), EVENTS.INPUT, EventFunction), EVENTS.KEYPRESS, EventFunction), EVENTS.KEYDOWN, EventFunction), EVENTS.KEYUP, EventFunction), EVENTS.ENTER, EventFunction), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_inputEmitEventsType, EVENTS.PASTE, PastEventFunction), EVENTS.COMPOSITIONSTART, CompositionEventFunction), EVENTS.COMPOSITIONUPDATE, CompositionEventFunction), EVENTS.COMPOSITIONEND, CompositionEventFunction));
+}), EVENTS.INPUT, EventFunction), EVENTS.KEYPRESS, EventFunction), EVENTS.KEYDOWN, EventFunction), EVENTS.KEYUP, EventFunction), EVENTS.ENTER, EventFunction), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_inputEmitEventsType, EVENTS.PASTE, PastEventFunction), EVENTS.COMPOSITIONSTART, CompositionEventFunction), EVENTS.COMPOSITIONUPDATE, CompositionEventFunction), EVENTS.COMPOSITIONEND, CompositionEventFunction), EVENTS.SEARCH, function (evt) {
+  return evt;
+}));
 /* harmony default export */ const input = ((0,external_vue_namespaceObject.defineComponent)({
   name: 'Input',
   directives: {
@@ -1714,7 +1717,9 @@ var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_definePro
     var suffixCls = getCls('suffix-icon');
     var suffixIconMap = {
       search: function search() {
-        return (0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Search, null, null);
+        return (0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Search, {
+          "onClick": handleSearch
+        }, null);
       },
       password: function password() {
         return (0,external_vue_namespaceObject.createVNode)(icon_namespaceObject.Unvisible, {
@@ -1889,6 +1894,10 @@ var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_definePro
         formItem === null || formItem === void 0 || (_formItem$validate2 = formItem.validate) === null || _formItem$validate2 === void 0 || _formItem$validate2.call(formItem, 'blur');
       }
     }
+    // type = search suffix icon click event
+    function handleSearch(e) {
+      ctx.emit(EVENTS.SEARCH, e);
+    }
     // 事件句柄生成器
     function eventHandler(eventName) {
       return function (e) {

package/lib/input/input.d.ts

@@ -131,7 +131,8 @@ export declare const enum EVENTS {
     KEYPRESS = "keypress",
     KEYUP = "keyup",
     PASTE = "paste",
-    UPDATE = "update:modelValue"
+    UPDATE = "update:modelValue",
+    SEARCH = "search"
 }
 declare function EventFunction(_value: any, _evt: KeyboardEvent): any;
 declare function PastEventFunction(_value: any, _e: ClipboardEvent): boolean;
@@ -151,6 +152,7 @@ export declare const inputEmitEventsType: {
     compositionstart: typeof CompositionEventFunction;
     compositionupdate: typeof CompositionEventFunction;
     compositionend: typeof CompositionEventFunction;
+    search: (evt: Event) => Event;
 };
 export type InputType = ExtractPropTypes<typeof inputType>;
 declare const _default: import("vue").DefineComponent<{
@@ -280,6 +282,7 @@ declare const _default: import("vue").DefineComponent<{
     compositionstart: typeof CompositionEventFunction;
     compositionupdate: typeof CompositionEventFunction;
     compositionend: typeof CompositionEventFunction;
+    search: (evt: Event) => Event;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     type: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
@@ -405,6 +408,7 @@ declare const _default: import("vue").DefineComponent<{
     onKeypress?: (_value: any, _evt: KeyboardEvent) => any;
     onKeyup?: (_value: any, _evt: KeyboardEvent) => any;
     onClear?: () => any;
+    onSearch?: (evt: Event) => any;
     onEnter?: (_value: any, _evt: KeyboardEvent) => any;
     "onUpdate:modelValue"?: (_value: any, _evt: KeyboardEvent) => any;
 }, {

package/lib/modal/index.js

@@ -418,8 +418,11 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
       ctx.emit('close');
     };
     var handleClickOutSide = function handleClickOutSide(e) {
-      e.stopImmediatePropagation();
-      e.stopPropagation();
+      var target = e.target;
+      // 判断点击的是否是当前 Dialog 的 mask（而不是子 Dialog 的 mask）
+      if (target !== maskRef.value) {
+        return; // 不是当前 Dialog 的 mask，不处理
+      }
       e.preventDefault();
       if (props.quickClose) {
         ctx.emit('quick-close');

package/lib/search-select/index.d.ts

@@ -34,9 +34,9 @@ declare const BkSearchSelect: {
         };
     }>> & {
         onCopy?: (...args: any[]) => any;
+        onSearch?: (...args: any[]) => any;
         "onUpdate:modelValue"?: (...args: any[]) => any;
         onSelectKey?: (...args: any[]) => any;
-        onSearch?: (...args: any[]) => any;
     }, {
         inputRef: import("vue").Ref<import("vue").CreateComponentPublicInstance<Readonly<import("vue").ExtractPropTypes<{
             data: {
@@ -436,9 +436,9 @@ declare const BkSearchSelect: {
         };
     }>> & {
         onCopy?: (...args: any[]) => any;
+        onSearch?: (...args: any[]) => any;
         "onUpdate:modelValue"?: (...args: any[]) => any;
         onSelectKey?: (...args: any[]) => any;
-        onSearch?: (...args: any[]) => any;
     }, {
         data: Omit<import("./utils").ISearchItem, "value" | "isSelected">[];
         maxHeight: number;
@@ -500,9 +500,9 @@ declare const BkSearchSelect: {
         };
     }>> & {
         onCopy?: (...args: any[]) => any;
+        onSearch?: (...args: any[]) => any;
         "onUpdate:modelValue"?: (...args: any[]) => any;
         onSelectKey?: (...args: any[]) => any;
-        onSearch?: (...args: any[]) => any;
     }, {
         inputRef: import("vue").Ref<import("vue").CreateComponentPublicInstance<Readonly<import("vue").ExtractPropTypes<{
             data: {
@@ -914,9 +914,9 @@ declare const BkSearchSelect: {
     };
 }>> & {
     onCopy?: (...args: any[]) => any;
+    onSearch?: (...args: any[]) => any;
     "onUpdate:modelValue"?: (...args: any[]) => any;
     onSelectKey?: (...args: any[]) => any;
-    onSearch?: (...args: any[]) => any;
 }, {
     inputRef: import("vue").Ref<import("vue").CreateComponentPublicInstance<Readonly<import("vue").ExtractPropTypes<{
         data: {

package/lib/search-select/search-select.d.ts

@@ -467,9 +467,9 @@ declare const _default: import("vue").DefineComponent<{
     };
 }>> & {
     onCopy?: (...args: any[]) => any;
+    onSearch?: (...args: any[]) => any;
     "onUpdate:modelValue"?: (...args: any[]) => any;
     onSelectKey?: (...args: any[]) => any;
-    onSearch?: (...args: any[]) => any;
 }, {
     data: Omit<ISearchItem, "value" | "isSelected">[];
     maxHeight: number;

package/lib/select/index.js

@@ -4294,6 +4294,9 @@ function select_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { v
     var handleInputChange = function handleInputChange(value) {
       if (!filterable.value) return;
       customOptionName.value = value;
+      if (!(value !== null && value !== void 0 && value.length)) {
+        emitChange(multiple.value ? [] : '');
+      }
     };
     // allow create(创建自定义选项)
     var handleCreateCustomOption = function handleCreateCustomOption(val, e) {

package/lib/sideslider/index.d.ts

@@ -10,6 +10,31 @@ declare const BkSideslider: {
             default: string;
             validator: (value: string) => boolean;
         };
+        resizable: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+        minWidth: import("vue-types").VueTypeValidableDef<number> & {
+            default: number;
+        } & {
+            default: number;
+        };
+        maxWidth: import("vue-types").VueTypeValidableDef<number> & {
+            default: number;
+        } & {
+            default: number;
+        };
+        triggerWidth: import("vue-types").VueTypeValidableDef<number> & {
+            default: number;
+        } & {
+            default: number;
+        };
+        immediate: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
         isShow: import("vue-types").VueTypeValidableDef<boolean> & {
             default: boolean;
         } & {
@@ -75,8 +100,11 @@ declare const BkSideslider: {
         onShown?: (...args: any[]) => any;
         onClosed?: (...args: any[]) => any;
         "onUpdate:isShow"?: (...args: any[]) => any;
+        "onBefore-resize"?: (...args: any[]) => any;
+        onResizing?: (...args: any[]) => any;
+        "onAfter-resize"?: (...args: any[]) => any;
         "onAnimation-end"?: (...args: any[]) => any;
-    }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("hidden" | "shown" | "closed" | "update:isShow" | "animation-end")[], import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{
+    }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("hidden" | "shown" | "closed" | "update:isShow" | "before-resize" | "resizing" | "after-resize" | "animation-end")[], import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{
         title: import("vue-types").VueTypeValidableDef<string> & {
             default: string;
         } & {
@@ -87,6 +115,31 @@ declare const BkSideslider: {
             default: string;
             validator: (value: string) => boolean;
         };
+        resizable: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+        minWidth: import("vue-types").VueTypeValidableDef<number> & {
+            default: number;
+        } & {
+            default: number;
+        };
+        maxWidth: import("vue-types").VueTypeValidableDef<number> & {
+            default: number;
+        } & {
+            default: number;
+        };
+        triggerWidth: import("vue-types").VueTypeValidableDef<number> & {
+            default: number;
+        } & {
+            default: number;
+        };
+        immediate: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
         isShow: import("vue-types").VueTypeValidableDef<boolean> & {
             default: boolean;
         } & {
@@ -152,9 +205,13 @@ declare const BkSideslider: {
         onShown?: (...args: any[]) => any;
         onClosed?: (...args: any[]) => any;
         "onUpdate:isShow"?: (...args: any[]) => any;
+        "onBefore-resize"?: (...args: any[]) => any;
+        onResizing?: (...args: any[]) => any;
+        "onAfter-resize"?: (...args: any[]) => any;
         "onAnimation-end"?: (...args: any[]) => any;
     }, {
         title: string;
+        maxWidth: number;
         extCls: string;
         left: string;
         top: string;
@@ -163,6 +220,7 @@ declare const BkSideslider: {
         backgroundColor: string;
         transfer: string | boolean | HTMLElement;
         direction: string;
+        resizable: boolean;
         fullscreen: boolean;
         showMask: boolean;
         closeIcon: boolean;
@@ -170,6 +228,9 @@ declare const BkSideslider: {
         quickClose: boolean;
         animateType: string;
         beforeClose: () => boolean | Promise<boolean>;
+        minWidth: number;
+        triggerWidth: number;
+        immediate: boolean;
     }, true, {}, {}, {
         P: {};
         B: {};
@@ -188,6 +249,31 @@ declare const BkSideslider: {
             default: string;
             validator: (value: string) => boolean;
         };
+        resizable: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+        minWidth: import("vue-types").VueTypeValidableDef<number> & {
+            default: number;
+        } & {
+            default: number;
+        };
+        maxWidth: import("vue-types").VueTypeValidableDef<number> & {
+            default: number;
+        } & {
+            default: number;
+        };
+        triggerWidth: import("vue-types").VueTypeValidableDef<number> & {
+            default: number;
+        } & {
+            default: number;
+        };
+        immediate: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
         isShow: import("vue-types").VueTypeValidableDef<boolean> & {
             default: boolean;
         } & {
@@ -253,9 +339,13 @@ declare const BkSideslider: {
         onShown?: (...args: any[]) => any;
         onClosed?: (...args: any[]) => any;
         "onUpdate:isShow"?: (...args: any[]) => any;
+        "onBefore-resize"?: (...args: any[]) => any;
+        onResizing?: (...args: any[]) => any;
+        "onAfter-resize"?: (...args: any[]) => any;
         "onAnimation-end"?: (...args: any[]) => any;
     }, () => JSX.Element, {}, {}, {}, {
         title: string;
+        maxWidth: number;
         extCls: string;
         left: string;
         top: string;
@@ -264,6 +354,7 @@ declare const BkSideslider: {
         backgroundColor: string;
         transfer: string | boolean | HTMLElement;
         direction: string;
+        resizable: boolean;
         fullscreen: boolean;
         showMask: boolean;
         closeIcon: boolean;
@@ -271,6 +362,9 @@ declare const BkSideslider: {
         quickClose: boolean;
         animateType: string;
         beforeClose: () => boolean | Promise<boolean>;
+        minWidth: number;
+        triggerWidth: number;
+        immediate: boolean;
     }>;
     __isFragment?: never;
     __isTeleport?: never;
@@ -286,6 +380,31 @@ declare const BkSideslider: {
         default: string;
         validator: (value: string) => boolean;
     };
+    resizable: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    } & {
+        default: boolean;
+    };
+    minWidth: import("vue-types").VueTypeValidableDef<number> & {
+        default: number;
+    } & {
+        default: number;
+    };
+    maxWidth: import("vue-types").VueTypeValidableDef<number> & {
+        default: number;
+    } & {
+        default: number;
+    };
+    triggerWidth: import("vue-types").VueTypeValidableDef<number> & {
+        default: number;
+    } & {
+        default: number;
+    };
+    immediate: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    } & {
+        default: boolean;
+    };
     isShow: import("vue-types").VueTypeValidableDef<boolean> & {
         default: boolean;
     } & {
@@ -351,9 +470,13 @@ declare const BkSideslider: {
     onShown?: (...args: any[]) => any;
     onClosed?: (...args: any[]) => any;
     "onUpdate:isShow"?: (...args: any[]) => any;
+    "onBefore-resize"?: (...args: any[]) => any;
+    onResizing?: (...args: any[]) => any;
+    "onAfter-resize"?: (...args: any[]) => any;
     "onAnimation-end"?: (...args: any[]) => any;
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("hidden" | "shown" | "closed" | "update:isShow" | "animation-end")[], "hidden" | "shown" | "closed" | "update:isShow" | "animation-end", {
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("hidden" | "shown" | "closed" | "update:isShow" | "before-resize" | "resizing" | "after-resize" | "animation-end")[], "hidden" | "shown" | "closed" | "update:isShow" | "before-resize" | "resizing" | "after-resize" | "animation-end", {
     title: string;
+    maxWidth: number;
     extCls: string;
     left: string;
     top: string;
@@ -362,6 +485,7 @@ declare const BkSideslider: {
     backgroundColor: string;
     transfer: string | boolean | HTMLElement;
     direction: string;
+    resizable: boolean;
     fullscreen: boolean;
     showMask: boolean;
     closeIcon: boolean;
@@ -369,5 +493,8 @@ declare const BkSideslider: {
     quickClose: boolean;
     animateType: string;
     beforeClose: () => boolean | Promise<boolean>;
+    minWidth: number;
+    triggerWidth: number;
+    immediate: boolean;
 }, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("vue").Plugin<any[]>;
 export default BkSideslider;

package/lib/sideslider/index.js

@@ -506,7 +506,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, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["getCurrentInstance"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.getCurrentInstance, ["isVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.isVNode, ["mergeProps"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.mergeProps, ["useAttrs"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.useAttrs, ["useSlots"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.useSlots });
+const external_vue_namespaceObject = external_vue_x({ ["Fragment"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.Fragment, ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["getCurrentInstance"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.getCurrentInstance, ["isVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.isVNode, ["mergeProps"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.mergeProps, ["nextTick"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.nextTick, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["useAttrs"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.useAttrs, ["useSlots"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.useSlots, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch, ["withModifiers"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.withModifiers });
 // EXTERNAL MODULE: ../../node_modules/@babel/runtime/regenerator/index.js
 var regenerator = __webpack_require__(2841);
 var regenerator_default = /*#__PURE__*/__webpack_require__.n(regenerator);
@@ -591,9 +591,14 @@ sliderProps.width["default"] = '400';
         }
         return true;
       }
-    }
+    },
+    resizable: shared_namespaceObject.PropTypes.bool.def(false),
+    minWidth: shared_namespaceObject.PropTypes.number.def(400),
+    maxWidth: shared_namespaceObject.PropTypes.number.def(Infinity),
+    triggerWidth: shared_namespaceObject.PropTypes.number.def(5),
+    immediate: shared_namespaceObject.PropTypes.bool.def(false) // 是否实时拖拽（拖拽时立即改变宽度）
   }),
-  emits: ['closed', 'update:isShow', 'shown', 'hidden', 'animation-end'],
+  emits: ['closed', 'update:isShow', 'shown', 'hidden', 'animation-end', 'before-resize', 'resizing', 'after-resize'],
   setup: function setup(props, _ref) {
     var emit = _ref.emit;
     var attrs = (0,external_vue_namespaceObject.useAttrs)();
@@ -601,6 +606,20 @@ sliderProps.width["default"] = '400';
     var instance = (0,external_vue_namespaceObject.getCurrentInstance)();
     var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
       resolveClassName = _usePrefix.resolveClassName;
+    // 拖拽相关状态
+    var currentWidth = (0,external_vue_namespaceObject.ref)(typeof props.width === 'number' ? props.width : parseInt(props.width) || 400);
+    // 代理线
+    var resizeProxyRef = (0,external_vue_namespaceObject.ref)(null);
+    // 遮罩
+    var resizeMaskRef = (0,external_vue_namespaceObject.ref)(null);
+    // modalWrapper
+    var modalWrapperRef = (0,external_vue_namespaceObject.ref)(null);
+    // content
+    var contentRef = (0,external_vue_namespaceObject.ref)(null);
+    // trigger
+    var triggerRef = (0,external_vue_namespaceObject.ref)(null);
+    // state
+    var state = (0,external_vue_namespaceObject.ref)({});
     var handleClose = /*#__PURE__*/function () {
       var _ref2 = _asyncToGenerator( /*#__PURE__*/regenerator_default().mark(function _callee() {
         var shouldClose;
@@ -634,10 +653,118 @@ sliderProps.width["default"] = '400';
     }();
     var handleShown = function handleShown() {
       emit('shown');
+      // 当侧边栏显示后，获取 modalWrapper 的引用
+      if (props.resizable && contentRef.value) {
+        (0,external_vue_namespaceObject.nextTick)(function () {
+          var _contentRef$value;
+          // 从当前实例的 content 元素向上查找 modal-wrapper，避免多个实例冲突
+          var element = (_contentRef$value = contentRef.value) === null || _contentRef$value === void 0 ? void 0 : _contentRef$value.parentElement;
+          while (element) {
+            if (element.classList.contains(resolveClassName('modal-wrapper'))) {
+              modalWrapperRef.value = element;
+              break;
+            }
+            element = element.parentElement;
+          }
+        });
+      }
     };
     var handleHidden = function handleHidden() {
       emit('hidden');
+      // 清理引用
+      if (props.resizable) {
+        modalWrapperRef.value = null;
+      }
     };
+    // 获取实际宽度值（限制在 min 和 max 之间）
+    var getRealValue = function getRealValue(current) {
+      var screenWidth = window.innerWidth;
+      var maxAllowed = Math.min(props.maxWidth, screenWidth - 100); // 至少留100px空间
+      return Math.min(maxAllowed, Math.max(props.minWidth, current));
+    };
+    // 更新 resizeProxy 的样式
+    var updateResizeProxyStyle = function updateResizeProxyStyle(width) {
+      if (!resizeProxyRef.value) return;
+      resizeProxyRef.value.style.visibility = 'visible';
+      if (props.direction === 'left') {
+        resizeProxyRef.value.style.inset = "0 auto 0 ".concat(width, "px");
+      } else {
+        resizeProxyRef.value.style.inset = "0 ".concat(width, "px 0 auto");
+      }
+    };
+    // 更新遮罩的样式
+    var updateResizeMaskStyle = function updateResizeMaskStyle(show) {
+      if (!resizeMaskRef.value) return;
+      resizeMaskRef.value.style.display = show ? 'block' : 'none';
+      resizeMaskRef.value.style.cursor = 'col-resize';
+    };
+    // mousedown 事件处理
+    var handleMousedown = function handleMousedown(event) {
+      var _modalWrapperRef$valu;
+      var mouseEvent = event;
+      if (!props.resizable) return;
+      emit('before-resize', mouseEvent);
+      var rect = (_modalWrapperRef$valu = modalWrapperRef.value) === null || _modalWrapperRef$valu === void 0 ? void 0 : _modalWrapperRef$valu.getBoundingClientRect();
+      if (!rect) return;
+      // 在 immediate 模式下，先同步 currentWidth 为实际宽度，避免闪动
+      if (props.immediate) {
+        currentWidth.value = rect.width;
+      }
+      state.value = Object.freeze({
+        mouse: {
+          clientX: mouseEvent.clientX
+        },
+        sidebar: {
+          width: rect.width
+        }
+      });
+      updateResizeMaskStyle(true);
+      // 非 immediate 模式下显示代理线
+      if (!props.immediate) {
+        updateResizeProxyStyle(rect.width);
+      }
+      var finalWidth = rect.width;
+      var handleMouseMove = function handleMouseMove(event) {
+        var delta;
+        if (props.direction === 'left') {
+          delta = event.clientX - state.value.mouse.clientX;
+        } else {
+          delta = state.value.mouse.clientX - event.clientX;
+        }
+        var newWidth = state.value.sidebar.width + delta;
+        finalWidth = getRealValue(newWidth);
+        // immediate 模式：直接更新宽度
+        if (props.immediate) {
+          currentWidth.value = finalWidth;
+        } else {
+          // 非 immediate 模式：更新代理线位置
+          updateResizeProxyStyle(finalWidth);
+        }
+        emit('resizing', finalWidth);
+      };
+      var handleMouseUp = function handleMouseUp() {
+        if (resizeProxyRef.value) {
+          resizeProxyRef.value.style.visibility = 'hidden';
+        }
+        updateResizeMaskStyle(false);
+        document.removeEventListener('mousemove', handleMouseMove);
+        document.removeEventListener('mouseup', handleMouseUp);
+        // 只在非 immediate 模式下才需要最后更新宽度
+        if (!props.immediate) {
+          currentWidth.value = finalWidth;
+        }
+        emit('after-resize', finalWidth);
+      };
+      document.addEventListener('mousemove', handleMouseMove);
+      document.addEventListener('mouseup', handleMouseUp);
+    };
+    // 监听 width prop 变化
+    (0,external_vue_namespaceObject.watch)(function () {
+      return props.width;
+    }, function (newWidth) {
+      var width = typeof newWidth === 'number' ? newWidth : parseInt(newWidth) || 400;
+      currentWidth.value = width;
+    });
     return function () {
       var modelSlot = {
         header: function header() {
@@ -656,8 +783,17 @@ sliderProps.width["default"] = '400';
         "default": function _default() {
           var _slots$default;
           return (0,external_vue_namespaceObject.createVNode)("div", {
+            "ref": contentRef,
             "class": "".concat(resolveClassName('sideslider-content'))
-          }, [(_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)]);
+          }, [(_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots), props.resizable && (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [(0,external_vue_namespaceObject.createVNode)("i", {
+            "ref": triggerRef,
+            "style": "width: ".concat(props.triggerWidth, "px;"),
+            "class": "".concat(resolveClassName('sideslider-resize-trigger')),
+            "onMousedown": (0,external_vue_namespaceObject.withModifiers)(handleMousedown, ['left'])
+          }, null), (0,external_vue_namespaceObject.createVNode)("i", {
+            "ref": resizeProxyRef,
+            "class": ["".concat(resolveClassName('sideslider-resize-proxy')), props.direction]
+          }, null)])]);
         }
       };
       if (slots.footer) {
@@ -673,9 +809,9 @@ sliderProps.width["default"] = '400';
       if (instance.vnode.scopeId) {
         inheritAttrs[instance.vnode.scopeId] = '';
       }
-      return (0,external_vue_namespaceObject.createVNode)(modal_namespaceObject["default"], (0,external_vue_namespaceObject.mergeProps)(inheritAttrs, {
-        "width": props.width,
-        "class": _defineProperty(_defineProperty({}, resolveClassName('sideslider'), true), "is-position-".concat(props.direction), props.direction),
+      return (0,external_vue_namespaceObject.createVNode)(external_vue_namespaceObject.Fragment, null, [(0,external_vue_namespaceObject.createVNode)(modal_namespaceObject["default"], (0,external_vue_namespaceObject.mergeProps)(inheritAttrs, {
+        "width": currentWidth.value,
+        "class": _defineProperty(_defineProperty(_defineProperty({}, resolveClassName('sideslider'), true), "is-position-".concat(props.direction), props.direction), "".concat(resolveClassName('sideslider-resizable')), props.resizable),
         "extCls": props.extCls,
         "animateType": props.direction,
         "backgroundColor": props.backgroundColor,
@@ -694,7 +830,10 @@ sliderProps.width["default"] = '400';
         "default": function _default() {
           return [modelSlot];
         }
-      });
+      }), props.resizable && (0,external_vue_namespaceObject.createVNode)("div", {
+        "ref": resizeMaskRef,
+        "class": "".concat(resolveClassName('sideslider-resize-mask'))
+      }, null)]);
     };
   }
 }));