@element-plus/nightly 0.0.20261019 → 0.0.20261021

package/lib/components/dialog/src/dialog.vue.d.ts

@@ -23,31 +23,31 @@ declare const __VLS_base: _$vue.DefineComponent<DialogProps, {
   resetPosition: () => void;
   handleClose: () => void;
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+  open: () => void;
   "update:modelValue": (value: boolean) => void;
   close: () => void;
-  open: () => void;
   opened: () => void;
   closed: () => void;
   openAutoFocus: () => void;
   closeAutoFocus: () => void;
 }, string, _$vue.PublicProps, Readonly<DialogProps> & Readonly<{
+  onOpen?: (() => any) | undefined;
   "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
   onClose?: (() => any) | undefined;
-  onOpen?: (() => any) | undefined;
   onOpened?: (() => any) | undefined;
   onClosed?: (() => any) | undefined;
   onOpenAutoFocus?: (() => any) | undefined;
   onCloseAutoFocus?: (() => any) | undefined;
 }>, {
-  appendTo: string | HTMLElement;
-  title: string;
-  transition: DialogTransition;
-  overflow: boolean;
   headerClass: string | false | Record<string, any> | ClassValue[] | null;
+  overflow: boolean;
+  transition: DialogTransition;
+  appendTo: string | HTMLElement;
   bodyClass: string | false | Record<string, any> | ClassValue[] | null;
   footerClass: string | false | Record<string, any> | ClassValue[] | null;
-  closeOnClickModal: boolean;
+  title: string;
   closeOnPressEscape: boolean;
+  closeOnClickModal: boolean;
   lockScroll: boolean;
   modal: boolean;
   openDelay: number;

package/lib/components/divider/src/divider.vue.d.ts

@@ -7,8 +7,8 @@ type __VLS_Slots = {} & {
   default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: _$vue.DefineComponent<DividerProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<DividerProps> & Readonly<{}>, {
-  borderStyle: string;
   direction: "horizontal" | "vertical";
+  borderStyle: string;
   contentPosition: "left" | "center" | "right";
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/lib/components/drawer/index.d.ts

@@ -1,8 +1,8 @@
 import { SFCWithInstall } from "../../utils/vue/typescript.js";
-import { DrawerEmits, DrawerInstance, DrawerProps, DrawerPropsPublic, drawerEmits, drawerProps } from "./src/drawer.js";
+import { DrawerEmits, DrawerInstance, DrawerProps, DrawerPropsPublic, DrawerResizableOptions, drawerEmits, drawerProps } from "./src/drawer.js";
 import _default from "./src/drawer.vue.js";
 
 //#region ../../packages/components/drawer/index.d.ts
 declare const ElDrawer: SFCWithInstall<typeof _default>;
 //#endregion
-export { DrawerEmits, DrawerInstance, DrawerProps, DrawerPropsPublic, ElDrawer, ElDrawer as default, drawerEmits, drawerProps };
+export { DrawerEmits, DrawerInstance, DrawerProps, DrawerPropsPublic, DrawerResizableOptions, ElDrawer, ElDrawer as default, drawerEmits, drawerProps };

package/lib/components/drawer/src/composables/useResizable.js

@@ -1,15 +1,26 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_style = require("../../../../utils/dom/style.js");
+const require_useSize = require("../../../splitter/src/hooks/useSize.js");
 let _vueuse_core = require("@vueuse/core");
 let vue = require("vue");
+let _vue_shared = require("@vue/shared");
 //#region ../../packages/components/drawer/src/composables/useResizable.ts
 function useResizable(props, target, emit) {
 	const { width, height } = (0, _vueuse_core.useWindowSize)();
 	const isHorizontal = (0, vue.computed)(() => ["ltr", "rtl"].includes(props.direction));
 	const sign = (0, vue.computed)(() => ["ltr", "ttb"].includes(props.direction) ? 1 : -1);
 	const windowSize = (0, vue.computed)(() => isHorizontal.value ? width.value : height.value);
+	const resizableOptions = (0, vue.computed)(() => (0, _vue_shared.isObject)(props.resizable) ? props.resizable : {});
+	/**
+	* Parse size string/number to pixels using splitter utilities.
+	*/
+	const parseSizeToPixels = (size, fallback) => {
+		if (require_useSize.isPct(size)) return require_useSize.getPct(size) * windowSize.value;
+		else if (require_useSize.isPx(size)) return require_useSize.getPx(size);
+		return Number(size ?? fallback);
+	};
 	const getSize = (0, vue.computed)(() => {
-		return (0, _vueuse_core.clamp)(startSize.value + sign.value * offset.value, 4, windowSize.value);
+		return (0, _vueuse_core.clamp)(startSize.value + sign.value * offset.value, parseSizeToPixels(resizableOptions.value.minSize, 4), parseSizeToPixels(resizableOptions.value.maxSize, windowSize.value));
 	});
 	const startSize = (0, vue.ref)(0);
 	const offset = (0, vue.ref)(0);

package/lib/components/drawer/src/composables/useResizable.js.map

@@ -1 +1 @@
-{"version":3,"file":"useResizable.js","names":["useWindowSize","computed","clamp","ref","useEventListener","addUnit"],"sources":["../../../../../../../packages/components/drawer/src/composables/useResizable.ts"],"sourcesContent":["import { computed, onBeforeUnmount, ref, watch } from 'vue'\nimport { addUnit } from '@element-plus/utils'\nimport { clamp, useEventListener, useWindowSize } from '@vueuse/core'\n\nimport type { Ref, SetupContext } from 'vue'\nimport type { DrawerEmits, DrawerProps } from '../drawer'\n\nexport function useResizable(\n  props: DrawerProps & Required<Pick<DrawerProps, 'direction'>>,\n  target: Ref<HTMLElement | undefined>,\n  emit: SetupContext<DrawerEmits>['emit']\n) {\n  const { width, height } = useWindowSize()\n\n  const isHorizontal = computed(() => ['ltr', 'rtl'].includes(props.direction))\n  const sign = computed(() =>\n    ['ltr', 'ttb'].includes(props.direction) ? 1 : -1\n  )\n  const windowSize = computed(() =>\n    isHorizontal.value ? width.value : height.value\n  )\n  const getSize = computed(() => {\n    return clamp(\n      startSize.value + sign.value * offset.value,\n      4,\n      windowSize.value\n    )\n  })\n\n  const startSize = ref(0)\n  const offset = ref(0)\n  const isResizing = ref(false)\n  const hasStartedDragging = ref(false)\n  let startPos: number[] = []\n  let cleanups: (() => void)[] = []\n\n  const getActualSize = () => {\n    const drawerEl = target.value?.closest('[aria-modal=\"true\"]') as HTMLElement\n    if (drawerEl) {\n      return isHorizontal.value ? drawerEl.offsetWidth : drawerEl.offsetHeight\n    }\n    return 100\n  }\n\n  watch(\n    () => [props.size, props.resizable] as const,\n    () => {\n      hasStartedDragging.value = false\n      startSize.value = 0\n      offset.value = 0\n      onMouseUp()\n    }\n  )\n\n  const onMousedown = (e: MouseEvent) => {\n    if (!props.resizable) return\n\n    if (!hasStartedDragging.value) {\n      startSize.value = getActualSize()\n      hasStartedDragging.value = true\n    }\n\n    startPos = [e.pageX, e.pageY]\n    isResizing.value = true\n    emit('resize-start', e, startSize.value)\n    cleanups.push(\n      useEventListener(window, 'mouseup', onMouseUp),\n      useEventListener(window, 'mousemove', onMouseMove)\n    )\n  }\n\n  const onMouseMove = (e: MouseEvent) => {\n    const { pageX, pageY } = e\n    const offsetX = pageX - startPos[0]\n    const offsetY = pageY - startPos[1]\n    offset.value = isHorizontal.value ? offsetX : offsetY\n    emit('resize', e, getSize.value)\n  }\n\n  const onMouseUp = (e?: MouseEvent) => {\n    // premature interruption\n    // avoid triggering meaningless execution due to watch size/resizable constraints.\n    if (!isResizing.value) return\n\n    startPos = []\n    startSize.value = getSize.value\n    offset.value = 0\n    isResizing.value = false\n    cleanups.forEach((cleanup) => cleanup?.())\n    cleanups = []\n    if (e) {\n      emit('resize-end', e, startSize.value)\n    }\n  }\n\n  const cleanup = useEventListener(target, 'mousedown', onMousedown)\n\n  onBeforeUnmount(() => {\n    cleanup()\n    onMouseUp()\n  })\n\n  return {\n    size: computed(() => {\n      return hasStartedDragging.value\n        ? `${getSize.value}px`\n        : addUnit(props.size)\n    }),\n    isResizing,\n    isHorizontal,\n  }\n}\n"],"mappings":";;;;;AAOA,SAAgB,aACd,OACA,QACA,MACA;CACA,MAAM,EAAE,OAAO,YAAA,GAAWA,aAAAA,cAAAA,CAAc;CAExC,MAAM,gBAAA,GAAeC,IAAAA,SAAAA,OAAe,CAAC,OAAO,KAAK,CAAC,CAAC,SAAS,MAAM,SAAS,CAAC;CAC5E,MAAM,QAAA,GAAOA,IAAAA,SAAAA,OACX,CAAC,OAAO,KAAK,CAAC,CAAC,SAAS,MAAM,SAAS,IAAI,IAAI,EACjD;CACA,MAAM,cAAA,GAAaA,IAAAA,SAAAA,OACjB,aAAa,QAAQ,MAAM,QAAQ,OAAO,KAC5C;CACA,MAAM,WAAA,GAAUA,IAAAA,SAAAA,OAAe;EAC7B,QAAA,GAAOC,aAAAA,MAAAA,CACL,UAAU,QAAQ,KAAK,QAAQ,OAAO,OACtC,GACA,WAAW,KACb;CACF,CAAC;CAED,MAAM,aAAA,GAAYC,IAAAA,IAAAA,CAAI,CAAC;CACvB,MAAM,UAAA,GAASA,IAAAA,IAAAA,CAAI,CAAC;CACpB,MAAM,cAAA,GAAaA,IAAAA,IAAAA,CAAI,KAAK;CAC5B,MAAM,sBAAA,GAAqBA,IAAAA,IAAAA,CAAI,KAAK;CACpC,IAAI,WAAqB,CAAC;CAC1B,IAAI,WAA2B,CAAC;CAEhC,MAAM,sBAAsB;EAC1B,MAAM,WAAW,OAAO,OAAO,QAAQ,uBAAqB;EAC5D,IAAI,UACF,OAAO,aAAa,QAAQ,SAAS,cAAc,SAAS;EAE9D,OAAO;CACT;CAEA,CAAA,GAAA,IAAA,MAAA,OACQ,CAAC,MAAM,MAAM,MAAM,SAAS,SAC5B;EACJ,mBAAmB,QAAQ;EAC3B,UAAU,QAAQ;EAClB,OAAO,QAAQ;EACf,UAAU;CACZ,CACF;CAEA,MAAM,eAAe,MAAkB;EACrC,IAAI,CAAC,MAAM,WAAW;EAEtB,IAAI,CAAC,mBAAmB,OAAO;GAC7B,UAAU,QAAQ,cAAc;GAChC,mBAAmB,QAAQ;EAC7B;EAEA,WAAW,CAAC,EAAE,OAAO,EAAE,KAAK;EAC5B,WAAW,QAAQ;EACnB,KAAK,gBAAgB,GAAG,UAAU,KAAK;EACvC,SAAS,MAAA,GACPC,aAAAA,iBAAAA,CAAiB,QAAQ,WAAW,SAAS,IAAA,GAC7CA,aAAAA,iBAAAA,CAAiB,QAAQ,aAAa,WAAW,CACnD;CACF;CAEA,MAAM,eAAe,MAAkB;EACrC,MAAM,EAAE,OAAO,UAAU;EACzB,MAAM,UAAU,QAAQ,SAAS;EACjC,MAAM,UAAU,QAAQ,SAAS;EACjC,OAAO,QAAQ,aAAa,QAAQ,UAAU;EAC9C,KAAK,UAAU,GAAG,QAAQ,KAAK;CACjC;CAEA,MAAM,aAAa,MAAmB;EAGpC,IAAI,CAAC,WAAW,OAAO;EAEvB,WAAW,CAAC;EACZ,UAAU,QAAQ,QAAQ;EAC1B,OAAO,QAAQ;EACf,WAAW,QAAQ;EACnB,SAAS,SAAS,YAAY,UAAU,CAAC;EACzC,WAAW,CAAC;EACZ,IAAI,GACF,KAAK,cAAc,GAAG,UAAU,KAAK;CAEzC;CAEA,MAAM,WAAA,GAAUA,aAAAA,iBAAAA,CAAiB,QAAQ,aAAa,WAAW;CAEjE,CAAA,GAAA,IAAA,gBAAA,OAAsB;EACpB,QAAQ;EACR,UAAU;CACZ,CAAC;CAED,OAAO;EACL,OAAA,GAAMH,IAAAA,SAAAA,OAAe;GACnB,OAAO,mBAAmB,QACtB,GAAG,QAAQ,MAAM,MACjBI,cAAAA,QAAQ,MAAM,IAAI;EACxB,CAAC;EACD;EACA;CACF;AACF"}
+{"version":3,"file":"useResizable.js","names":["useWindowSize","computed","isObject","isPct","getPct","isPx","getPx","clamp","ref","useEventListener","addUnit"],"sources":["../../../../../../../packages/components/drawer/src/composables/useResizable.ts"],"sourcesContent":["import { computed, onBeforeUnmount, ref, watch } from 'vue'\nimport { addUnit, isObject } from '@element-plus/utils'\nimport {\n  getPct,\n  getPx,\n  isPct,\n  isPx,\n} from '@element-plus/components/splitter/src/hooks'\nimport { clamp, useEventListener, useWindowSize } from '@vueuse/core'\n\nimport type { Ref, SetupContext } from 'vue'\nimport type { DrawerEmits, DrawerProps } from '../drawer'\n\nexport function useResizable(\n  props: DrawerProps & Required<Pick<DrawerProps, 'direction'>>,\n  target: Ref<HTMLElement | undefined>,\n  emit: SetupContext<DrawerEmits>['emit']\n) {\n  const { width, height } = useWindowSize()\n\n  const isHorizontal = computed(() => ['ltr', 'rtl'].includes(props.direction))\n  const sign = computed(() =>\n    ['ltr', 'ttb'].includes(props.direction) ? 1 : -1\n  )\n  const windowSize = computed(() =>\n    isHorizontal.value ? width.value : height.value\n  )\n  const resizableOptions = computed(() =>\n    isObject(props.resizable) ? props.resizable : {}\n  )\n\n  /**\n   * Parse size string/number to pixels using splitter utilities.\n   */\n  const parseSizeToPixels = (\n    size: string | number | undefined,\n    fallback: number\n  ): number => {\n    if (isPct(size)) {\n      return getPct(size) * windowSize.value\n    } else if (isPx(size)) {\n      return getPx(size)\n    }\n    return Number(size ?? fallback)\n  }\n\n  const getSize = computed(() => {\n    return clamp(\n      startSize.value + sign.value * offset.value,\n      parseSizeToPixels(resizableOptions.value.minSize, 4),\n      parseSizeToPixels(resizableOptions.value.maxSize, windowSize.value)\n    )\n  })\n\n  const startSize = ref(0)\n  const offset = ref(0)\n  const isResizing = ref(false)\n  const hasStartedDragging = ref(false)\n  let startPos: number[] = []\n  let cleanups: (() => void)[] = []\n\n  const getActualSize = () => {\n    const drawerEl = target.value?.closest('[aria-modal=\"true\"]') as HTMLElement\n    if (drawerEl) {\n      return isHorizontal.value ? drawerEl.offsetWidth : drawerEl.offsetHeight\n    }\n    return 100\n  }\n\n  watch(\n    () => [props.size, props.resizable] as const,\n    () => {\n      hasStartedDragging.value = false\n      startSize.value = 0\n      offset.value = 0\n      onMouseUp()\n    }\n  )\n\n  const onMousedown = (e: MouseEvent) => {\n    if (!props.resizable) return\n\n    if (!hasStartedDragging.value) {\n      startSize.value = getActualSize()\n      hasStartedDragging.value = true\n    }\n\n    startPos = [e.pageX, e.pageY]\n    isResizing.value = true\n    emit('resize-start', e, startSize.value)\n    cleanups.push(\n      useEventListener(window, 'mouseup', onMouseUp),\n      useEventListener(window, 'mousemove', onMouseMove)\n    )\n  }\n\n  const onMouseMove = (e: MouseEvent) => {\n    const { pageX, pageY } = e\n    const offsetX = pageX - startPos[0]\n    const offsetY = pageY - startPos[1]\n    offset.value = isHorizontal.value ? offsetX : offsetY\n    emit('resize', e, getSize.value)\n  }\n\n  const onMouseUp = (e?: MouseEvent) => {\n    // premature interruption\n    // avoid triggering meaningless execution due to watch size/resizable constraints.\n    if (!isResizing.value) return\n\n    startPos = []\n    startSize.value = getSize.value\n    offset.value = 0\n    isResizing.value = false\n    cleanups.forEach((cleanup) => cleanup?.())\n    cleanups = []\n    if (e) {\n      emit('resize-end', e, startSize.value)\n    }\n  }\n\n  const cleanup = useEventListener(target, 'mousedown', onMousedown)\n\n  onBeforeUnmount(() => {\n    cleanup()\n    onMouseUp()\n  })\n\n  return {\n    size: computed(() => {\n      return hasStartedDragging.value\n        ? `${getSize.value}px`\n        : addUnit(props.size)\n    }),\n    isResizing,\n    isHorizontal,\n  }\n}\n"],"mappings":"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"}

package/lib/components/drawer/src/drawer.d.ts

@@ -6,15 +6,19 @@ import * as _$vue from "vue";
 import { ExtractPublicPropTypes } from "vue";
 
 //#region ../../packages/components/drawer/src/drawer.d.ts
+interface DrawerResizableOptions {
+  minSize?: number | string;
+  maxSize?: number | string;
+}
 interface DrawerProps extends DialogProps {
   /**
    * @description Set the direction in which the Drawer opens
    */
   direction?: 'ltr' | 'rtl' | 'ttb' | 'btt';
   /**
-   * @description Whether to enable the resizable function for the drawer
+   * @description Whether to enable resizing for the Drawer. The object form allows more fine-grained control.
    */
-  resizable?: boolean;
+  resizable?: boolean | DrawerResizableOptions;
   /**
    * @description The size of the Drawer form, when using the number type, is measured in pixels. When using the string type, please pass in 'x%'; otherwise, it will be interpreted as the number type
    */
@@ -37,7 +41,7 @@ interface DrawerProps extends DialogProps {
  */
 declare const drawerProps: {
   readonly direction: EpPropFinalized<StringConstructor, "ltr" | "rtl" | "ttb" | "btt", unknown, "rtl", boolean>;
-  readonly resizable: BooleanConstructor;
+  readonly resizable: EpPropFinalized<(new (...args: any[]) => boolean | DrawerResizableOptions) | (() => boolean | DrawerResizableOptions) | (((new (...args: any[]) => boolean | DrawerResizableOptions) | (() => boolean | DrawerResizableOptions)) | null)[], unknown, unknown, false, boolean>;
   readonly size: EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "30%", boolean>;
   readonly withHeader: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly modalFade: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
@@ -117,4 +121,4 @@ declare const drawerEmits: {
 type DrawerEmits = typeof drawerEmits;
 type DrawerInstance = InstanceType<typeof _default> & unknown;
 //#endregion
-export { DrawerEmits, DrawerInstance, DrawerProps, DrawerPropsPublic, drawerEmits, drawerProps };
+export { DrawerEmits, DrawerInstance, DrawerProps, DrawerPropsPublic, DrawerResizableOptions, drawerEmits, drawerProps };

package/lib/components/drawer/src/drawer.js

@@ -1,6 +1,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_types = require("../../../utils/types.js");
 const require_runtime = require("../../../utils/vue/props/runtime.js");
 const require_dialog = require("../../dialog/src/dialog.js");
+let _vue_shared = require("@vue/shared");
 //#region ../../packages/components/drawer/src/drawer.ts
 /**
 * @deprecated Removed after 3.0.0, Use `DrawerProps` instead.
@@ -17,7 +19,14 @@ const drawerProps = require_runtime.buildProps({
 			"btt"
 		]
 	},
-	resizable: Boolean,
+	resizable: {
+		type: require_runtime.definePropType([Boolean, Object]),
+		default: false,
+		validator: (val) => {
+			if (require_types.isBoolean(val)) return true;
+			return (val.minSize === void 0 || require_types.isNumber(val.minSize) || (0, _vue_shared.isString)(val.minSize)) && (val.maxSize === void 0 || require_types.isNumber(val.maxSize) || (0, _vue_shared.isString)(val.maxSize));
+		}
+	},
 	size: {
 		type: [String, Number],
 		default: "30%"

package/lib/components/drawer/src/drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.js","names":["buildProps","dialogProps","dialogEmits"],"sources":["../../../../../../packages/components/drawer/src/drawer.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport { dialogEmits, dialogProps } from '@element-plus/components/dialog'\n\nimport type { ExtractPublicPropTypes } from 'vue'\nimport type Drawer from './drawer.vue'\nimport type { DialogProps } from '@element-plus/components/dialog'\n\nexport interface DrawerProps extends DialogProps {\n  /**\n   * @description Set the direction in which the Drawer opens\n   */\n  direction?: 'ltr' | 'rtl' | 'ttb' | 'btt'\n  /**\n   * @description Whether to enable the resizable function for the drawer\n   */\n  resizable?: boolean\n  /**\n   * @description The size of the Drawer form, when using the number type, is measured in pixels. When using the string type, please pass in 'x%'; otherwise, it will be interpreted as the number type\n   */\n  size?: string | number\n  /**\n   * @description You can remove the title from the drawer, so that your drawer will have more space on the screen. If you want to be visited, you must set the title attribute.\n   */\n  withHeader?: boolean\n  /**\n   * @description The fade-in and fade-out animation switch of the mask layer\n   */\n  modalFade?: boolean\n  /**\n   * @description Help assistive technologies such as screen readers identify content hierarchies\n   */\n  headerAriaLevel?: string\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `DrawerProps` instead.\n */\nexport const drawerProps = buildProps({\n  ...dialogProps,\n  direction: {\n    type: String,\n    default: 'rtl',\n    values: ['ltr', 'rtl', 'ttb', 'btt'],\n  },\n  resizable: Boolean,\n  size: {\n    type: [String, Number],\n    default: '30%',\n  },\n  withHeader: {\n    type: Boolean,\n    default: true,\n  },\n  modalFade: {\n    type: Boolean,\n    default: true,\n  },\n  headerAriaLevel: {\n    type: String,\n    default: '2',\n  },\n} as const)\n\n/**\n * @deprecated Removed after 3.0.0, Use `DrawerProps` instead.\n */\nexport type DrawerPropsPublic = ExtractPublicPropTypes<typeof drawerProps>\n\nexport const drawerEmits = {\n  ...dialogEmits,\n  'resize-start': (evt: MouseEvent, size: number) =>\n    evt instanceof MouseEvent && typeof size === 'number',\n  resize: (evt: MouseEvent, size: number) =>\n    evt instanceof MouseEvent && typeof size === 'number',\n  'resize-end': (evt: MouseEvent, size: number) =>\n    evt instanceof MouseEvent && typeof size === 'number',\n}\n\nexport type DrawerEmits = typeof drawerEmits\n\nexport type DrawerInstance = InstanceType<typeof Drawer> & unknown\n"],"mappings":";;;;;;;AAqCA,MAAa,cAAcA,gBAAAA,WAAW;CACpC,GAAGC,eAAAA;CACH,WAAW;EACT,MAAM;EACN,SAAS;EACT,QAAQ;GAAC;GAAO;GAAO;GAAO;EAAK;CACrC;CACA,WAAW;CACX,MAAM;EACJ,MAAM,CAAC,QAAQ,MAAM;EACrB,SAAS;CACX;CACA,YAAY;EACV,MAAM;EACN,SAAS;CACX;CACA,WAAW;EACT,MAAM;EACN,SAAS;CACX;CACA,iBAAiB;EACf,MAAM;EACN,SAAS;CACX;AACF,CAAU;AAOV,MAAa,cAAc;CACzB,GAAGC,eAAAA;CACH,iBAAiB,KAAiB,SAChC,eAAe,cAAc,OAAO,SAAS;CAC/C,SAAS,KAAiB,SACxB,eAAe,cAAc,OAAO,SAAS;CAC/C,eAAe,KAAiB,SAC9B,eAAe,cAAc,OAAO,SAAS;AACjD"}
+{"version":3,"file":"drawer.js","names":["buildProps","dialogProps","definePropType","isBoolean","isNumber","isString","dialogEmits"],"sources":["../../../../../../packages/components/drawer/src/drawer.ts"],"sourcesContent":["import {\n  buildProps,\n  definePropType,\n  isBoolean,\n  isNumber,\n  isString,\n} from '@element-plus/utils'\nimport { dialogEmits, dialogProps } from '@element-plus/components/dialog'\n\nimport type { ExtractPublicPropTypes } from 'vue'\nimport type Drawer from './drawer.vue'\nimport type { DialogProps } from '@element-plus/components/dialog'\n\nexport interface DrawerResizableOptions {\n  minSize?: number | string\n  maxSize?: number | string\n}\n\nexport interface DrawerProps extends DialogProps {\n  /**\n   * @description Set the direction in which the Drawer opens\n   */\n  direction?: 'ltr' | 'rtl' | 'ttb' | 'btt'\n  /**\n   * @description Whether to enable resizing for the Drawer. The object form allows more fine-grained control.\n   */\n  resizable?: boolean | DrawerResizableOptions\n  /**\n   * @description The size of the Drawer form, when using the number type, is measured in pixels. When using the string type, please pass in 'x%'; otherwise, it will be interpreted as the number type\n   */\n  size?: string | number\n  /**\n   * @description You can remove the title from the drawer, so that your drawer will have more space on the screen. If you want to be visited, you must set the title attribute.\n   */\n  withHeader?: boolean\n  /**\n   * @description The fade-in and fade-out animation switch of the mask layer\n   */\n  modalFade?: boolean\n  /**\n   * @description Help assistive technologies such as screen readers identify content hierarchies\n   */\n  headerAriaLevel?: string\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `DrawerProps` instead.\n */\nexport const drawerProps = buildProps({\n  ...dialogProps,\n  direction: {\n    type: String,\n    default: 'rtl',\n    values: ['ltr', 'rtl', 'ttb', 'btt'],\n  },\n  resizable: {\n    type: definePropType<boolean | DrawerResizableOptions>([Boolean, Object]),\n    default: false,\n    validator: (val: boolean | DrawerResizableOptions) => {\n      if (isBoolean(val)) return true\n      return (\n        (val.minSize === undefined ||\n          isNumber(val.minSize) ||\n          isString(val.minSize)) &&\n        (val.maxSize === undefined ||\n          isNumber(val.maxSize) ||\n          isString(val.maxSize))\n      )\n    },\n  },\n  size: {\n    type: [String, Number],\n    default: '30%',\n  },\n  withHeader: {\n    type: Boolean,\n    default: true,\n  },\n  modalFade: {\n    type: Boolean,\n    default: true,\n  },\n  headerAriaLevel: {\n    type: String,\n    default: '2',\n  },\n} as const)\n\n/**\n * @deprecated Removed after 3.0.0, Use `DrawerProps` instead.\n */\nexport type DrawerPropsPublic = ExtractPublicPropTypes<typeof drawerProps>\n\nexport const drawerEmits = {\n  ...dialogEmits,\n  'resize-start': (evt: MouseEvent, size: number) =>\n    evt instanceof MouseEvent && typeof size === 'number',\n  resize: (evt: MouseEvent, size: number) =>\n    evt instanceof MouseEvent && typeof size === 'number',\n  'resize-end': (evt: MouseEvent, size: number) =>\n    evt instanceof MouseEvent && typeof size === 'number',\n}\n\nexport type DrawerEmits = typeof drawerEmits\n\nexport type DrawerInstance = InstanceType<typeof Drawer> & unknown\n"],"mappings":";;;;;;;;;AAgDA,MAAa,cAAcA,gBAAAA,WAAW;CACpC,GAAGC,eAAAA;CACH,WAAW;EACT,MAAM;EACN,SAAS;EACT,QAAQ;GAAC;GAAO;GAAO;GAAO;EAAK;CACrC;CACA,WAAW;EACT,MAAMC,gBAAAA,eAAiD,CAAC,SAAS,MAAM,CAAC;EACxE,SAAS;EACT,YAAY,QAA0C;GACpD,IAAIC,cAAAA,UAAU,GAAG,GAAG,OAAO;GAC3B,QACG,IAAI,YAAY,KAAA,KACfC,cAAAA,SAAS,IAAI,OAAO,MAAA,GACpBC,YAAAA,SAAAA,CAAS,IAAI,OAAO,OACrB,IAAI,YAAY,KAAA,KACfD,cAAAA,SAAS,IAAI,OAAO,MAAA,GACpBC,YAAAA,SAAAA,CAAS,IAAI,OAAO;EAE1B;CACF;CACA,MAAM;EACJ,MAAM,CAAC,QAAQ,MAAM;EACrB,SAAS;CACX;CACA,YAAY;EACV,MAAM;EACN,SAAS;CACX;CACA,WAAW;EACT,MAAM;EACN,SAAS;CACX;CACA,iBAAiB;EACf,MAAM;EACN,SAAS;CACX;AACF,CAAU;AAOV,MAAa,cAAc;CACzB,GAAGC,eAAAA;CACH,iBAAiB,KAAiB,SAChC,eAAe,cAAc,OAAO,SAAS;CAC/C,SAAS,KAAiB,SACxB,eAAe,cAAc,OAAO,SAAS;CAC/C,eAAe,KAAiB,SAC9B,eAAe,cAAc,OAAO,SAAS;AACjD"}

package/lib/components/drawer/src/drawer.vue.d.ts

@@ -21,10 +21,10 @@ type __VLS_Slots = {} & {
 declare const __VLS_base: _$vue.DefineComponent<DrawerProps, {
   handleClose: () => void;
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+  open: () => void;
+  resize: (evt: MouseEvent, size: number) => void;
   "update:modelValue": (value: boolean) => void;
   close: () => void;
-  resize: (evt: MouseEvent, size: number) => void;
-  open: () => void;
   opened: () => void;
   closed: () => void;
   openAutoFocus: () => void;
@@ -32,10 +32,10 @@ declare const __VLS_base: _$vue.DefineComponent<DrawerProps, {
   "resize-start": (evt: MouseEvent, size: number) => void;
   "resize-end": (evt: MouseEvent, size: number) => void;
 }, string, _$vue.PublicProps, Readonly<DrawerProps> & Readonly<{
+  onOpen?: (() => any) | undefined;
+  onResize?: ((evt: MouseEvent, size: number) => any) | undefined;
   "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
   onClose?: (() => any) | undefined;
-  onResize?: ((evt: MouseEvent, size: number) => any) | undefined;
-  onOpen?: (() => any) | undefined;
   onOpened?: (() => any) | undefined;
   onClosed?: (() => any) | undefined;
   onOpenAutoFocus?: (() => any) | undefined;
@@ -43,17 +43,17 @@ declare const __VLS_base: _$vue.DefineComponent<DrawerProps, {
   "onResize-start"?: ((evt: MouseEvent, size: number) => any) | undefined;
   "onResize-end"?: ((evt: MouseEvent, size: number) => any) | undefined;
 }>, {
-  size: string | number;
-  appendTo: string | HTMLElement;
-  title: string;
-  transition: DialogTransition;
   direction: "ltr" | "rtl" | "ttb" | "btt";
-  overflow: boolean;
   headerClass: string | false | Record<string, any> | ClassValue[] | null;
+  size: string | number;
+  overflow: boolean;
+  transition: DialogTransition;
+  appendTo: string | HTMLElement;
   bodyClass: string | false | Record<string, any> | ClassValue[] | null;
   footerClass: string | false | Record<string, any> | ClassValue[] | null;
-  closeOnClickModal: boolean;
+  title: string;
   closeOnPressEscape: boolean;
+  closeOnClickModal: boolean;
   lockScroll: boolean;
   modal: boolean;
   openDelay: number;

package/lib/components/dropdown/src/dropdown-item-impl.vue.d.ts

@@ -57,8 +57,8 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   };
 }>> & Readonly<{
   onClick?: ((...args: any[]) => any) | undefined;
-  onPointermove?: ((...args: any[]) => any) | undefined;
   onPointerleave?: ((...args: any[]) => any) | undefined;
+  onPointermove?: ((...args: any[]) => any) | undefined;
   onClickimpl?: ((...args: any[]) => any) | undefined;
 }>, {
   readonly disabled: boolean;

package/lib/components/dropdown/src/dropdown-item.vue.d.ts

@@ -27,8 +27,8 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     icon: EpPropMergeType<(new (...args: any[]) => (string | _$vue.Component) & {}) | (() => string | _$vue.Component) | (((new (...args: any[]) => (string | _$vue.Component) & {}) | (() => string | _$vue.Component)) | null)[], unknown, unknown> | undefined;
     textValue: string | undefined;
     onClick: ((...args: any[]) => any) | undefined;
-    onPointermove: ((...args: any[]) => any) | undefined;
     onPointerleave: ((...args: any[]) => any) | undefined;
+    onPointermove: ((...args: any[]) => any) | undefined;
   }>;
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, ("click" | "pointerleave" | "pointermove")[], "click" | "pointerleave" | "pointermove", _$vue.PublicProps, Readonly<_$vue.ExtractPropTypes<{
   readonly command: EpPropFinalized<readonly [ObjectConstructor, StringConstructor, NumberConstructor], unknown, unknown, () => {}, boolean>;
@@ -43,8 +43,8 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   };
 }>> & Readonly<{
   onClick?: ((...args: any[]) => any) | undefined;
-  onPointermove?: ((...args: any[]) => any) | undefined;
   onPointerleave?: ((...args: any[]) => any) | undefined;
+  onPointermove?: ((...args: any[]) => any) | undefined;
 }>, {
   readonly disabled: boolean;
   readonly command: EpPropMergeType<readonly [ObjectConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
@@ -69,8 +69,8 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     active: BooleanConstructor;
   }>> & Readonly<{
     onFocus?: ((...args: any[]) => any) | undefined;
-    onKeydown?: ((...args: any[]) => any) | undefined;
     onMousedown?: ((...args: any[]) => any) | undefined;
+    onKeydown?: ((...args: any[]) => any) | undefined;
   }>, {
     active: boolean;
     focusable: boolean;
@@ -146,8 +146,8 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     };
   }>> & Readonly<{
     onClick?: ((...args: any[]) => any) | undefined;
-    onPointermove?: ((...args: any[]) => any) | undefined;
     onPointerleave?: ((...args: any[]) => any) | undefined;
+    onPointermove?: ((...args: any[]) => any) | undefined;
     onClickimpl?: ((...args: any[]) => any) | undefined;
   }>, {
     readonly disabled: boolean;

package/lib/components/dropdown/src/dropdown-menu.vue.d.ts

@@ -13,7 +13,7 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   size: _$vue.ComputedRef<string> | undefined;
   rovingFocusGroupRootStyle: _$vue.Ref<_$vue.StyleValue, _$vue.StyleValue>;
   dropdownKls: _$vue.ComputedRef<string[]>;
-  role: _$vue.ComputedRef<"dialog" | "listbox" | "grid" | "menu" | "tooltip" | "group" | "navigation" | "tree" | undefined>;
+  role: _$vue.ComputedRef<"listbox" | "grid" | "menu" | "tooltip" | "dialog" | "group" | "navigation" | "tree" | undefined>;
   triggerId: _$vue.ComputedRef<string>;
   dropdownListWrapperRef: (el: Element | _$vue.ComponentPublicInstance | null) => void;
   handleKeydown: (event: KeyboardEvent) => void;

package/lib/components/dropdown/src/dropdown.d.ts

@@ -22,7 +22,7 @@ interface IElDropdownInstance {
 }
 declare const dropdownProps: {
   readonly trigger: {
-    readonly type: _$vue.PropType<Arrayable<"hover" | "click" | "contextmenu">>;
+    readonly type: _$vue.PropType<Arrayable<"click" | "hover" | "contextmenu">>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     readonly __epPropKey: true;
@@ -44,12 +44,12 @@ declare const dropdownProps: {
     readonly __epPropKey: true;
   };
   readonly type: {
-    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "" | "default" | "primary" | "success" | "warning" | "info" | "text" | "danger") | (() => "" | "default" | "primary" | "success" | "warning" | "info" | "text" | "danger") | (((new (...args: any[]) => "" | "default" | "primary" | "success" | "warning" | "info" | "text" | "danger") | (() => "" | "default" | "primary" | "success" | "warning" | "info" | "text" | "danger")) | null)[], unknown, unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "" | "default" | "text" | "danger" | "primary" | "success" | "warning" | "info") | (() => "" | "default" | "text" | "danger" | "primary" | "success" | "warning" | "info") | (((new (...args: any[]) => "" | "default" | "text" | "danger" | "primary" | "success" | "warning" | "info") | (() => "" | "default" | "text" | "danger" | "primary" | "success" | "warning" | "info")) | null)[], unknown, unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
-  readonly placement: EpPropFinalized<(new (...args: any[]) => "left" | "right" | "top" | "auto" | "bottom" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement$1) | (((new (...args: any[]) => "left" | "right" | "top" | "auto" | "bottom" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement$1)) | null)[], unknown, unknown, "bottom", boolean>;
+  readonly placement: EpPropFinalized<(new (...args: any[]) => "left" | "right" | "auto" | "top" | "bottom" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement$1) | (((new (...args: any[]) => "left" | "right" | "auto" | "top" | "bottom" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement$1)) | null)[], unknown, unknown, "bottom", boolean>;
   readonly popperOptions: EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | (((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>)) | null)[], unknown, unknown, () => {}, boolean>;
   readonly id: StringConstructor;
   readonly size: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
@@ -64,7 +64,7 @@ declare const dropdownProps: {
   readonly popperClass: EpPropFinalized<(new (...args: any[]) => string | false | Record<string, any> | ClassValue[]) | (() => ClassValue) | (((new (...args: any[]) => string | false | Record<string, any> | ClassValue[]) | (() => ClassValue)) | null)[], unknown, unknown, undefined, boolean>;
   readonly popperStyle: EpPropFinalized<(new (...args: any[]) => string | false | _$vue.CSSProperties | _$vue.StyleValue[]) | (() => _$vue.StyleValue) | (((new (...args: any[]) => string | false | _$vue.CSSProperties | _$vue.StyleValue[]) | (() => _$vue.StyleValue)) | null)[], unknown, unknown, undefined, boolean>;
   readonly disabled: BooleanConstructor;
-  readonly role: EpPropFinalized<StringConstructor, "dialog" | "listbox" | "grid" | "menu" | "tooltip" | "group" | "navigation" | "tree", unknown, "menu", boolean>;
+  readonly role: EpPropFinalized<StringConstructor, "listbox" | "grid" | "menu" | "tooltip" | "dialog" | "group" | "navigation" | "tree", unknown, "menu", boolean>;
   readonly buttonProps: {
     readonly type: _$vue.PropType<Partial<ButtonProps>>;
     readonly required: false;