@element-plus/nightly 0.0.20260119 → 0.0.20260121

package/es/components/dialog/src/dialog.vue2.mjs

@@ -1,10 +1,10 @@
-import { defineComponent, useSlots, computed, ref, provide, createBlock, openBlock, unref, withCtx, createVNode, Transition, mergeProps, withDirectives, createElementVNode, normalizeStyle, normalizeClass, createCommentVNode, createSlots, renderSlot, vShow } from 'vue';
+import { defineComponent, mergeDefaults, useSlots, computed, ref, provide, createBlock, openBlock, unref, withCtx, createVNode, Transition, mergeProps, withDirectives, createElementVNode, normalizeStyle, normalizeClass, createCommentVNode, createSlots, renderSlot, vShow } from 'vue';
 import { ElOverlay } from '../../overlay/index.mjs';
 import ElFocusTrap from '../../focus-trap/src/focus-trap.vue.mjs';
 import { ElTeleport } from '../../teleport/index.mjs';
 import _sfc_main$1 from './dialog-content.vue2.mjs';
 import { dialogInjectionKey } from './constants.mjs';
-import { dialogEmits, dialogProps } from './dialog.mjs';
+import { dialogEmits, dialogPropsDefaults } from './dialog.mjs';
 import { useDialog } from './use-dialog.mjs';
 import { useDeprecated } from '../../../hooks/use-deprecated/index.mjs';
 import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
@@ -17,7 +17,39 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     inheritAttrs: false
   },
   __name: "dialog",
-  props: dialogProps,
+  props: /* @__PURE__ */ mergeDefaults({
+    appendToBody: { type: Boolean, required: false },
+    appendTo: { type: null, required: false },
+    beforeClose: { type: Function, required: false },
+    destroyOnClose: { type: Boolean, required: false },
+    closeOnClickModal: { type: Boolean, required: false },
+    closeOnPressEscape: { type: Boolean, required: false },
+    lockScroll: { type: Boolean, required: false },
+    modal: { type: Boolean, required: false },
+    modalPenetrable: { type: Boolean, required: false },
+    openDelay: { type: Number, required: false },
+    closeDelay: { type: Number, required: false },
+    top: { type: String, required: false },
+    modelValue: { type: Boolean, required: false },
+    modalClass: { type: String, required: false },
+    width: { type: [String, Number], required: false },
+    zIndex: { type: Number, required: false },
+    trapFocus: { type: Boolean, required: false },
+    headerAriaLevel: { type: String, required: false },
+    transition: { type: [String, Object], required: false },
+    center: { type: Boolean, required: false },
+    alignCenter: { type: Boolean, required: false },
+    closeIcon: { type: null, required: false },
+    draggable: { type: Boolean, required: false },
+    overflow: { type: Boolean, required: false },
+    fullscreen: { type: Boolean, required: false },
+    headerClass: { type: String, required: false },
+    bodyClass: { type: String, required: false },
+    footerClass: { type: String, required: false },
+    showClose: { type: Boolean, required: false },
+    title: { type: String, required: false },
+    ariaLevel: { type: String, required: false }
+  }, dialogPropsDefaults),
   emits: dialogEmits,
   setup(__props, { expose: __expose }) {
     const props = __props;
@@ -81,8 +113,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(ElTeleport), {
-        to: _ctx.appendTo,
-        disabled: _ctx.appendTo !== "body" ? false : !_ctx.appendToBody
+        to: __props.appendTo,
+        disabled: __props.appendTo !== "body" ? false : !__props.appendToBody
       }, {
         default: withCtx(() => [
           createVNode(
@@ -94,9 +126,9 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
                 return [
                   withDirectives(createVNode(unref(ElOverlay), {
                     "custom-mask-event": "",
-                    mask: _ctx.modal,
+                    mask: __props.modal,
                     "overlay-class": [
-                      (_a = _ctx.modalClass) != null ? _a : "",
+                      (_a = __props.modalClass) != null ? _a : "",
                       `${unref(ns).namespace.value}-modal-dialog`,
                       unref(ns).is("penetrable", penetrable.value)
                     ],
@@ -106,8 +138,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
                       createElementVNode("div", {
                         role: "dialog",
                         "aria-modal": "true",
-                        "aria-label": _ctx.title || void 0,
-                        "aria-labelledby": !_ctx.title ? unref(titleId) : void 0,
+                        "aria-label": __props.title || void 0,
+                        "aria-labelledby": !__props.title ? unref(titleId) : void 0,
                         "aria-describedby": unref(bodyId),
                         class: normalizeClass([
                           `${unref(ns).namespace.value}-overlay-dialog`,
@@ -136,18 +168,18 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
                               ref_key: "dialogContentRef",
                               ref: dialogContentRef
                             }, _ctx.$attrs, {
-                              center: _ctx.center,
+                              center: __props.center,
                               "align-center": unref(_alignCenter),
-                              "close-icon": _ctx.closeIcon,
+                              "close-icon": __props.closeIcon,
                               draggable: unref(_draggable),
                               overflow: unref(_overflow),
-                              fullscreen: _ctx.fullscreen,
-                              "header-class": _ctx.headerClass,
-                              "body-class": _ctx.bodyClass,
-                              "footer-class": _ctx.footerClass,
-                              "show-close": _ctx.showClose,
-                              title: _ctx.title,
-                              "aria-level": _ctx.headerAriaLevel,
+                              fullscreen: __props.fullscreen,
+                              "header-class": __props.headerClass,
+                              "body-class": __props.bodyClass,
+                              "footer-class": __props.footerClass,
+                              "show-close": __props.showClose,
+                              title: __props.title,
+                              "aria-level": __props.headerAriaLevel,
                               onClose: unref(handleClose)
                             }), createSlots({
                               header: withCtx(() => [

package/es/components/dialog/src/dialog.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.vue2.mjs","sources":["../../../../../../packages/components/dialog/src/dialog.vue"],"sourcesContent":["<template>\n  <el-teleport\n    :to=\"appendTo\"\n    :disabled=\"appendTo !== 'body' ? false : !appendToBody\"\n  >\n    <transition v-bind=\"transitionConfig\">\n      <el-overlay\n        v-show=\"visible\"\n        custom-mask-event\n        :mask=\"modal\"\n        :overlay-class=\"[\n          modalClass ?? '',\n          `${ns.namespace.value}-modal-dialog`,\n          ns.is('penetrable', penetrable),\n        ]\"\n        :z-index=\"zIndex\"\n      >\n        <div\n          role=\"dialog\"\n          aria-modal=\"true\"\n          :aria-label=\"title || undefined\"\n          :aria-labelledby=\"!title ? titleId : undefined\"\n          :aria-describedby=\"bodyId\"\n          :class=\"[\n            `${ns.namespace.value}-overlay-dialog`,\n            ns.is('closing', closing),\n          ]\"\n          :style=\"overlayDialogStyle\"\n          @click=\"overlayEvent.onClick\"\n          @mousedown=\"overlayEvent.onMousedown\"\n          @mouseup=\"overlayEvent.onMouseup\"\n        >\n          <el-focus-trap\n            loop\n            :trapped=\"visible\"\n            focus-start-el=\"container\"\n            @focus-after-trapped=\"onOpenAutoFocus\"\n            @focus-after-released=\"onCloseAutoFocus\"\n            @focusout-prevented=\"onFocusoutPrevented\"\n            @release-requested=\"onCloseRequested\"\n          >\n            <el-dialog-content\n              v-if=\"rendered\"\n              ref=\"dialogContentRef\"\n              v-bind=\"$attrs\"\n              :center=\"center\"\n              :align-center=\"_alignCenter\"\n              :close-icon=\"closeIcon\"\n              :draggable=\"_draggable\"\n              :overflow=\"_overflow\"\n              :fullscreen=\"fullscreen\"\n              :header-class=\"headerClass\"\n              :body-class=\"bodyClass\"\n              :footer-class=\"footerClass\"\n              :show-close=\"showClose\"\n              :title=\"title\"\n              :aria-level=\"headerAriaLevel\"\n              @close=\"handleClose\"\n            >\n              <template #header>\n                <slot\n                  v-if=\"!$slots.title\"\n                  name=\"header\"\n                  :close=\"handleClose\"\n                  :title-id=\"titleId\"\n                  :title-class=\"ns.e('title')\"\n                />\n                <slot v-else name=\"title\" />\n              </template>\n              <slot />\n              <template v-if=\"$slots.footer\" #footer>\n                <slot name=\"footer\" />\n              </template>\n            </el-dialog-content>\n          </el-focus-trap>\n        </div>\n      </el-overlay>\n    </transition>\n  </el-teleport>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, provide, ref, useSlots } from 'vue'\nimport { ElOverlay } from '@element-plus/components/overlay'\nimport { useDeprecated, useNamespace, useSameTarget } from '@element-plus/hooks'\nimport ElFocusTrap from '@element-plus/components/focus-trap'\nimport ElTeleport from '@element-plus/components/teleport'\nimport ElDialogContent from './dialog-content.vue'\nimport { dialogInjectionKey } from './constants'\nimport { dialogEmits, dialogProps } from './dialog'\nimport { useDialog } from './use-dialog'\n\ndefineOptions({\n  name: 'ElDialog',\n  inheritAttrs: false,\n})\n\nconst props = defineProps(dialogProps)\ndefineEmits(dialogEmits)\nconst slots = useSlots()\n\nuseDeprecated(\n  {\n    scope: 'el-dialog',\n    from: 'the title slot',\n    replacement: 'the header slot',\n    version: '3.0.0',\n    ref: 'https://element-plus.org/en-US/component/dialog.html#slots',\n  },\n  computed(() => !!slots.title)\n)\n\nconst ns = useNamespace('dialog')\nconst dialogRef = ref<HTMLElement>()\nconst headerRef = ref<HTMLElement>()\nconst dialogContentRef = ref()\n\nconst {\n  visible,\n  titleId,\n  bodyId,\n  style,\n  overlayDialogStyle,\n  rendered,\n  transitionConfig,\n  zIndex,\n  _draggable,\n  _alignCenter,\n  _overflow,\n  handleClose,\n  onModalClick,\n  onOpenAutoFocus,\n  onCloseAutoFocus,\n  onCloseRequested,\n  onFocusoutPrevented,\n  closing,\n} = useDialog(props, dialogRef)\n\nprovide(dialogInjectionKey, {\n  dialogRef,\n  headerRef,\n  bodyId,\n  ns,\n  rendered,\n  style,\n})\n\nconst overlayEvent = useSameTarget(onModalClick)\n\nconst penetrable = computed(\n  () => props.modalPenetrable && !props.modal && !props.fullscreen\n)\n\nconst resetPosition = () => {\n  dialogContentRef.value?.resetPosition()\n}\n\ndefineExpose({\n  /** @description whether the dialog is visible */\n  visible,\n  dialogContentRef,\n  resetPosition,\n  handleClose,\n})\n</script>\n"],"names":["_createBlock","_unref","appendTo","appendToBody","_createVNode","_Transition","_mergeProps","modal","modalClass","_createElementVNode","title","_normalizeClass","_openBlock","ElDialogContent","$attrs","center","closeIcon","fullscreen","headerClass","bodyClass","footerClass","showClose","headerAriaLevel","$slots","_renderSlot"],"mappings":"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"}
+{"version":3,"file":"dialog.vue2.mjs","sources":["../../../../../../packages/components/dialog/src/dialog.vue"],"sourcesContent":["<template>\n  <el-teleport\n    :to=\"appendTo\"\n    :disabled=\"appendTo !== 'body' ? false : !appendToBody\"\n  >\n    <transition v-bind=\"transitionConfig\">\n      <el-overlay\n        v-show=\"visible\"\n        custom-mask-event\n        :mask=\"modal\"\n        :overlay-class=\"[\n          modalClass ?? '',\n          `${ns.namespace.value}-modal-dialog`,\n          ns.is('penetrable', penetrable),\n        ]\"\n        :z-index=\"zIndex\"\n      >\n        <div\n          role=\"dialog\"\n          aria-modal=\"true\"\n          :aria-label=\"title || undefined\"\n          :aria-labelledby=\"!title ? titleId : undefined\"\n          :aria-describedby=\"bodyId\"\n          :class=\"[\n            `${ns.namespace.value}-overlay-dialog`,\n            ns.is('closing', closing),\n          ]\"\n          :style=\"overlayDialogStyle\"\n          @click=\"overlayEvent.onClick\"\n          @mousedown=\"overlayEvent.onMousedown\"\n          @mouseup=\"overlayEvent.onMouseup\"\n        >\n          <el-focus-trap\n            loop\n            :trapped=\"visible\"\n            focus-start-el=\"container\"\n            @focus-after-trapped=\"onOpenAutoFocus\"\n            @focus-after-released=\"onCloseAutoFocus\"\n            @focusout-prevented=\"onFocusoutPrevented\"\n            @release-requested=\"onCloseRequested\"\n          >\n            <el-dialog-content\n              v-if=\"rendered\"\n              ref=\"dialogContentRef\"\n              v-bind=\"$attrs\"\n              :center=\"center\"\n              :align-center=\"_alignCenter\"\n              :close-icon=\"closeIcon\"\n              :draggable=\"_draggable\"\n              :overflow=\"_overflow\"\n              :fullscreen=\"fullscreen\"\n              :header-class=\"headerClass\"\n              :body-class=\"bodyClass\"\n              :footer-class=\"footerClass\"\n              :show-close=\"showClose\"\n              :title=\"title\"\n              :aria-level=\"headerAriaLevel\"\n              @close=\"handleClose\"\n            >\n              <template #header>\n                <slot\n                  v-if=\"!$slots.title\"\n                  name=\"header\"\n                  :close=\"handleClose\"\n                  :title-id=\"titleId\"\n                  :title-class=\"ns.e('title')\"\n                />\n                <slot v-else name=\"title\" />\n              </template>\n              <slot />\n              <template v-if=\"$slots.footer\" #footer>\n                <slot name=\"footer\" />\n              </template>\n            </el-dialog-content>\n          </el-focus-trap>\n        </div>\n      </el-overlay>\n    </transition>\n  </el-teleport>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, provide, ref, useSlots } from 'vue'\nimport { ElOverlay } from '@element-plus/components/overlay'\nimport { useDeprecated, useNamespace, useSameTarget } from '@element-plus/hooks'\nimport ElFocusTrap from '@element-plus/components/focus-trap'\nimport ElTeleport from '@element-plus/components/teleport'\nimport ElDialogContent from './dialog-content.vue'\nimport { dialogInjectionKey } from './constants'\nimport { dialogEmits, dialogPropsDefaults } from './dialog'\nimport { useDialog } from './use-dialog'\n\nimport type { DialogProps } from './dialog'\n\ndefineOptions({\n  name: 'ElDialog',\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<DialogProps>(), dialogPropsDefaults)\ndefineEmits(dialogEmits)\nconst slots = useSlots()\n\nuseDeprecated(\n  {\n    scope: 'el-dialog',\n    from: 'the title slot',\n    replacement: 'the header slot',\n    version: '3.0.0',\n    ref: 'https://element-plus.org/en-US/component/dialog.html#slots',\n  },\n  computed(() => !!slots.title)\n)\n\nconst ns = useNamespace('dialog')\nconst dialogRef = ref<HTMLElement>()\nconst headerRef = ref<HTMLElement>()\nconst dialogContentRef = ref()\n\nconst {\n  visible,\n  titleId,\n  bodyId,\n  style,\n  overlayDialogStyle,\n  rendered,\n  transitionConfig,\n  zIndex,\n  _draggable,\n  _alignCenter,\n  _overflow,\n  handleClose,\n  onModalClick,\n  onOpenAutoFocus,\n  onCloseAutoFocus,\n  onCloseRequested,\n  onFocusoutPrevented,\n  closing,\n} = useDialog(props, dialogRef)\n\nprovide(dialogInjectionKey, {\n  dialogRef,\n  headerRef,\n  bodyId,\n  ns,\n  rendered,\n  style,\n})\n\nconst overlayEvent = useSameTarget(onModalClick)\n\nconst penetrable = computed(\n  () => props.modalPenetrable && !props.modal && !props.fullscreen\n)\n\nconst resetPosition = () => {\n  dialogContentRef.value?.resetPosition()\n}\n\ndefineExpose({\n  /** @description whether the dialog is visible */\n  visible,\n  dialogContentRef,\n  resetPosition,\n  handleClose,\n})\n</script>\n"],"names":["_createBlock","_unref","_createVNode","_Transition","_mergeProps","_createElementVNode","_normalizeClass","_openBlock","ElDialogContent","$attrs","$slots","_renderSlot"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmGA,IAAA,MAAM,KAAA,GAAQ,OAAA;AAEd,IAAA,MAAM,QAAQ,QAAA,EAAS;AAEvB,IAAA,aAAA;AAAA,MACE;AAAA,QACE,KAAA,EAAO,WAAA;AAAA,QACP,IAAA,EAAM,gBAAA;AAAA,QACN,WAAA,EAAa,iBAAA;AAAA,QACb,OAAA,EAAS,OAAA;AAAA,QACT,GAAA,EAAK;AAAA,OACP;AAAA,MACA,QAAA,CAAS,MAAM,CAAC,CAAC,MAAM,KAAK;AAAA,KAC9B;AAEA,IAAA,MAAM,EAAA,GAAK,aAAa,QAAQ,CAAA;AAChC,IAAA,MAAM,YAAY,GAAA,EAAiB;AACnC,IAAA,MAAM,YAAY,GAAA,EAAiB;AACnC,IAAA,MAAM,mBAAmB,GAAA,EAAI;AAE7B,IAAA,MAAM;AAAA,MACJ,OAAA;AAAA,MACA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,KAAA;AAAA,MACA,kBAAA;AAAA,MACA,QAAA;AAAA,MACA,gBAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,eAAA;AAAA,MACA,gBAAA;AAAA,MACA,gBAAA;AAAA,MACA,mBAAA;AAAA,MACA;AAAA,KACF,GAAI,SAAA,CAAU,KAAA,EAAO,SAAS,CAAA;AAE9B,IAAA,OAAA,CAAQ,kBAAA,EAAoB;AAAA,MAC1B,SAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,EAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,YAAA,GAAe,cAAc,YAAY,CAAA;AAE/C,IAAA,MAAM,UAAA,GAAa,QAAA;AAAA,MACjB,MAAM,KAAA,CAAM,eAAA,IAAmB,CAAC,KAAA,CAAM,KAAA,IAAS,CAAC,KAAA,CAAM;AAAA,KACxD;AAEA,IAAA,MAAM,gBAAgB,MAAM;;AAC1B,MAAA,CAAA,EAAA,GAAA,gBAAA,CAAiB,UAAjB,IAAA,GAAA,MAAA,GAAA,EAAA,CAAwB,aAAA,EAAA;AAAA,IAC1B,CAAA;AAEA,IAAA,QAAA,CAAa;AAAA;AAAA,MAEX,OAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,MACA;AAAA,KACD,CAAA;;0BApKCA,WAAA,CA6EcC,KAAA,CAAA,UAAA,CAAA,EAAA;AAAA,QA5EX,IAAI,OAAA,CAAA,QAAA;AAAA,QACJ,UAAU,OAAA,CAAA,QAAA,KAAQ,MAAA,GAAA,KAAA,GAAA,CAAuB,OAAA,CAAA;AAAA;yBAE1C,MAwEa;AAAA,UAxEbC,WAAA;AAAA,YAwEaC,UAAA;AAAA,YAxEbC,WAwEaH,KAAA,oBAxEuB,EAApC,SAAA,EAAA,IAwEa,CAAA;AAAA,YAAA;AAAA,+BAvEX,MAsEa;;AAAA,gBAAA,OAAA;AAAA,iCAtEbC,WAAA,CAsEaD,KAAA,CAAA,SAAA,CAAA,EAAA;AAAA,oBApEX,mBAAA,EAAA,EAAA;AAAA,oBACC,MAAM,OAAA,CAAA,KAAA;AAAA,oBACN,eAAA,EAAa;AAAA,sBAAA,CAAc,EAAA,GAAA,OAAA,CAAA,eAAA,IAAA,GAAA,EAAA,GAAU,EAAA;AAAA,yBAAqBA,KAAA,CAAA,EAAA,CAAA,CAAG,UAAU,KAAK,CAAA,aAAA,CAAA;AAAA,sBAA2BA,MAAA,EAAA,CAAA,CAAG,EAAA,CAAE,YAAA,EAAe,WAAA,KAAU;AAAA;oBAKrI,SAAA,EAASA,MAAA,MAAA;AAAA;qCAEV,MA0DM;AAAA,sBA1DNI,mBA0DM,KAAA,EAAA;AAAA,wBAzDJ,IAAA,EAAK,QAAA;AAAA,wBACL,YAAA,EAAW,MAAA;AAAA,wBACV,YAAA,EAAY,QAAA,KAAA,IAAS,MAAA;AAAA,wBACrB,mBAAe,CAAG,OAAA,CAAA,KAAA,GAAQJ,KAAA,CAAA,OAAA,CAAA,GAAU,MAAA;AAAA,wBACpC,kBAAA,EAAkBA,MAAA,MAAA,CAAA;AAAA,wBAClB,OAAKK,cAAA,CAAA;AAAA,6BAAmBL,KAAA,CAAA,EAAA,CAAA,CAAG,UAAU,KAAK,CAAA,eAAA,CAAA;AAAA,0BAA+BA,MAAA,EAAA,CAAA,CAAG,GAAE,SAAA,EAAYA,KAAA,CAAA,OAAA,CAAO;AAAA;wBAIjG,KAAA,iBAAOA,KAAA,CAAA,kBAAA,CAAkB,CAAA;AAAA,wBACzB,OAAA,EAAK,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA;AAAA,wBAAE,CAAA,GAAA,IAAA,KAAAA,KAAA,CAAA,YAAA,CAAA,CAAa,OAAA,IAAbA,KAAA,CAAA,YAAA,CAAA,CAAa,OAAA,CAAO,GAAA,IAAA,CAAA,CAAA;AAAA,wBAC3B,WAAA,EAAS,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA;AAAA,wBAAE,CAAA,GAAA,IAAA,KAAAA,KAAA,CAAA,YAAA,CAAA,CAAa,WAAA,IAAbA,KAAA,CAAA,YAAA,CAAA,CAAa,WAAA,CAAW,GAAA,IAAA,CAAA,CAAA;AAAA,wBACnC,SAAA,EAAO,MAAA,CAAA,CAAA,CAAA,KAAA,OAAA,CAAA,CAAA;AAAA,wBAAE,CAAA,GAAA,IAAA,KAAAA,KAAA,CAAA,YAAA,CAAA,CAAa,SAAA,IAAbA,KAAA,CAAA,YAAA,CAAA,CAAa,SAAA,CAAS,GAAA,IAAA,CAAA;AAAA;wBAEhCC,WAAA,CA0CgBD,KAAA,CAAA,WAAA,CAAA,EAAA;AAAA,0BAzCd,IAAA,EAAA,EAAA;AAAA,0BACC,OAAA,EAASA,MAAA,OAAA,CAAA;AAAA,0BACV,gBAAA,EAAe,WAAA;AAAA,0BACd,mBAAA,EAAqBA,MAAA,eAAA,CAAA;AAAA,0BACrB,oBAAA,EAAsBA,MAAA,gBAAA,CAAA;AAAA,0BACtB,mBAAA,EAAoBA,MAAA,mBAAA,CAAA;AAAA,0BACpB,kBAAA,EAAmBA,MAAA,gBAAA;AAAA;2CAEpB,MAgCoB;AAAA,4BA/BZA,MAAA,QAAA,CAAA,IADRM,WAAA,EAAAP,WAAA,CAgCoBQ,aAhCpBJ,UAAA,CAgCoB;AAAA;uCA9Bd,kBAAA;AAAA,8BAAJ,GAAA,EAAI;AAAA,+BACIK,KAAAA,MAAAA,EAAM;AAAA,8BACb,QAAQ,OAAA,CAAA,MAAA;AAAA,8BACR,cAAA,EAAcR,MAAA,YAAA,CAAA;AAAA,8BACd,cAAY,OAAA,CAAA,SAAA;AAAA,8BACZ,SAAA,EAAWA,MAAA,UAAA,CAAA;AAAA,8BACX,QAAA,EAAUA,MAAA,SAAA,CAAA;AAAA,8BACV,YAAY,OAAA,CAAA,UAAA;AAAA,8BACZ,gBAAc,OAAA,CAAA,WAAA;AAAA,8BACd,cAAY,OAAA,CAAA,SAAA;AAAA,8BACZ,gBAAc,OAAA,CAAA,WAAA;AAAA,8BACd,cAAY,OAAA,CAAA,SAAA;AAAA,8BACZ,OAAO,OAAA,CAAA,KAAA;AAAA,8BACP,cAAY,OAAA,CAAA,eAAA;AAAA,8BACZ,OAAA,EAAOA,MAAA,WAAA;AAAA;8BAEG,MAAA,UACT,MAME;AAAA,gCALOS,CAAAA,IAAAA,CAAAA,MAAAA,CAAO,QADhBC,UAAA,CAME,IAAA,CAAA,QAAA,QAAA,EAAA;AAAA;kCAHC,KAAA,EAAOV,MAAA,WAAA,CAAA;AAAA,kCACP,OAAA,EAAUA,MAAA,OAAA,CAAA;AAAA,kCACV,UAAA,EAAaA,KAAA,CAAA,EAAA,CAAA,CAAG,EAAC,OAAA;AAAA,qCAEpBU,UAAA,CAA4B,IAAA,CAAA,QAAA,OAAA,EAAA,EAAA,GAAA,EAAA,CAAA,EAAA;AAAA;+CAE9B,MAAQ;AAAA,gCAARA,UAAA,CAAQ,IAAA,CAAA,MAAA,EAAA,SAAA;AAAA;;;;8BACQD,IAAAA,CAAAA,OAAO,MAAA;sCAAS,QAAA;AAAA,4CAC9B,MAAsB;AAAA,kCAAtBC,UAAA,CAAsB,IAAA,CAAA,MAAA,EAAA,QAAA;AAAA;;;;;;;;;;;;;4BAhEtBV,KAAA,CAAA,OAAA,CAAO;AAAA;;;;;;;;;;;;;;;;;;;"}

package/es/components/dialog/src/use-dialog.d.ts

@@ -21,13 +21,13 @@ export declare const useDialog: (props: DialogProps, targetRef: Ref<HTMLElement
     visible: Ref<boolean>;
     zIndex: Ref<number>;
     transitionConfig: import("vue").ComputedRef<TransitionProps | {
-        name: string | TransitionProps;
+        name: import("./dialog").DialogTransition;
         onAfterEnter: () => void;
         onBeforeLeave: () => void;
         onAfterLeave: () => void;
     }>;
     _draggable: import("vue").ComputedRef<boolean>;
-    _alignCenter: import("vue").ComputedRef<import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>>;
-    _overflow: import("vue").ComputedRef<import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>>;
+    _alignCenter: import("vue").ComputedRef<boolean>;
+    _overflow: import("vue").ComputedRef<boolean>;
     closing: Ref<boolean>;
 };

package/es/components/drawer/src/composables/useResizable.d.ts

@@ -1,6 +1,6 @@
 import type { Ref, SetupContext } from 'vue';
 import type { DrawerEmits, DrawerProps } from '../drawer';
-export declare function useResizable(props: DrawerProps, target: Ref<HTMLElement | undefined>, emit: SetupContext<DrawerEmits>['emit']): {
+export declare function useResizable(props: DrawerProps & Required<Pick<DrawerProps, 'direction'>>, target: Ref<HTMLElement | undefined>, emit: SetupContext<DrawerEmits>['emit']): {
     size: import("vue").ComputedRef<string | undefined>;
     isResizing: Ref<boolean>;
     isHorizontal: import("vue").ComputedRef<boolean>;

package/es/components/drawer/src/composables/useResizable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useResizable.mjs","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,\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"],"names":["cleanup"],"mappings":"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"}
+{"version":3,"file":"useResizable.mjs","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"],"names":["cleanup"],"mappings":"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"}

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

@@ -1,4 +1,34 @@
-import type { ExtractPropTypes, ExtractPublicPropTypes } from 'vue';
+import type { ExtractPublicPropTypes } from 'vue';
+import type { DialogProps } from '@element-plus/nightly/es/components/dialog';
+export 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
+     */
+    resizable?: boolean;
+    /**
+     * @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
+     */
+    size?: string | number;
+    /**
+     * @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.
+     */
+    withHeader?: boolean;
+    /**
+     * @description The fade-in and fade-out animation switch of the mask layer
+     */
+    modalFade?: boolean;
+    /**
+     * @description Help assistive technologies such as screen readers identify content hierarchies
+     */
+    headerAriaLevel?: string;
+}
+/**
+ * @deprecated Removed after 3.0.0, Use `DrawerProps` instead.
+ */
 export declare const drawerProps: {
     readonly direction: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, "ltr" | "rtl" | "ttb" | "btt", unknown, "rtl", boolean>;
     readonly resizable: BooleanConstructor;
@@ -62,7 +92,9 @@ export declare const drawerProps: {
     readonly title: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
     readonly ariaLevel: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
 };
-export type DrawerProps = ExtractPropTypes<typeof drawerProps>;
+/**
+ * @deprecated Removed after 3.0.0, Use `DrawerProps` instead.
+ */
 export type DrawerPropsPublic = ExtractPublicPropTypes<typeof drawerProps>;
 export declare const drawerEmits: {
     'resize-start': (evt: MouseEvent, size: number) => boolean;

package/es/components/drawer/src/drawer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.mjs","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 { ExtractPropTypes, ExtractPublicPropTypes } from 'vue'\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\nexport type DrawerProps = ExtractPropTypes<typeof drawerProps>\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"],"names":[],"mappings":";;;AAKO,MAAM,cAAc,UAAA,CAAW;AAAA,EACpC,GAAG,WAAA;AAAA,EACH,SAAA,EAAW;AAAA,IACT,IAAA,EAAM,MAAA;AAAA,IACN,OAAA,EAAS,KAAA;AAAA,IACT,MAAA,EAAQ,CAAC,KAAA,EAAO,KAAA,EAAO,OAAO,KAAK;AAAA,GACrC;AAAA,EACA,SAAA,EAAW,OAAA;AAAA,EACX,IAAA,EAAM;AAAA,IACJ,IAAA,EAAM,CAAC,MAAA,EAAQ,MAAM,CAAA;AAAA,IACrB,OAAA,EAAS;AAAA,GACX;AAAA,EACA,UAAA,EAAY;AAAA,IACV,IAAA,EAAM,OAAA;AAAA,IACN,OAAA,EAAS;AAAA,GACX;AAAA,EACA,SAAA,EAAW;AAAA,IACT,IAAA,EAAM,OAAA;AAAA,IACN,OAAA,EAAS;AAAA,GACX;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM,MAAA;AAAA,IACN,OAAA,EAAS;AAAA;AAEb,CAAU;AAKH,MAAM,WAAA,GAAc;AAAA,EACzB,GAAG,WAAA;AAAA,EACH,gBAAgB,CAAC,GAAA,EAAiB,SAChC,GAAA,YAAe,UAAA,IAAc,OAAO,IAAA,KAAS,QAAA;AAAA,EAC/C,QAAQ,CAAC,GAAA,EAAiB,SACxB,GAAA,YAAe,UAAA,IAAc,OAAO,IAAA,KAAS,QAAA;AAAA,EAC/C,cAAc,CAAC,GAAA,EAAiB,SAC9B,GAAA,YAAe,UAAA,IAAc,OAAO,IAAA,KAAS;AACjD;;;;"}
+{"version":3,"file":"drawer.mjs","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 { 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"],"names":[],"mappings":";;;AAoCO,MAAM,cAAc,UAAA,CAAW;AAAA,EACpC,GAAG,WAAA;AAAA,EACH,SAAA,EAAW;AAAA,IACT,IAAA,EAAM,MAAA;AAAA,IACN,OAAA,EAAS,KAAA;AAAA,IACT,MAAA,EAAQ,CAAC,KAAA,EAAO,KAAA,EAAO,OAAO,KAAK;AAAA,GACrC;AAAA,EACA,SAAA,EAAW,OAAA;AAAA,EACX,IAAA,EAAM;AAAA,IACJ,IAAA,EAAM,CAAC,MAAA,EAAQ,MAAM,CAAA;AAAA,IACrB,OAAA,EAAS;AAAA,GACX;AAAA,EACA,UAAA,EAAY;AAAA,IACV,IAAA,EAAM,OAAA;AAAA,IACN,OAAA,EAAS;AAAA,GACX;AAAA,EACA,SAAA,EAAW;AAAA,IACT,IAAA,EAAM,OAAA;AAAA,IACN,OAAA,EAAS;AAAA,GACX;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM,MAAA;AAAA,IACN,OAAA,EAAS;AAAA;AAEb,CAAU;AAOH,MAAM,WAAA,GAAc;AAAA,EACzB,GAAG,WAAA;AAAA,EACH,gBAAgB,CAAC,GAAA,EAAiB,SAChC,GAAA,YAAe,UAAA,IAAc,OAAO,IAAA,KAAS,QAAA;AAAA,EAC/C,QAAQ,CAAC,GAAA,EAAiB,SACxB,GAAA,YAAe,UAAA,IAAc,OAAO,IAAA,KAAS,QAAA;AAAA,EAC/C,cAAc,CAAC,GAAA,EAAiB,SAC9B,GAAA,YAAe,UAAA,IAAc,OAAO,IAAA,KAAS;AACjD;;;;"}

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

@@ -1,3 +1,4 @@
+import type { DrawerProps } from './drawer';
 declare var __VLS_36: {
     close: () => void;
     titleId: string;
@@ -12,69 +13,27 @@ type __VLS_Slots = {} & {
 } & {
     footer?: (props: typeof __VLS_52) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<{
-    readonly direction: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, "ltr" | "rtl" | "ttb" | "btt", unknown, "rtl", boolean>;
-    readonly resizable: BooleanConstructor;
-    readonly size: import("@element-plus/nightly/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "30%", boolean>;
-    readonly withHeader: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly modalFade: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly headerAriaLevel: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
-    readonly appendToBody: BooleanConstructor;
-    readonly appendTo: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | HTMLElement) | (() => import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>) | ((new (...args: any[]) => string | HTMLElement) | (() => import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>))[], unknown, unknown, "body", boolean>;
-    readonly beforeClose: {
-        readonly type: import("vue").PropType<import("@element-plus/nightly/es/components/dialog").DialogBeforeCloseFn>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    readonly destroyOnClose: BooleanConstructor;
-    readonly closeOnClickModal: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly closeOnPressEscape: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly lockScroll: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly modal: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly modalPenetrable: BooleanConstructor;
-    readonly openDelay: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
-    readonly closeDelay: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
-    readonly top: {
-        readonly type: import("vue").PropType<string>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    readonly modelValue: BooleanConstructor;
-    readonly modalClass: StringConstructor;
-    readonly headerClass: StringConstructor;
-    readonly bodyClass: StringConstructor;
-    readonly footerClass: StringConstructor;
-    readonly width: {
-        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    readonly zIndex: {
-        readonly type: import("vue").PropType<number>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    readonly trapFocus: BooleanConstructor;
-    readonly transition: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition) | ((new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition))[], unknown, unknown, undefined, boolean>;
-    readonly center: BooleanConstructor;
-    readonly alignCenter: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-    readonly closeIcon: {
-        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    readonly draggable: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-    readonly overflow: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-    readonly fullscreen: BooleanConstructor;
-    readonly showClose: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly title: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
-    readonly ariaLevel: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
-}, {
+declare const __VLS_base: import("vue").DefineComponent<__VLS_WithDefaultsLocal<__VLS_TypePropsToOption<DrawerProps>, {
+    direction: string;
+    size: string;
+    withHeader: boolean;
+    modalFade: boolean;
+    headerAriaLevel: string;
+    appendTo: "body";
+    closeOnClickModal: true;
+    closeOnPressEscape: true;
+    lockScroll: true;
+    modal: true;
+    openDelay: 0;
+    closeDelay: 0;
+    transition: undefined;
+    alignCenter: undefined;
+    draggable: undefined;
+    overflow: undefined;
+    showClose: true;
+    title: "";
+    ariaLevel: "2";
+}>, {
     handleClose: () => void;
     afterEnter: () => void;
     afterLeave: () => void;
@@ -89,69 +48,27 @@ declare const __VLS_base: import("vue").DefineComponent<{
     closeAutoFocus: () => void;
     "resize-start": (evt: MouseEvent, size: number) => void;
     "resize-end": (evt: MouseEvent, size: number) => void;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    readonly direction: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, "ltr" | "rtl" | "ttb" | "btt", unknown, "rtl", boolean>;
-    readonly resizable: BooleanConstructor;
-    readonly size: import("@element-plus/nightly/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "30%", boolean>;
-    readonly withHeader: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly modalFade: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly headerAriaLevel: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
-    readonly appendToBody: BooleanConstructor;
-    readonly appendTo: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | HTMLElement) | (() => import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>) | ((new (...args: any[]) => string | HTMLElement) | (() => import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>))[], unknown, unknown, "body", boolean>;
-    readonly beforeClose: {
-        readonly type: import("vue").PropType<import("@element-plus/nightly/es/components/dialog").DialogBeforeCloseFn>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    readonly destroyOnClose: BooleanConstructor;
-    readonly closeOnClickModal: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly closeOnPressEscape: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly lockScroll: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly modal: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly modalPenetrable: BooleanConstructor;
-    readonly openDelay: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
-    readonly closeDelay: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
-    readonly top: {
-        readonly type: import("vue").PropType<string>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    readonly modelValue: BooleanConstructor;
-    readonly modalClass: StringConstructor;
-    readonly headerClass: StringConstructor;
-    readonly bodyClass: StringConstructor;
-    readonly footerClass: StringConstructor;
-    readonly width: {
-        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    readonly zIndex: {
-        readonly type: import("vue").PropType<number>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    readonly trapFocus: BooleanConstructor;
-    readonly transition: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition) | ((new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition))[], unknown, unknown, undefined, boolean>;
-    readonly center: BooleanConstructor;
-    readonly alignCenter: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-    readonly closeIcon: {
-        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    readonly draggable: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-    readonly overflow: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-    readonly fullscreen: BooleanConstructor;
-    readonly showClose: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-    readonly title: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
-    readonly ariaLevel: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
-}>> & {
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaultsLocal<__VLS_TypePropsToOption<DrawerProps>, {
+    direction: string;
+    size: string;
+    withHeader: boolean;
+    modalFade: boolean;
+    headerAriaLevel: string;
+    appendTo: "body";
+    closeOnClickModal: true;
+    closeOnPressEscape: true;
+    lockScroll: true;
+    modal: true;
+    openDelay: 0;
+    closeDelay: 0;
+    transition: undefined;
+    alignCenter: undefined;
+    draggable: undefined;
+    overflow: undefined;
+    showClose: true;
+    title: "";
+    ariaLevel: "2";
+}>>> & {
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onResize?: ((evt: MouseEvent, size: number) => any) | undefined;
     onClose?: (() => any) | undefined;
@@ -163,39 +80,47 @@ declare const __VLS_base: import("vue").DefineComponent<{
     "onResize-start"?: ((evt: MouseEvent, size: number) => any) | undefined;
     "onResize-end"?: ((evt: MouseEvent, size: number) => any) | undefined;
 }, {
-    readonly title: string;
-    readonly center: boolean;
-    readonly direction: import("@element-plus/nightly/es/utils").EpPropMergeType<StringConstructor, "ltr" | "rtl" | "ttb" | "btt", unknown>;
-    readonly overflow: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    readonly transition: import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition) | ((new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("@element-plus/nightly/es/components/dialog").DialogTransition))[], unknown, unknown>;
-    readonly size: import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
-    readonly modelValue: boolean;
-    readonly ariaLevel: string;
-    readonly appendTo: import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>) | ((new (...args: any[]) => string | HTMLElement) | (() => import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>))[], unknown, unknown>;
-    readonly alignCenter: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    readonly draggable: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    readonly showClose: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    readonly fullscreen: boolean;
-    readonly closeOnClickModal: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    readonly closeOnPressEscape: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    readonly lockScroll: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    readonly modal: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    readonly openDelay: number;
-    readonly closeDelay: number;
-    readonly headerAriaLevel: string;
-    readonly appendToBody: boolean;
-    readonly destroyOnClose: boolean;
-    readonly modalPenetrable: boolean;
-    readonly trapFocus: boolean;
-    readonly withHeader: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    readonly modalFade: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    readonly resizable: boolean;
+    title: string;
+    direction: "ltr" | "rtl" | "ttb" | "btt";
+    overflow: boolean;
+    transition: import("@element-plus/nightly/es/components/dialog").DialogTransition;
+    size: string | number;
+    ariaLevel: string;
+    appendTo: string | HTMLElement;
+    alignCenter: boolean;
+    draggable: boolean;
+    showClose: boolean;
+    closeOnClickModal: boolean;
+    closeOnPressEscape: boolean;
+    lockScroll: boolean;
+    modal: boolean;
+    openDelay: number;
+    closeDelay: number;
+    headerAriaLevel: string;
+    withHeader: boolean;
+    modalFade: boolean;
 }, {}>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<Required<T>[K]>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaultsLocal<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_PrettifyLocal<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T as K]: T[K];
+} & {};