This commit is contained in:
2025-09-19 14:25:20 +08:00
parent 269893a435
commit fbf3f77229
24949 changed files with 2839404 additions and 0 deletions

View File

@@ -0,0 +1,5 @@
import Drawer from './src/drawer.vue';
import type { SFCWithInstall } from 'element-plus/es/utils';
export declare const ElDrawer: SFCWithInstall<typeof Drawer>;
export default ElDrawer;
export * from './src/drawer';

View File

@@ -0,0 +1,8 @@
import Drawer from './src/drawer2.mjs';
export { drawerEmits, drawerProps } from './src/drawer.mjs';
import { withInstall } from '../../utils/vue/install.mjs';
const ElDrawer = withInstall(Drawer);
export { ElDrawer, ElDrawer as default };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/drawer/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils'\nimport Drawer from './src/drawer.vue'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport const ElDrawer: SFCWithInstall<typeof Drawer> = withInstall(Drawer)\nexport default ElDrawer\n\nexport * from './src/drawer'\n"],"names":[],"mappings":";;;;AAEY,MAAC,QAAQ,GAAG,WAAW,CAAC,MAAM;;;;"}

View File

@@ -0,0 +1,7 @@
import type { Ref } from 'vue';
import type { DrawerProps } from '../drawer';
export declare function useResizable(props: DrawerProps, target: Ref<HTMLElement | undefined>): {
size: import("vue").ComputedRef<string | undefined>;
isResizing: Ref<boolean>;
isHorizontal: import("vue").ComputedRef<boolean>;
};

View File

@@ -0,0 +1,73 @@
import { computed, ref, watch, onBeforeUnmount } from 'vue';
import { useWindowSize, clamp, useEventListener } from '@vueuse/core';
import { addUnit } from '../../../../utils/dom/style.mjs';
function useResizable(props, target) {
const { width, height } = useWindowSize();
const isHorizontal = computed(() => ["ltr", "rtl"].includes(props.direction));
const sign = computed(() => ["ltr", "ttb"].includes(props.direction) ? 1 : -1);
const windowSize = computed(() => isHorizontal.value ? width.value : height.value);
const getSize = computed(() => {
return clamp(startSize.value + sign.value * offset.value, 4, windowSize.value);
});
const startSize = ref(0);
const offset = ref(0);
const isResizing = ref(false);
const hasStartedDragging = ref(false);
let startPos = [];
let cleanups = [];
const getActualSize = () => {
var _a;
const drawerEl = (_a = target.value) == null ? void 0 : _a.closest('[aria-modal="true"]');
if (drawerEl) {
return isHorizontal.value ? drawerEl.offsetWidth : drawerEl.offsetHeight;
}
return 100;
};
watch(() => [props.size, props.resizable], () => {
hasStartedDragging.value = false;
startSize.value = 0;
offset.value = 0;
onMouseUp();
});
const onMousedown = (e) => {
if (!props.resizable)
return;
if (!hasStartedDragging.value) {
startSize.value = getActualSize();
hasStartedDragging.value = true;
}
startPos = [e.pageX, e.pageY];
isResizing.value = true;
cleanups.push(useEventListener(window, "mouseup", onMouseUp), useEventListener(window, "mousemove", onMouseMove));
};
const onMouseMove = (e) => {
const { pageX, pageY } = e;
const offsetX = pageX - startPos[0];
const offsetY = pageY - startPos[1];
offset.value = isHorizontal.value ? offsetX : offsetY;
};
const onMouseUp = () => {
startPos = [];
startSize.value = getSize.value;
offset.value = 0;
isResizing.value = false;
cleanups.forEach((cleanup2) => cleanup2 == null ? void 0 : cleanup2());
cleanups = [];
};
const cleanup = useEventListener(target, "mousedown", onMousedown);
onBeforeUnmount(() => {
cleanup();
onMouseUp();
});
return {
size: computed(() => {
return hasStartedDragging.value ? `${getSize.value}px` : addUnit(props.size);
}),
isResizing,
isHorizontal
};
}
export { useResizable };
//# sourceMappingURL=useResizable.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,75 @@
import type { ExtractPropTypes, __ExtractPublicPropTypes } from 'vue';
export declare const drawerProps: {
readonly direction: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "ltr" | "rtl" | "ttb" | "btt", unknown, "rtl", boolean>;
readonly resizable: BooleanConstructor;
readonly size: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "30%", boolean>;
readonly withHeader: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly modalFade: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly headerAriaLevel: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
readonly appendToBody: BooleanConstructor;
readonly appendTo: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/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/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/es/components/dialog").DialogBeforeCloseFn>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly destroyOnClose: BooleanConstructor;
readonly closeOnClickModal: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly closeOnPressEscape: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly lockScroll: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly modal: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly modalPenetrable: BooleanConstructor;
readonly openDelay: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly closeDelay: import("element-plus/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/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/es/utils").EpPropFinalized<(new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("element-plus/es/components/dialog").DialogTransition) | ((new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("element-plus/es/components/dialog").DialogTransition))[], unknown, unknown, undefined, boolean>;
readonly center: BooleanConstructor;
readonly alignCenter: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly closeIcon: {
readonly type: import("vue").PropType<import("element-plus/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/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly overflow: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly fullscreen: BooleanConstructor;
readonly showClose: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly title: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly ariaLevel: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
};
export type DrawerProps = ExtractPropTypes<typeof drawerProps>;
export type DrawerPropsPublic = __ExtractPublicPropTypes<typeof drawerProps>;
export declare const drawerEmits: {
open: () => boolean;
opened: () => boolean;
close: () => boolean;
closed: () => boolean;
"update:modelValue": (value: boolean) => boolean;
openAutoFocus: () => boolean;
closeAutoFocus: () => boolean;
};

View File

@@ -0,0 +1,32 @@
import { dialogProps, dialogEmits } from '../../dialog/src/dialog.mjs';
import { buildProps } from '../../../utils/vue/props/runtime.mjs';
const drawerProps = buildProps({
...dialogProps,
direction: {
type: String,
default: "rtl",
values: ["ltr", "rtl", "ttb", "btt"]
},
resizable: Boolean,
size: {
type: [String, Number],
default: "30%"
},
withHeader: {
type: Boolean,
default: true
},
modalFade: {
type: Boolean,
default: true
},
headerAriaLevel: {
type: String,
default: "2"
}
});
const drawerEmits = dialogEmits;
export { drawerEmits, drawerProps };
//# sourceMappingURL=drawer.mjs.map

View File

@@ -0,0 +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 = dialogEmits\n"],"names":[],"mappings":";;;AAEY,MAAC,WAAW,GAAG,UAAU,CAAC;AACtC,EAAE,GAAG,WAAW;AAChB,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,KAAK;AAClB,IAAI,MAAM,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;AACxC,GAAG;AACH,EAAE,SAAS,EAAE,OAAO;AACpB,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,eAAe,EAAE;AACnB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,WAAW,GAAG;;;;"}

View File

@@ -0,0 +1,190 @@
declare function __VLS_template(): {
header?(_: {
close: () => void;
titleId: string;
titleClass: string;
}): any;
title?(_: {}): any;
default?(_: {}): any;
footer?(_: {}): any;
};
declare const __VLS_component: import("vue").DefineComponent<{
readonly direction: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "ltr" | "rtl" | "ttb" | "btt", unknown, "rtl", boolean>;
readonly resizable: BooleanConstructor;
readonly size: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "30%", boolean>;
readonly withHeader: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly modalFade: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly headerAriaLevel: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
readonly appendToBody: BooleanConstructor;
readonly appendTo: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/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/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/es/components/dialog").DialogBeforeCloseFn>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly destroyOnClose: BooleanConstructor;
readonly closeOnClickModal: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly closeOnPressEscape: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly lockScroll: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly modal: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly modalPenetrable: BooleanConstructor;
readonly openDelay: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly closeDelay: import("element-plus/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/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/es/utils").EpPropFinalized<(new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("element-plus/es/components/dialog").DialogTransition) | ((new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("element-plus/es/components/dialog").DialogTransition))[], unknown, unknown, undefined, boolean>;
readonly center: BooleanConstructor;
readonly alignCenter: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly closeIcon: {
readonly type: import("vue").PropType<import("element-plus/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/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly overflow: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly fullscreen: BooleanConstructor;
readonly showClose: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly title: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly ariaLevel: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
}, {
handleClose: () => void;
afterEnter: () => void;
afterLeave: () => void;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
open: () => void;
"update:modelValue": (value: boolean) => void;
close: () => void;
opened: () => void;
closed: () => void;
openAutoFocus: () => void;
closeAutoFocus: () => void;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly direction: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "ltr" | "rtl" | "ttb" | "btt", unknown, "rtl", boolean>;
readonly resizable: BooleanConstructor;
readonly size: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "30%", boolean>;
readonly withHeader: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly modalFade: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly headerAriaLevel: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
readonly appendToBody: BooleanConstructor;
readonly appendTo: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/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/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/es/components/dialog").DialogBeforeCloseFn>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly destroyOnClose: BooleanConstructor;
readonly closeOnClickModal: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly closeOnPressEscape: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly lockScroll: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly modal: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly modalPenetrable: BooleanConstructor;
readonly openDelay: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly closeDelay: import("element-plus/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/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/es/utils").EpPropFinalized<(new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("element-plus/es/components/dialog").DialogTransition) | ((new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("element-plus/es/components/dialog").DialogTransition))[], unknown, unknown, undefined, boolean>;
readonly center: BooleanConstructor;
readonly alignCenter: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly closeIcon: {
readonly type: import("vue").PropType<import("element-plus/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/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly overflow: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly fullscreen: BooleanConstructor;
readonly showClose: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly title: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly ariaLevel: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
}>> & {
"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
onOpen?: (() => any) | undefined;
onClose?: (() => any) | undefined;
onOpened?: (() => any) | undefined;
onClosed?: (() => any) | undefined;
onOpenAutoFocus?: (() => any) | undefined;
onCloseAutoFocus?: (() => any) | undefined;
}, {
readonly title: string;
readonly center: boolean;
readonly direction: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "ltr" | "rtl" | "ttb" | "btt", unknown>;
readonly overflow: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly transition: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("element-plus/es/components/dialog").DialogTransition) | ((new (...args: any[]) => string | import("vue").TransitionProps) | (() => import("element-plus/es/components/dialog").DialogTransition))[], unknown, unknown>;
readonly size: import("element-plus/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
readonly modelValue: boolean;
readonly ariaLevel: string;
readonly appendTo: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/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/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/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly draggable: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly showClose: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly fullscreen: boolean;
readonly closeOnClickModal: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly closeOnPressEscape: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly lockScroll: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly modal: import("element-plus/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/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly modalFade: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly resizable: boolean;
}>;
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
export default _default;
type __VLS_WithTemplateSlots<T, S> = T & {
new (): {
$slots: S;
};
};

View File

@@ -0,0 +1,197 @@
import { defineComponent, useSlots, computed, ref, openBlock, createBlock, unref, withCtx, createVNode, Transition, withDirectives, createElementVNode, mergeProps, withModifiers, normalizeClass, createElementBlock, renderSlot, toDisplayString, createCommentVNode, normalizeStyle, vShow } from 'vue';
import { Close } from '@element-plus/icons-vue';
import { ElOverlay } from '../../overlay/index.mjs';
import ElFocusTrap from '../../focus-trap/src/focus-trap.mjs';
import { ElTeleport } from '../../teleport/index.mjs';
import { ElIcon } from '../../icon/index.mjs';
import { drawerProps, drawerEmits } from './drawer.mjs';
import { useResizable } from './composables/useResizable.mjs';
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
import { useDialog } from '../../dialog/src/use-dialog.mjs';
import { useDeprecated } from '../../../hooks/use-deprecated/index.mjs';
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
import { useLocale } from '../../../hooks/use-locale/index.mjs';
const __default__ = defineComponent({
name: "ElDrawer",
inheritAttrs: false
});
const _sfc_main = /* @__PURE__ */ defineComponent({
...__default__,
props: drawerProps,
emits: drawerEmits,
setup(__props, { expose }) {
const props = __props;
const slots = useSlots();
useDeprecated({
scope: "el-drawer",
from: "the title slot",
replacement: "the header slot",
version: "3.0.0",
ref: "https://element-plus.org/en-US/component/drawer.html#slots"
}, computed(() => !!slots.title));
const drawerRef = ref();
const focusStartRef = ref();
const draggerRef = ref();
const ns = useNamespace("drawer");
const { t } = useLocale();
const {
afterEnter,
afterLeave,
beforeLeave,
visible,
rendered,
titleId,
bodyId,
zIndex,
onModalClick,
onOpenAutoFocus,
onCloseAutoFocus,
onFocusoutPrevented,
onCloseRequested,
handleClose
} = useDialog(props, drawerRef);
const { isHorizontal, size, isResizing } = useResizable(props, draggerRef);
expose({
handleClose,
afterEnter,
afterLeave
});
return (_ctx, _cache) => {
return openBlock(), createBlock(unref(ElTeleport), {
to: _ctx.appendTo,
disabled: _ctx.appendTo !== "body" ? false : !_ctx.appendToBody
}, {
default: withCtx(() => [
createVNode(Transition, {
name: unref(ns).b("fade"),
onAfterEnter: unref(afterEnter),
onAfterLeave: unref(afterLeave),
onBeforeLeave: unref(beforeLeave),
persisted: ""
}, {
default: withCtx(() => {
var _a;
return [
withDirectives(createVNode(unref(ElOverlay), {
mask: _ctx.modal,
"overlay-class": [unref(ns).is("drawer"), (_a = _ctx.modalClass) != null ? _a : ""],
"z-index": unref(zIndex),
onClick: unref(onModalClick)
}, {
default: withCtx(() => [
createVNode(unref(ElFocusTrap), {
loop: "",
trapped: unref(visible),
"focus-trap-el": drawerRef.value,
"focus-start-el": focusStartRef.value,
onFocusAfterTrapped: unref(onOpenAutoFocus),
onFocusAfterReleased: unref(onCloseAutoFocus),
onFocusoutPrevented: unref(onFocusoutPrevented),
onReleaseRequested: unref(onCloseRequested)
}, {
default: withCtx(() => [
createElementVNode("div", mergeProps({
ref_key: "drawerRef",
ref: drawerRef,
"aria-modal": "true",
"aria-label": _ctx.title || void 0,
"aria-labelledby": !_ctx.title ? unref(titleId) : void 0,
"aria-describedby": unref(bodyId)
}, _ctx.$attrs, {
class: [
unref(ns).b(),
_ctx.direction,
unref(visible) && "open",
unref(ns).is("dragging", unref(isResizing))
],
style: { [unref(isHorizontal) ? "width" : "height"]: unref(size) },
role: "dialog",
onClick: withModifiers(() => {
}, ["stop"])
}), [
createElementVNode("span", {
ref_key: "focusStartRef",
ref: focusStartRef,
class: normalizeClass(unref(ns).e("sr-focus")),
tabindex: "-1"
}, null, 2),
_ctx.withHeader ? (openBlock(), createElementBlock("header", {
key: 0,
class: normalizeClass([unref(ns).e("header"), _ctx.headerClass])
}, [
!_ctx.$slots.title ? renderSlot(_ctx.$slots, "header", {
key: 0,
close: unref(handleClose),
titleId: unref(titleId),
titleClass: unref(ns).e("title")
}, () => [
createElementVNode("span", {
id: unref(titleId),
role: "heading",
"aria-level": _ctx.headerAriaLevel,
class: normalizeClass(unref(ns).e("title"))
}, toDisplayString(_ctx.title), 11, ["id", "aria-level"])
]) : renderSlot(_ctx.$slots, "title", { key: 1 }, () => [
createCommentVNode(" DEPRECATED SLOT ")
]),
_ctx.showClose ? (openBlock(), createElementBlock("button", {
key: 2,
"aria-label": unref(t)("el.drawer.close"),
class: normalizeClass(unref(ns).e("close-btn")),
type: "button",
onClick: unref(handleClose)
}, [
createVNode(unref(ElIcon), {
class: normalizeClass(unref(ns).e("close"))
}, {
default: withCtx(() => [
createVNode(unref(Close))
]),
_: 1
}, 8, ["class"])
], 10, ["aria-label", "onClick"])) : createCommentVNode("v-if", true)
], 2)) : createCommentVNode("v-if", true),
unref(rendered) ? (openBlock(), createElementBlock("div", {
key: 1,
id: unref(bodyId),
class: normalizeClass([unref(ns).e("body"), _ctx.bodyClass])
}, [
renderSlot(_ctx.$slots, "default")
], 10, ["id"])) : createCommentVNode("v-if", true),
_ctx.$slots.footer ? (openBlock(), createElementBlock("div", {
key: 2,
class: normalizeClass([unref(ns).e("footer"), _ctx.footerClass])
}, [
renderSlot(_ctx.$slots, "footer")
], 2)) : createCommentVNode("v-if", true),
_ctx.resizable ? (openBlock(), createElementBlock("div", {
key: 3,
ref_key: "draggerRef",
ref: draggerRef,
style: normalizeStyle({ zIndex: unref(zIndex) }),
class: normalizeClass(unref(ns).e("dragger"))
}, null, 6)) : createCommentVNode("v-if", true)
], 16, ["aria-label", "aria-labelledby", "aria-describedby", "onClick"])
]),
_: 3
}, 8, ["trapped", "focus-trap-el", "focus-start-el", "onFocusAfterTrapped", "onFocusAfterReleased", "onFocusoutPrevented", "onReleaseRequested"])
]),
_: 3
}, 8, ["mask", "overlay-class", "z-index", "onClick"]), [
[vShow, unref(visible)]
])
];
}),
_: 3
}, 8, ["name", "onAfterEnter", "onAfterLeave", "onBeforeLeave"])
]),
_: 3
}, 8, ["to", "disabled"]);
};
}
});
var Drawer = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "drawer.vue"]]);
export { Drawer as default };
//# sourceMappingURL=drawer2.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,3 @@
import 'element-plus/es/components/base/style/css';
import 'element-plus/theme-chalk/el-drawer.css';
import 'element-plus/es/components/overlay/style/css';

View File

@@ -0,0 +1,4 @@
import '../../base/style/css.mjs';
import 'element-plus/theme-chalk/el-drawer.css';
import '../../overlay/style/css.mjs';
//# sourceMappingURL=css.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"css.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

View File

@@ -0,0 +1,3 @@
import 'element-plus/es/components/base/style';
import 'element-plus/theme-chalk/src/drawer.scss';
import 'element-plus/es/components/overlay/style';

View File

@@ -0,0 +1,4 @@
import '../../base/style/index.mjs';
import 'element-plus/theme-chalk/src/drawer.scss';
import '../../overlay/style/index.mjs';
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}