yuang-framework-ui-pc 1.1.15 → 1.1.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/es/core-components.js +3 -4
  2. package/es/ele-dialog/index.d.ts +2 -2
  3. package/es/ele-dialog/index.js +15 -15
  4. package/es/ele-dialog/props.d.ts +3 -3
  5. package/es/ele-dialog/props.js +4 -4
  6. package/es/ele-dialog/util.d.ts +8 -8
  7. package/es/ele-dialog/util.js +93 -101
  8. package/es/style/plus.scss +2 -0
  9. package/es/style/themes/default.scss +26 -0
  10. package/lib/core-components.cjs +53 -54
  11. package/lib/ele-dialog/index.cjs +13 -13
  12. package/lib/ele-dialog/index.d.ts +2 -2
  13. package/lib/ele-dialog/props.cjs +4 -4
  14. package/lib/ele-dialog/props.d.ts +3 -3
  15. package/lib/ele-dialog/util.cjs +93 -101
  16. package/lib/ele-dialog/util.d.ts +8 -8
  17. package/lib/style/plus.scss +2 -0
  18. package/lib/style/themes/default.scss +26 -0
  19. package/package.json +1 -1
  20. package/typings/global.d.ts +0 -1
  21. package/es/ele-modal/index.d.ts +0 -245
  22. package/es/ele-modal/index.js +0 -342
  23. package/es/ele-modal/props.d.ts +0 -135
  24. package/es/ele-modal/props.js +0 -71
  25. package/es/ele-modal/style/css-var.scss +0 -8
  26. package/es/ele-modal/style/index.d.ts +0 -1
  27. package/es/ele-modal/style/index.js +0 -3
  28. package/es/ele-modal/style/index.scss +0 -259
  29. package/es/ele-modal/types.d.ts +0 -43
  30. package/es/ele-modal/util.d.ts +0 -52
  31. package/es/ele-modal/util.js +0 -301
  32. package/lib/ele-modal/index.cjs +0 -341
  33. package/lib/ele-modal/index.d.ts +0 -245
  34. package/lib/ele-modal/props.cjs +0 -71
  35. package/lib/ele-modal/props.d.ts +0 -135
  36. package/lib/ele-modal/style/css-var.scss +0 -8
  37. package/lib/ele-modal/style/index.cjs +0 -4
  38. package/lib/ele-modal/style/index.d.ts +0 -1
  39. package/lib/ele-modal/style/index.scss +0 -259
  40. package/lib/ele-modal/types.d.ts +0 -43
  41. package/lib/ele-modal/util.cjs +0 -301
  42. package/lib/ele-modal/util.d.ts +0 -52
@@ -22,7 +22,9 @@
22
22
  @use '../ele-loading/style/index.scss' as loading;
23
23
  @use '../ele-map-picker/style/index.scss' as mapPicker;
24
24
  @use '../ele-menus/style/index.scss' as menus;
25
+ // temp
25
26
  @use '../ele-dialog/style/index.scss' as modal;
27
+ @use '../ele-dialog/style/index.scss' as dialog;
26
28
  @use '../ele-page/style/index.scss' as page;
27
29
  @use '../ele-pagination/style/index.scss' as pagination;
28
30
  @use '../ele-popconfirm/style/index.scss' as popconfirm;
@@ -460,6 +460,7 @@ $ele: map.deep-merge(
460
460
  'bg-7': #7dd733,
461
461
  'bg-8': #faad14
462
462
  ),
463
+ // temp
463
464
  'modal': (
464
465
  // 弹窗
465
466
  'bg': elVar('bg-color', 'overlay'),
@@ -484,6 +485,31 @@ $ele: map.deep-merge(
484
485
  'fullscreen-border': 1px solid elVar('border-color', 'light'),
485
486
  'mobile-space': 16px
486
487
  ),
488
+
489
+ 'dialog': (
490
+ // 弹窗
491
+ 'bg': elVar('bg-color', 'overlay'),
492
+ 'radius': elVar('border-radius', 'base'),
493
+ 'header-color': elVar('text-color', 'primary'),
494
+ 'header-font-size': elVar('font-size', 'medium'),
495
+ 'header-font-weight': normal,
496
+ 'header-line-height': 24px,
497
+ 'header-padding': 14px 20px,
498
+ 'header-border': 1px solid elVar('border-color', 'light'),
499
+ 'icon-size': 22px,
500
+ 'icon-font-size': 16px,
501
+ 'icon-color': elVar('text-color', 'secondary'),
502
+ 'icon-hover-color': elVar('text-color', 'primary'),
503
+ 'icon-hover-bg': transparent,
504
+ 'icon-radius': elVar('border-radius', 'small'),
505
+ 'icon-space': 8px,
506
+ 'body-padding': 24px 22px,
507
+ 'form-body-padding': 24px 22px 12px 20px,
508
+ 'footer-padding': 10px 20px,
509
+ 'footer-border': 1px solid elVar('border-color', 'light'),
510
+ 'fullscreen-border': 1px solid elVar('border-color', 'light'),
511
+ 'mobile-space': 16px
512
+ ),
487
513
  'page': (
488
514
  // 页面容器
489
515
  'padding': 16px,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "yuang-framework-ui-pc",
3
- "version": "1.1.15",
3
+ "version": "1.1.16",
4
4
  "type": "module",
5
5
  "scripts": {
6
6
  "dev": "vite --host --config vite.global.ts --mode dev",
@@ -32,7 +32,6 @@ declare module '@vue/runtime-core' {
32
32
  EleLoading: (typeof import('yuang-framework-ui-pc'))['EleLoading'];
33
33
  EleMapPicker: (typeof import('yuang-framework-ui-pc'))['EleMapPicker'];
34
34
  EleMenus: (typeof import('yuang-framework-ui-pc'))['EleMenus'];
35
- EleModal: (typeof import('yuang-framework-ui-pc'))['EleModal'];
36
35
  ElePage: (typeof import('yuang-framework-ui-pc'))['ElePage'];
37
36
  ElePagination: (typeof import('yuang-framework-ui-pc'))['ElePagination'];
38
37
  ElePopconfirm: (typeof import('yuang-framework-ui-pc'))['ElePopconfirm'];
@@ -1,245 +0,0 @@
1
- import { ElDialogInstance } from '../ele-app/el';
2
-
3
- declare const _default: import('vue').DefineComponent<{
4
- appendToBody: {
5
- type: BooleanConstructor;
6
- default: boolean;
7
- };
8
- draggable: {
9
- type: BooleanConstructor;
10
- default: boolean;
11
- };
12
- moveOut: import('vue').PropType<import('./types').MoveOut>;
13
- resizable: import('vue').PropType<import('./types').Resizable>;
14
- position: import('vue').PropType<import('./types').Position>;
15
- resetOnClose: {
16
- type: BooleanConstructor;
17
- default: boolean;
18
- };
19
- maxable: BooleanConstructor;
20
- multiple: BooleanConstructor;
21
- inner: BooleanConstructor;
22
- minWidth: {
23
- type: NumberConstructor;
24
- default: number;
25
- };
26
- minHeight: {
27
- type: NumberConstructor;
28
- default: number;
29
- };
30
- headerStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
31
- titleStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
32
- bodyStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
33
- footerStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
34
- closeBtnStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
35
- fullscreenBtnStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
36
- resizeIconStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
37
- responsive: {
38
- type: BooleanConstructor;
39
- default: null;
40
- };
41
- form: BooleanConstructor;
42
- appendTo: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => (string | HTMLElement) & {}) | (() => string | HTMLElement) | ((new (...args: any[]) => (string | HTMLElement) & {}) | (() => string | HTMLElement))[], unknown, unknown, "body", boolean>;
43
- beforeClose: {
44
- readonly type: import('vue').PropType<import('element-plus').DialogBeforeCloseFn>;
45
- readonly required: false;
46
- readonly validator: ((val: unknown) => boolean) | undefined;
47
- __epPropKey: true;
48
- };
49
- destroyOnClose: BooleanConstructor;
50
- closeOnClickModal: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
51
- closeOnPressEscape: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
52
- lockScroll: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
53
- modal: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
54
- openDelay: import('element-plus/es/utils/index').EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
55
- closeDelay: import('element-plus/es/utils/index').EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
56
- top: {
57
- readonly type: import('vue').PropType<string>;
58
- readonly required: false;
59
- readonly validator: ((val: unknown) => boolean) | undefined;
60
- __epPropKey: true;
61
- };
62
- modelValue: BooleanConstructor;
63
- modalClass: StringConstructor;
64
- width: {
65
- readonly type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
66
- readonly required: false;
67
- readonly validator: ((val: unknown) => boolean) | undefined;
68
- __epPropKey: true;
69
- };
70
- zIndex: {
71
- readonly type: import('vue').PropType<number>;
72
- readonly required: false;
73
- readonly validator: ((val: unknown) => boolean) | undefined;
74
- __epPropKey: true;
75
- };
76
- trapFocus: BooleanConstructor;
77
- headerAriaLevel: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
78
- center: BooleanConstructor;
79
- alignCenter: BooleanConstructor;
80
- closeIcon: {
81
- readonly type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<(new (...args: any[]) => (string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions>) & {}) | (() => string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions>) | ((new (...args: any[]) => (string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions>) & {}) | (() => string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions>))[], unknown, unknown>>;
82
- readonly required: false;
83
- readonly validator: ((val: unknown) => boolean) | undefined;
84
- __epPropKey: true;
85
- };
86
- overflow: BooleanConstructor;
87
- fullscreen: BooleanConstructor;
88
- showClose: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
89
- title: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
90
- ariaLevel: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
91
- }, {
92
- dialogRef: import('vue').Ref<ElDialogInstance>;
93
- isFullscreen: import('vue').Ref<boolean>;
94
- dialogClass: import('vue').ComputedRef<string>;
95
- teleportTo: import('vue').ComputedRef<string | Element>;
96
- teleportDisabled: import('vue').ComputedRef<boolean>;
97
- handleHeaderMousedown: (e: MouseEvent) => void;
98
- handleHeaderTouchstart: (e: TouchEvent) => void;
99
- handleResizeMousedown: (e: MouseEvent) => void;
100
- handleResizeTouchstart: (e: TouchEvent) => void;
101
- updateModelValue: (modelValue: boolean) => void;
102
- toggleFullscreen: (fullscreen?: boolean) => void;
103
- handleOpen: () => void;
104
- handleOpened: () => void;
105
- handleClose: () => void;
106
- handleClosed: () => void;
107
- handleOpenAutoFocus: () => void;
108
- handleCloseAutoFocus: () => void;
109
- }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
110
- 'update:fullscreen': (_fullscreen: boolean) => boolean;
111
- open: () => boolean;
112
- opened: () => boolean;
113
- close: () => boolean;
114
- closed: () => boolean;
115
- "update:modelValue": (value: boolean) => boolean;
116
- openAutoFocus: () => boolean;
117
- closeAutoFocus: () => boolean;
118
- }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
119
- appendToBody: {
120
- type: BooleanConstructor;
121
- default: boolean;
122
- };
123
- draggable: {
124
- type: BooleanConstructor;
125
- default: boolean;
126
- };
127
- moveOut: import('vue').PropType<import('./types').MoveOut>;
128
- resizable: import('vue').PropType<import('./types').Resizable>;
129
- position: import('vue').PropType<import('./types').Position>;
130
- resetOnClose: {
131
- type: BooleanConstructor;
132
- default: boolean;
133
- };
134
- maxable: BooleanConstructor;
135
- multiple: BooleanConstructor;
136
- inner: BooleanConstructor;
137
- minWidth: {
138
- type: NumberConstructor;
139
- default: number;
140
- };
141
- minHeight: {
142
- type: NumberConstructor;
143
- default: number;
144
- };
145
- headerStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
146
- titleStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
147
- bodyStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
148
- footerStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
149
- closeBtnStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
150
- fullscreenBtnStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
151
- resizeIconStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
152
- responsive: {
153
- type: BooleanConstructor;
154
- default: null;
155
- };
156
- form: BooleanConstructor;
157
- appendTo: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => (string | HTMLElement) & {}) | (() => string | HTMLElement) | ((new (...args: any[]) => (string | HTMLElement) & {}) | (() => string | HTMLElement))[], unknown, unknown, "body", boolean>;
158
- beforeClose: {
159
- readonly type: import('vue').PropType<import('element-plus').DialogBeforeCloseFn>;
160
- readonly required: false;
161
- readonly validator: ((val: unknown) => boolean) | undefined;
162
- __epPropKey: true;
163
- };
164
- destroyOnClose: BooleanConstructor;
165
- closeOnClickModal: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
166
- closeOnPressEscape: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
167
- lockScroll: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
168
- modal: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
169
- openDelay: import('element-plus/es/utils/index').EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
170
- closeDelay: import('element-plus/es/utils/index').EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
171
- top: {
172
- readonly type: import('vue').PropType<string>;
173
- readonly required: false;
174
- readonly validator: ((val: unknown) => boolean) | undefined;
175
- __epPropKey: true;
176
- };
177
- modelValue: BooleanConstructor;
178
- modalClass: StringConstructor;
179
- width: {
180
- readonly type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
181
- readonly required: false;
182
- readonly validator: ((val: unknown) => boolean) | undefined;
183
- __epPropKey: true;
184
- };
185
- zIndex: {
186
- readonly type: import('vue').PropType<number>;
187
- readonly required: false;
188
- readonly validator: ((val: unknown) => boolean) | undefined;
189
- __epPropKey: true;
190
- };
191
- trapFocus: BooleanConstructor;
192
- headerAriaLevel: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
193
- center: BooleanConstructor;
194
- alignCenter: BooleanConstructor;
195
- closeIcon: {
196
- readonly type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<(new (...args: any[]) => (string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions>) & {}) | (() => string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions>) | ((new (...args: any[]) => (string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions>) & {}) | (() => string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions>))[], unknown, unknown>>;
197
- readonly required: false;
198
- readonly validator: ((val: unknown) => boolean) | undefined;
199
- __epPropKey: true;
200
- };
201
- overflow: BooleanConstructor;
202
- fullscreen: BooleanConstructor;
203
- showClose: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
204
- title: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
205
- ariaLevel: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "2", boolean>;
206
- }>> & {
207
- "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
208
- onClose?: (() => any) | undefined;
209
- onOpen?: (() => any) | undefined;
210
- onOpened?: (() => any) | undefined;
211
- onClosed?: (() => any) | undefined;
212
- onOpenAutoFocus?: (() => any) | undefined;
213
- onCloseAutoFocus?: (() => any) | undefined;
214
- "onUpdate:fullscreen"?: ((_fullscreen: boolean) => any) | undefined;
215
- }, {
216
- form: boolean;
217
- title: string;
218
- center: boolean;
219
- modelValue: boolean;
220
- appendToBody: boolean;
221
- appendTo: import('element-plus/es/utils/index').EpPropMergeType<(new (...args: any[]) => (string | HTMLElement) & {}) | (() => string | HTMLElement) | ((new (...args: any[]) => (string | HTMLElement) & {}) | (() => string | HTMLElement))[], unknown, unknown>;
222
- destroyOnClose: boolean;
223
- closeOnClickModal: import('element-plus/es/utils/index').EpPropMergeType<BooleanConstructor, unknown, unknown>;
224
- closeOnPressEscape: import('element-plus/es/utils/index').EpPropMergeType<BooleanConstructor, unknown, unknown>;
225
- lockScroll: import('element-plus/es/utils/index').EpPropMergeType<BooleanConstructor, unknown, unknown>;
226
- modal: import('element-plus/es/utils/index').EpPropMergeType<BooleanConstructor, unknown, unknown>;
227
- openDelay: number;
228
- closeDelay: number;
229
- trapFocus: boolean;
230
- headerAriaLevel: string;
231
- alignCenter: boolean;
232
- draggable: boolean;
233
- overflow: boolean;
234
- fullscreen: boolean;
235
- showClose: import('element-plus/es/utils/index').EpPropMergeType<BooleanConstructor, unknown, unknown>;
236
- ariaLevel: string;
237
- minWidth: number;
238
- minHeight: number;
239
- multiple: boolean;
240
- responsive: boolean;
241
- resetOnClose: boolean;
242
- maxable: boolean;
243
- inner: boolean;
244
- }, {}>;
245
- export default _default;
@@ -1,342 +0,0 @@
1
- import { defineComponent, ref, computed, watch, onMounted, onActivated, onDeactivated, nextTick, resolveComponent, openBlock, createBlock, Teleport, createVNode, mergeProps, createSlots, withCtx, createElementVNode, normalizeStyle, renderSlot, createTextVNode, toDisplayString, createElementBlock, withModifiers, createCommentVNode, resolveDynamicComponent, normalizeClass } from "vue";
2
- import { ElDialog, ElIcon } from "element-plus";
3
- import { CloseOutlined, CompressOutlined, ExpandOutlined, ResizeOutlined } from "../icons";
4
- import ReceiverView from "../ele-config-provider/components/receiver-view";
5
- import { useLayoutState, useResponsive } from "../ele-pro-layout/util";
6
- import { getDialogContainer, useModalEvent, wrapperClass, closedClass } from "./util";
7
- import { modalProps, modalEmits } from "./props";
8
- const _sfc_main = defineComponent({
9
- name: "EleModal",
10
- components: {
11
- ElDialog,
12
- ElIcon,
13
- CloseOutlined,
14
- CompressOutlined,
15
- ExpandOutlined,
16
- ResizeOutlined,
17
- ReceiverView
18
- },
19
- inheritAttrs: false,
20
- props: modalProps,
21
- emits: modalEmits,
22
- setup(props, { emit }) {
23
- const layoutState = useLayoutState();
24
- const isResponsive = useResponsive(props);
25
- const dialogRef = ref(null);
26
- const isFullscreen = ref(props.fullscreen ?? false);
27
- const isActivated = ref(true);
28
- const dialogClass = computed(() => {
29
- const classes = [wrapperClass];
30
- if (props.responsive ?? isResponsive.value ?? true) {
31
- classes.push("ele-dialog-responsive");
32
- }
33
- if (props.alignCenter || props.position === "center") {
34
- classes.push("ele-dialog-center");
35
- } else if (props.position === "top") {
36
- classes.push("ele-dialog-top");
37
- } else if (props.position === "bottom") {
38
- classes.push("ele-dialog-bottom");
39
- } else if (props.position === "left") {
40
- classes.push("ele-dialog-left");
41
- } else if (props.position === "right") {
42
- classes.push("ele-dialog-right");
43
- } else if (props.position === "leftTop") {
44
- classes.push("ele-dialog-left-top");
45
- } else if (props.position === "leftBottom") {
46
- classes.push("ele-dialog-left-bottom");
47
- } else if (props.position === "rightTop") {
48
- classes.push("ele-dialog-right-top");
49
- } else if (props.position === "rightBottom") {
50
- classes.push("ele-dialog-right-bottom");
51
- }
52
- if (props.draggable) {
53
- classes.push("ele-dialog-movable");
54
- }
55
- if (props.resizable) {
56
- classes.push("ele-dialog-resizable");
57
- }
58
- if (props.multiple) {
59
- classes.push("ele-dialog-multiple");
60
- }
61
- if (isFullscreen.value) {
62
- classes.push("ele-dialog-fullscreen");
63
- }
64
- if (!props.modelValue) {
65
- classes.push(closedClass);
66
- }
67
- if (!isActivated.value && props.modelValue) {
68
- classes.push("ele-dialog-hide");
69
- }
70
- if (props.inner) {
71
- classes.push("ele-dialog-inner");
72
- }
73
- if (props.modalClass) {
74
- classes.push(props.modalClass);
75
- }
76
- return classes.join(" ");
77
- });
78
- const teleportTo = computed(() => {
79
- return getDialogContainer(
80
- props.inner,
81
- props.multiple,
82
- props.appendTo,
83
- layoutState.modalsEl
84
- );
85
- });
86
- const teleportDisabled = computed(() => {
87
- const appendTo = props.appendTo || "body";
88
- const disabled = appendTo === "body" ? !props.appendToBody : false;
89
- return props.multiple || props.inner ? false : disabled;
90
- });
91
- const {
92
- handleHeaderMousedown,
93
- handleHeaderTouchstart,
94
- handleResizeMousedown,
95
- handleResizeTouchstart,
96
- bindAutoTopEvent,
97
- unbindAutoTopEvent,
98
- topModal,
99
- setInitPosition,
100
- resetModalStyle
101
- } = useModalEvent(dialogRef, props, isFullscreen);
102
- const updateModelValue = (modelValue) => {
103
- emit("update:modelValue", modelValue);
104
- };
105
- const toggleFullscreen = (fullscreen) => {
106
- isFullscreen.value = fullscreen ?? !isFullscreen.value;
107
- nextTick(() => {
108
- topModal();
109
- });
110
- emit("update:fullscreen", isFullscreen.value);
111
- };
112
- const handleOpen = () => {
113
- if (props.resetOnClose || props.destroyOnClose) {
114
- isFullscreen.value = props.fullscreen ?? false;
115
- }
116
- nextTick(() => {
117
- if (props.resetOnClose) {
118
- resetModalStyle();
119
- } else {
120
- setInitPosition();
121
- }
122
- topModal();
123
- });
124
- emit("open");
125
- };
126
- const handleOpened = () => {
127
- bindAutoTopEvent();
128
- emit("opened");
129
- };
130
- const handleClose = () => {
131
- unbindAutoTopEvent();
132
- emit("close");
133
- };
134
- const handleClosed = () => {
135
- emit("closed");
136
- };
137
- const handleOpenAutoFocus = () => {
138
- emit("openAutoFocus");
139
- };
140
- const handleCloseAutoFocus = () => {
141
- emit("closeAutoFocus");
142
- };
143
- watch(
144
- () => props.fullscreen,
145
- (fullscreen) => {
146
- isFullscreen.value = fullscreen ?? false;
147
- }
148
- );
149
- onMounted(() => {
150
- if (props.modelValue) {
151
- setInitPosition();
152
- }
153
- });
154
- onActivated(() => {
155
- isActivated.value = true;
156
- });
157
- onDeactivated(() => {
158
- isActivated.value = false;
159
- });
160
- return {
161
- dialogRef,
162
- isFullscreen,
163
- dialogClass,
164
- teleportTo,
165
- teleportDisabled,
166
- handleHeaderMousedown,
167
- handleHeaderTouchstart,
168
- handleResizeMousedown,
169
- handleResizeTouchstart,
170
- updateModelValue,
171
- toggleFullscreen,
172
- handleOpen,
173
- handleOpened,
174
- handleClose,
175
- handleClosed,
176
- handleOpenAutoFocus,
177
- handleCloseAutoFocus
178
- };
179
- }
180
- });
181
- const _export_sfc = (sfc, props) => {
182
- const target = sfc.__vccOpts || sfc;
183
- for (const [key, val] of props) {
184
- target[key] = val;
185
- }
186
- return target;
187
- };
188
- function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
189
- const _component_CompressOutlined = resolveComponent("CompressOutlined");
190
- const _component_ExpandOutlined = resolveComponent("ExpandOutlined");
191
- const _component_ElIcon = resolveComponent("ElIcon");
192
- const _component_CloseOutlined = resolveComponent("CloseOutlined");
193
- const _component_ResizeOutlined = resolveComponent("ResizeOutlined");
194
- const _component_ReceiverView = resolveComponent("ReceiverView");
195
- const _component_ElDialog = resolveComponent("ElDialog");
196
- return openBlock(), createBlock(Teleport, {
197
- to: _ctx.teleportTo,
198
- disabled: _ctx.teleportDisabled
199
- }, [
200
- createVNode(_component_ElDialog, mergeProps(_ctx.$attrs, {
201
- ref: "dialogRef",
202
- modelValue: _ctx.modelValue,
203
- title: _ctx.title,
204
- width: _ctx.width,
205
- fullscreen: false,
206
- modal: _ctx.multiple ? false : _ctx.modal,
207
- modalClass: _ctx.dialogClass,
208
- appendToBody: false,
209
- lockScroll: _ctx.inner || _ctx.multiple ? false : _ctx.lockScroll,
210
- openDelay: _ctx.openDelay,
211
- closeDelay: _ctx.closeDelay,
212
- closeOnClickModal: _ctx.closeOnClickModal,
213
- closeOnPressEscape: _ctx.closeOnPressEscape,
214
- showClose: false,
215
- beforeClose: _ctx.beforeClose,
216
- draggable: false,
217
- overflow: false,
218
- center: _ctx.center,
219
- alignCenter: false,
220
- destroyOnClose: _ctx.destroyOnClose,
221
- zIndex: _ctx.zIndex,
222
- headerAriaLevel: _ctx.headerAriaLevel,
223
- "onUpdate:modelValue": _ctx.updateModelValue,
224
- onOpen: _ctx.handleOpen,
225
- onOpened: _ctx.handleOpened,
226
- onClose: _ctx.handleClose,
227
- onClosed: _ctx.handleClosed,
228
- onOpenAutoFocus: _ctx.handleOpenAutoFocus,
229
- onCloseAutoFocus: _ctx.handleCloseAutoFocus
230
- }), createSlots({
231
- header: withCtx(({ close, titleId, titleClass }) => [
232
- createElementVNode("div", {
233
- style: normalizeStyle(_ctx.headerStyle),
234
- class: "ele-dialog-header",
235
- onMousedown: _cache[6] || (_cache[6] = (...args) => _ctx.handleHeaderMousedown && _ctx.handleHeaderMousedown(...args)),
236
- onTouchstart: _cache[7] || (_cache[7] = (...args) => _ctx.handleHeaderTouchstart && _ctx.handleHeaderTouchstart(...args))
237
- }, [
238
- createElementVNode("div", {
239
- class: "ele-dialog-title",
240
- style: normalizeStyle(_ctx.titleStyle)
241
- }, [
242
- renderSlot(_ctx.$slots, "header", {
243
- close,
244
- titleId,
245
- titleClass
246
- }, () => [
247
- createTextVNode(toDisplayString(_ctx.title), 1)
248
- ])
249
- ], 4),
250
- _ctx.maxable ? (openBlock(), createElementBlock("div", {
251
- key: 0,
252
- class: "ele-dialog-tool ele-dialog-tool-max",
253
- style: normalizeStyle(_ctx.fullscreenBtnStyle),
254
- onClick: _cache[0] || (_cache[0] = ($event) => _ctx.toggleFullscreen()),
255
- onMousedown: _cache[1] || (_cache[1] = withModifiers(() => {
256
- }, ["stop"])),
257
- onTouchstart: _cache[2] || (_cache[2] = withModifiers(() => {
258
- }, ["stop"]))
259
- }, [
260
- renderSlot(_ctx.$slots, "maxIcon", { fullscreen: _ctx.isFullscreen }, () => [
261
- createVNode(_component_ElIcon, null, {
262
- default: withCtx(() => [
263
- _ctx.isFullscreen ? (openBlock(), createBlock(_component_CompressOutlined, { key: 0 })) : (openBlock(), createBlock(_component_ExpandOutlined, { key: 1 }))
264
- ]),
265
- _: 1
266
- })
267
- ])
268
- ], 36)) : createCommentVNode("", true),
269
- _ctx.showClose ? (openBlock(), createElementBlock("div", {
270
- key: 1,
271
- class: "ele-dialog-tool",
272
- style: normalizeStyle(_ctx.closeBtnStyle),
273
- onClick: _cache[3] || (_cache[3] = ($event) => _ctx.updateModelValue(false)),
274
- onMousedown: _cache[4] || (_cache[4] = withModifiers(() => {
275
- }, ["stop"])),
276
- onTouchstart: _cache[5] || (_cache[5] = withModifiers(() => {
277
- }, ["stop"]))
278
- }, [
279
- renderSlot(_ctx.$slots, "closeIcon", {}, () => [
280
- createVNode(_component_ElIcon, null, {
281
- default: withCtx(() => [
282
- _ctx.closeIcon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.closeIcon), { key: 0 })) : (openBlock(), createBlock(_component_CloseOutlined, { key: 1 }))
283
- ]),
284
- _: 1
285
- })
286
- ])
287
- ], 36)) : createCommentVNode("", true)
288
- ], 36),
289
- _ctx.resizable ? (openBlock(), createElementBlock("div", {
290
- key: 0,
291
- class: normalizeClass([
292
- "ele-dialog-resize-icon",
293
- { "is-horizontal": _ctx.resizable === "horizontal" },
294
- { "is-vertical": _ctx.resizable === "vertical" }
295
- ]),
296
- style: normalizeStyle(_ctx.resizeIconStyle),
297
- onMousedown: _cache[8] || (_cache[8] = (...args) => _ctx.handleResizeMousedown && _ctx.handleResizeMousedown(...args)),
298
- onTouchstart: _cache[9] || (_cache[9] = (...args) => _ctx.handleResizeTouchstart && _ctx.handleResizeTouchstart(...args))
299
- }, [
300
- renderSlot(_ctx.$slots, "resizeIcon", {}, () => [
301
- createVNode(_component_ElIcon, null, {
302
- default: withCtx(() => [
303
- createVNode(_component_ResizeOutlined)
304
- ]),
305
- _: 1
306
- })
307
- ])
308
- ], 38)) : createCommentVNode("", true)
309
- ]),
310
- default: withCtx(() => [
311
- createVNode(_component_ReceiverView, {
312
- wrapPosition: false,
313
- class: normalizeClass(["ele-dialog-body", { "is-form": _ctx.form }]),
314
- style: normalizeStyle(_ctx.bodyStyle)
315
- }, {
316
- default: withCtx(() => [
317
- renderSlot(_ctx.$slots, "default")
318
- ]),
319
- _: 3
320
- }, 8, ["class", "style"])
321
- ]),
322
- _: 2
323
- }, [
324
- _ctx.$slots.footer ? {
325
- name: "footer",
326
- fn: withCtx(() => [
327
- createElementVNode("div", {
328
- class: "ele-dialog-footer",
329
- style: normalizeStyle(_ctx.footerStyle)
330
- }, [
331
- renderSlot(_ctx.$slots, "footer")
332
- ], 4)
333
- ]),
334
- key: "0"
335
- } : void 0
336
- ]), 1040, ["modelValue", "title", "width", "modal", "modalClass", "lockScroll", "openDelay", "closeDelay", "closeOnClickModal", "closeOnPressEscape", "beforeClose", "center", "destroyOnClose", "zIndex", "headerAriaLevel", "onUpdate:modelValue", "onOpen", "onOpened", "onClose", "onClosed", "onOpenAutoFocus", "onCloseAutoFocus"])
337
- ], 8, ["to", "disabled"]);
338
- }
339
- const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
340
- export {
341
- index as default
342
- };