@whitesev/pops 2.1.13 → 2.2.1
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.
- package/dist/index.amd.js +120 -110
- package/dist/index.amd.js.map +1 -1
- package/dist/index.cjs.js +120 -110
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +120 -110
- package/dist/index.esm.js.map +1 -1
- package/dist/index.iife.js +120 -110
- package/dist/index.iife.js.map +1 -1
- package/dist/index.system.js +120 -110
- package/dist/index.system.js.map +1 -1
- package/dist/index.umd.js +120 -110
- package/dist/index.umd.js.map +1 -1
- package/dist/types/src/Pops.d.ts +16 -16
- package/dist/types/src/PopsInst.d.ts +8 -0
- package/dist/types/src/components/panel/index.d.ts +1 -1
- package/dist/types/src/components/panel/types/components-deepMenu.d.ts +1 -1
- package/dist/types/src/handler/PopsElementHandler.d.ts +2 -2
- package/dist/types/src/handler/PopsHandler.d.ts +6 -6
- package/dist/types/src/types/button.d.ts +2 -2
- package/dist/types/src/types/event.d.ts +3 -3
- package/dist/types/src/types/{layer.d.ts → inst.d.ts} +7 -5
- package/dist/types/src/types/main.d.ts +8 -33
- package/dist/types/src/utils/PopsInstanceUtils.d.ts +10 -10
- package/package.json +1 -1
- package/src/Pops.ts +3 -3
- package/src/PopsInst.ts +21 -0
- package/src/components/alert/index.ts +2 -2
- package/src/components/iframe/index.ts +2 -2
- package/src/components/panel/handlerComponents.ts +12 -8
- package/src/components/panel/index.css +18 -5
- package/src/components/panel/types/components-deepMenu.ts +1 -1
- package/src/components/rightClickMenu/index.ts +2 -2
- package/src/css/scrollbar.css +9 -5
- package/src/handler/PopsElementHandler.ts +2 -2
- package/src/handler/PopsHandler.ts +30 -30
- package/src/types/button.d.ts +2 -2
- package/src/types/event.d.ts +3 -3
- package/src/types/{layer.d.ts → inst.d.ts} +7 -5
- package/src/types/main.d.ts +8 -33
- package/src/utils/PopsInstanceUtils.ts +84 -81
- package/dist/types/src/PopsLayer.d.ts +0 -5
- package/src/PopsLayer.ts +0 -18
|
@@ -8,15 +8,15 @@ import type { PopsPanelDetails } from "../components/panel/types";
|
|
|
8
8
|
import type { PopsPromptDetails } from "../components/prompt/types/index";
|
|
9
9
|
import { PopsCore } from "../PopsCore";
|
|
10
10
|
import { PopsAnimation } from "../PopsAnimation";
|
|
11
|
-
import {
|
|
11
|
+
import { PopsInstData } from "../PopsInst";
|
|
12
12
|
import type { PopsCommonConfig } from "../types/components";
|
|
13
13
|
import { PopsEventDetails, PopsHandlerEventDetails } from "../types/event";
|
|
14
|
-
import {
|
|
14
|
+
import { PopsInstCommonConfig } from "../types/inst";
|
|
15
15
|
import type {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
PopsMode,
|
|
16
|
+
PopsDetails,
|
|
17
|
+
PopsInstStoreType,
|
|
19
18
|
PopsType,
|
|
19
|
+
PopsSupportAnimType,
|
|
20
20
|
} from "../types/main";
|
|
21
21
|
import { popsDOMUtils } from "../utils/PopsDOMUtils";
|
|
22
22
|
import { PopsInstanceUtils } from "../utils/PopsInstanceUtils";
|
|
@@ -145,13 +145,13 @@ export const PopsHandler = {
|
|
|
145
145
|
function clickEvent(event: MouseEvent | PointerEvent) {
|
|
146
146
|
popsDOMUtils.preventEvent(event);
|
|
147
147
|
// 获取该类型实例存储列表
|
|
148
|
-
let
|
|
148
|
+
let targetInst = PopsInstData[details.type];
|
|
149
149
|
function originalRun() {
|
|
150
150
|
if (details.config.mask!.clickEvent!.toClose) {
|
|
151
151
|
/* 关闭 */
|
|
152
152
|
return PopsInstanceUtils.close(
|
|
153
153
|
details.type,
|
|
154
|
-
|
|
154
|
+
targetInst,
|
|
155
155
|
details.guid,
|
|
156
156
|
details.config,
|
|
157
157
|
details.animElement
|
|
@@ -160,7 +160,7 @@ export const PopsHandler = {
|
|
|
160
160
|
/* 隐藏 */
|
|
161
161
|
return PopsInstanceUtils.hide(
|
|
162
162
|
details.type,
|
|
163
|
-
|
|
163
|
+
targetInst,
|
|
164
164
|
details.guid,
|
|
165
165
|
details.config,
|
|
166
166
|
details.animElement,
|
|
@@ -234,7 +234,7 @@ export const PopsHandler = {
|
|
|
234
234
|
* @param animElement
|
|
235
235
|
* @param type
|
|
236
236
|
*/
|
|
237
|
-
handleQueryElement(animElement: HTMLDivElement, type:
|
|
237
|
+
handleQueryElement(animElement: HTMLDivElement, type: PopsSupportAnimType) {
|
|
238
238
|
return {
|
|
239
239
|
/**
|
|
240
240
|
* 主元素
|
|
@@ -408,7 +408,7 @@ export const PopsHandler = {
|
|
|
408
408
|
guid: string,
|
|
409
409
|
$shadowContainer: HTMLDivElement,
|
|
410
410
|
$shadowRoot: ShadowRoot | HTMLElement,
|
|
411
|
-
mode:
|
|
411
|
+
mode: PopsInstStoreType,
|
|
412
412
|
animElement: HTMLDivElement,
|
|
413
413
|
popsElement: HTMLDivElement,
|
|
414
414
|
maskElement: HTMLDivElement,
|
|
@@ -434,7 +434,7 @@ export const PopsHandler = {
|
|
|
434
434
|
close() {
|
|
435
435
|
return PopsInstanceUtils.close(
|
|
436
436
|
mode,
|
|
437
|
-
|
|
437
|
+
PopsInstData[mode],
|
|
438
438
|
guid,
|
|
439
439
|
config,
|
|
440
440
|
animElement
|
|
@@ -443,7 +443,7 @@ export const PopsHandler = {
|
|
|
443
443
|
hide() {
|
|
444
444
|
return PopsInstanceUtils.hide(
|
|
445
445
|
mode,
|
|
446
|
-
|
|
446
|
+
PopsInstData[mode],
|
|
447
447
|
guid,
|
|
448
448
|
config,
|
|
449
449
|
animElement,
|
|
@@ -453,7 +453,7 @@ export const PopsHandler = {
|
|
|
453
453
|
show() {
|
|
454
454
|
return PopsInstanceUtils.show(
|
|
455
455
|
mode,
|
|
456
|
-
|
|
456
|
+
PopsInstData[mode],
|
|
457
457
|
guid,
|
|
458
458
|
config,
|
|
459
459
|
animElement,
|
|
@@ -497,7 +497,7 @@ export const PopsHandler = {
|
|
|
497
497
|
close() {
|
|
498
498
|
return PopsInstanceUtils.close(
|
|
499
499
|
mode,
|
|
500
|
-
|
|
500
|
+
PopsInstData[mode],
|
|
501
501
|
guid,
|
|
502
502
|
config,
|
|
503
503
|
animElement
|
|
@@ -506,7 +506,7 @@ export const PopsHandler = {
|
|
|
506
506
|
hide() {
|
|
507
507
|
return PopsInstanceUtils.hide(
|
|
508
508
|
mode,
|
|
509
|
-
|
|
509
|
+
PopsInstData[mode],
|
|
510
510
|
guid,
|
|
511
511
|
config,
|
|
512
512
|
animElement,
|
|
@@ -516,7 +516,7 @@ export const PopsHandler = {
|
|
|
516
516
|
show() {
|
|
517
517
|
return PopsInstanceUtils.show(
|
|
518
518
|
mode,
|
|
519
|
-
|
|
519
|
+
PopsInstData[mode],
|
|
520
520
|
guid,
|
|
521
521
|
config,
|
|
522
522
|
animElement,
|
|
@@ -660,8 +660,8 @@ export const PopsHandler = {
|
|
|
660
660
|
* @param type 当前弹窗类型
|
|
661
661
|
* @param config 配置
|
|
662
662
|
*/
|
|
663
|
-
handleOnly<T extends Required<
|
|
664
|
-
type:
|
|
663
|
+
handleOnly<T extends Required<PopsDetails[keyof PopsDetails]>>(
|
|
664
|
+
type: PopsType,
|
|
665
665
|
config: T
|
|
666
666
|
): T {
|
|
667
667
|
if (config.only) {
|
|
@@ -670,20 +670,20 @@ export const PopsHandler = {
|
|
|
670
670
|
type === "tooltip" ||
|
|
671
671
|
type === "rightClickMenu"
|
|
672
672
|
) {
|
|
673
|
-
let
|
|
674
|
-
if (
|
|
675
|
-
PopsInstanceUtils.removeInstance([
|
|
673
|
+
let inst = PopsInstData[type as keyof typeof PopsInstData];
|
|
674
|
+
if (inst) {
|
|
675
|
+
PopsInstanceUtils.removeInstance([inst], "", true);
|
|
676
676
|
}
|
|
677
677
|
} else {
|
|
678
678
|
PopsInstanceUtils.removeInstance(
|
|
679
679
|
[
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
680
|
+
PopsInstData.alert,
|
|
681
|
+
PopsInstData.confirm,
|
|
682
|
+
PopsInstData.prompt,
|
|
683
|
+
PopsInstData.iframe,
|
|
684
|
+
PopsInstData.drawer,
|
|
685
|
+
PopsInstData.folder,
|
|
686
|
+
PopsInstData.panel,
|
|
687
687
|
],
|
|
688
688
|
"",
|
|
689
689
|
true
|
|
@@ -707,7 +707,7 @@ export const PopsHandler = {
|
|
|
707
707
|
* @param type 当前弹窗类型
|
|
708
708
|
* @param value
|
|
709
709
|
*/
|
|
710
|
-
handlePush(type:
|
|
711
|
-
|
|
710
|
+
handlePush(type: PopsInstStoreType, value: PopsInstCommonConfig) {
|
|
711
|
+
PopsInstData[type].push(value);
|
|
712
712
|
},
|
|
713
713
|
};
|
package/src/types/button.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { PopsEventDetails, PopsHandlerEventDetails } from "./event";
|
|
2
2
|
import type { PopsIconType } from "./icon";
|
|
3
|
-
import type {
|
|
3
|
+
import type { PopsType } from "./main";
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* 按钮类型
|
|
@@ -51,7 +51,7 @@ export interface PopsBtnCallBackEvent {
|
|
|
51
51
|
/**
|
|
52
52
|
* 调用的方法
|
|
53
53
|
*/
|
|
54
|
-
mode:
|
|
54
|
+
mode: PopsType;
|
|
55
55
|
/**
|
|
56
56
|
* 唯一id
|
|
57
57
|
*/
|
package/src/types/event.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { PopsIframeDetails } from "../components/iframe/types";
|
|
2
|
-
import type {
|
|
2
|
+
import type { PopsType } from "./main";
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* 事件配置
|
|
@@ -12,7 +12,7 @@ export interface PopsIframeEventDetails {
|
|
|
12
12
|
/**
|
|
13
13
|
* 当前弹窗类型
|
|
14
14
|
*/
|
|
15
|
-
mode:
|
|
15
|
+
mode: PopsType;
|
|
16
16
|
/**
|
|
17
17
|
* 动画层
|
|
18
18
|
*/
|
|
@@ -47,7 +47,7 @@ export interface PopsEventDetails {
|
|
|
47
47
|
/** 遮罩层 */
|
|
48
48
|
maskElement?: HTMLDivElement;
|
|
49
49
|
/** 当前弹窗类型 */
|
|
50
|
-
mode:
|
|
50
|
+
mode: PopsType;
|
|
51
51
|
guid: string;
|
|
52
52
|
close: () => Promise<void>;
|
|
53
53
|
hide: () => Promise<void>;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* config
|
|
2
|
+
* config实例配置
|
|
3
3
|
*/
|
|
4
|
-
export interface
|
|
4
|
+
export interface PopsInstConfig {
|
|
5
5
|
/** 固定id */
|
|
6
6
|
guid: string;
|
|
7
7
|
/** 动画元素 */
|
|
@@ -11,12 +11,14 @@ export interface PopsLayerConfig {
|
|
|
11
11
|
/** 遮罩层元素 */
|
|
12
12
|
maskElement?: HTMLDivElement;
|
|
13
13
|
}
|
|
14
|
-
|
|
15
|
-
|
|
14
|
+
/**
|
|
15
|
+
* config实例通用配置
|
|
16
|
+
*/
|
|
17
|
+
export interface PopsInstCommonConfig extends PopsInstConfig {
|
|
16
18
|
/** shadow容器 */
|
|
17
19
|
$shadowContainer: HTMLDivElement;
|
|
18
20
|
/** shadow容器的shandowRoot */
|
|
19
21
|
$shadowRoot: ShadowRoot | HTMLElement;
|
|
20
22
|
/** 移除实例前的回调函数 */
|
|
21
|
-
beforeRemoveCallBack?: (
|
|
23
|
+
beforeRemoveCallBack?: (instCommonConfig: PopsInstCommonConfig) => void;
|
|
22
24
|
}
|
package/src/types/main.d.ts
CHANGED
|
@@ -22,7 +22,7 @@ export interface PopsUtilsOwnObject<V extends any> {
|
|
|
22
22
|
}
|
|
23
23
|
|
|
24
24
|
/** pops的所有类型配置 10个 */
|
|
25
|
-
export interface
|
|
25
|
+
export interface PopsDetails {
|
|
26
26
|
alert: PopsAlertDetails;
|
|
27
27
|
confirm: PopsConfirmDetails;
|
|
28
28
|
prompt: PopsPromptDetails;
|
|
@@ -35,42 +35,17 @@ export interface PopsAllDetails {
|
|
|
35
35
|
rightClickMenu: PopsRightClickMenuDetails;
|
|
36
36
|
}
|
|
37
37
|
|
|
38
|
-
/** pops的类型配置 8个 */
|
|
39
|
-
export interface PopsTypeDetails {
|
|
40
|
-
alert: PopsAlertDetails;
|
|
41
|
-
confirm: PopsConfirmDetails;
|
|
42
|
-
prompt: PopsPromptDetails;
|
|
43
|
-
loading: PopsLoadingDetails;
|
|
44
|
-
iframe: PopsIframeDetails;
|
|
45
|
-
// tooltip: PopsToolTipDetails;
|
|
46
|
-
drawer: PopsDrawerDetails;
|
|
47
|
-
folder: PopsFolderDetails;
|
|
48
|
-
panel: PopsPanelDetails;
|
|
49
|
-
// rightClickMenu: PopsRightClickMenuDetails;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
/** pops的类型 8个 */
|
|
53
|
-
export type PopsType = keyof PopsTypeDetails;
|
|
54
|
-
|
|
55
38
|
/** pops所有的类型 10个 */
|
|
56
|
-
export type
|
|
39
|
+
export type PopsType = keyof PopsDetails;
|
|
57
40
|
|
|
58
|
-
/** 存储实例的类型
|
|
59
|
-
export type
|
|
41
|
+
/** 存储实例的类型 10个 */
|
|
42
|
+
export type PopsInstStoreType = PopsType;
|
|
43
|
+
|
|
44
|
+
/** pops弹窗支持动画元素的配置 8个 */
|
|
45
|
+
export type PopsSupportAnim = Omit<PopsDetails, "tooltip" | "rightClickMenu">;
|
|
60
46
|
|
|
61
|
-
/** pops弹窗支持动画元素的配置 */
|
|
62
|
-
export interface PopsSupportAnim {
|
|
63
|
-
alert: PopsAlertDetails;
|
|
64
|
-
confirm: PopsConfirmDetails;
|
|
65
|
-
prompt: PopsPromptDetails;
|
|
66
|
-
loading: PopsLoadingDetails;
|
|
67
|
-
iframe: PopsIframeDetails;
|
|
68
|
-
drawer: PopsDrawerDetails;
|
|
69
|
-
folder: PopsFolderDetails;
|
|
70
|
-
panel: PopsPanelDetails;
|
|
71
|
-
}
|
|
72
47
|
/** pops弹窗支持动画元素的类型 */
|
|
73
|
-
export type
|
|
48
|
+
export type PopsSupportAnimType = keyof PopsSupportAnim;
|
|
74
49
|
|
|
75
50
|
/** pops弹窗支持标题栏的配置 */
|
|
76
51
|
export interface PopsSupportHeaderTitle {
|
|
@@ -6,12 +6,12 @@ import type { PopsIframeDetails } from "../components/iframe/types";
|
|
|
6
6
|
import type { PopsLoadingDetails } from "../components/loading/types";
|
|
7
7
|
import type { PopsPanelDetails } from "../components/panel/types";
|
|
8
8
|
import type { PopsPromptDetails } from "../components/prompt/types/index";
|
|
9
|
-
import type {
|
|
10
|
-
import type {
|
|
9
|
+
import type { PopsInstCommonConfig } from "../types/inst";
|
|
10
|
+
import type { PopsInstStoreType } from "../types/main";
|
|
11
11
|
import { popsDOMUtils } from "./PopsDOMUtils";
|
|
12
12
|
import { popsUtils } from "./PopsUtils";
|
|
13
13
|
import { PopsCore } from "../PopsCore";
|
|
14
|
-
import {
|
|
14
|
+
import { PopsInstData } from "../PopsInst";
|
|
15
15
|
import { PopsAnimation } from "../PopsAnimation";
|
|
16
16
|
|
|
17
17
|
export const PopsInstanceUtils = {
|
|
@@ -121,18 +121,18 @@ export const PopsInstanceUtils = {
|
|
|
121
121
|
function isVisibleNode($css: CSSStyleDeclaration): boolean {
|
|
122
122
|
return $css.position !== "static" && $css.display !== "none";
|
|
123
123
|
}
|
|
124
|
-
Object.keys(
|
|
125
|
-
let
|
|
126
|
-
for (let index = 0; index <
|
|
127
|
-
const
|
|
128
|
-
let nodeStyle = window.getComputedStyle(
|
|
124
|
+
Object.keys(PopsInstData).forEach((instKeyName) => {
|
|
125
|
+
let instData = PopsInstData[instKeyName as PopsInstStoreType];
|
|
126
|
+
for (let index = 0; index < instData.length; index++) {
|
|
127
|
+
const inst = instData[index];
|
|
128
|
+
let nodeStyle = window.getComputedStyle(inst.animElement);
|
|
129
129
|
/* 不对position为static和display为none的元素进行获取它们的z-index */
|
|
130
130
|
if (isVisibleNode(nodeStyle)) {
|
|
131
131
|
let nodeZIndex = parseInt(nodeStyle.zIndex);
|
|
132
132
|
if (!isNaN(nodeZIndex)) {
|
|
133
133
|
if (nodeZIndex > zIndex) {
|
|
134
134
|
zIndex = nodeZIndex;
|
|
135
|
-
maxZIndexNode =
|
|
135
|
+
maxZIndexNode = inst.animElement;
|
|
136
136
|
}
|
|
137
137
|
}
|
|
138
138
|
}
|
|
@@ -158,85 +158,85 @@ export const PopsInstanceUtils = {
|
|
|
158
158
|
},
|
|
159
159
|
/**
|
|
160
160
|
* 删除配置中对应的对象
|
|
161
|
-
* @param
|
|
161
|
+
* @param instConfigList 配置实例列表
|
|
162
162
|
* @param guid 唯一标识
|
|
163
163
|
* @param isAll 是否全部删除
|
|
164
164
|
*/
|
|
165
165
|
removeInstance(
|
|
166
|
-
|
|
166
|
+
instConfigList: PopsInstCommonConfig[][],
|
|
167
167
|
guid: string,
|
|
168
168
|
isAll = false
|
|
169
169
|
) {
|
|
170
170
|
/**
|
|
171
171
|
* 移除元素实例
|
|
172
|
-
* @param
|
|
172
|
+
* @param instCommonConfig
|
|
173
173
|
*/
|
|
174
|
-
function removeItem(
|
|
175
|
-
if (typeof
|
|
174
|
+
function removeItem(instCommonConfig: PopsInstCommonConfig) {
|
|
175
|
+
if (typeof instCommonConfig.beforeRemoveCallBack === "function") {
|
|
176
176
|
// 调用移除签的回调
|
|
177
|
-
|
|
177
|
+
instCommonConfig.beforeRemoveCallBack(instCommonConfig);
|
|
178
178
|
}
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
179
|
+
instCommonConfig?.animElement?.remove();
|
|
180
|
+
instCommonConfig?.popsElement?.remove();
|
|
181
|
+
instCommonConfig?.maskElement?.remove();
|
|
182
|
+
instCommonConfig?.$shadowContainer?.remove();
|
|
183
183
|
}
|
|
184
|
-
// [
|
|
185
|
-
|
|
186
|
-
//
|
|
187
|
-
|
|
184
|
+
// [ inst[], inst[],...]
|
|
185
|
+
instConfigList.forEach((instConfigList) => {
|
|
186
|
+
// inst[]
|
|
187
|
+
instConfigList.forEach((instConfigItem, index) => {
|
|
188
188
|
// 移除全部或者guid相同
|
|
189
|
-
if (isAll ||
|
|
189
|
+
if (isAll || instConfigItem["guid"] === guid) {
|
|
190
190
|
// 判断是否有动画
|
|
191
|
-
let animName =
|
|
191
|
+
let animName = instConfigItem.animElement.getAttribute(
|
|
192
192
|
"anim"
|
|
193
193
|
) as string;
|
|
194
194
|
if (PopsAnimation.hasAnim(animName)) {
|
|
195
195
|
let reverseAnimName = animName + "-reverse";
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
(
|
|
196
|
+
instConfigItem.animElement.style.width = "100%";
|
|
197
|
+
instConfigItem.animElement.style.height = "100%";
|
|
198
|
+
(instConfigItem.animElement.style as any)["animation-name"] =
|
|
199
199
|
reverseAnimName;
|
|
200
200
|
if (
|
|
201
201
|
PopsAnimation.hasAnim(
|
|
202
|
-
(
|
|
202
|
+
(instConfigItem.animElement.style as any)["animation-name"]
|
|
203
203
|
)
|
|
204
204
|
) {
|
|
205
205
|
popsDOMUtils.on(
|
|
206
|
-
|
|
206
|
+
instConfigItem.animElement,
|
|
207
207
|
popsDOMUtils.getAnimationEndNameList(),
|
|
208
208
|
function () {
|
|
209
|
-
removeItem(
|
|
209
|
+
removeItem(instConfigItem);
|
|
210
210
|
},
|
|
211
211
|
{
|
|
212
212
|
capture: true,
|
|
213
213
|
}
|
|
214
214
|
);
|
|
215
215
|
} else {
|
|
216
|
-
removeItem(
|
|
216
|
+
removeItem(instConfigItem);
|
|
217
217
|
}
|
|
218
218
|
} else {
|
|
219
|
-
removeItem(
|
|
219
|
+
removeItem(instConfigItem);
|
|
220
220
|
}
|
|
221
|
-
|
|
221
|
+
instConfigList.splice(index, 1);
|
|
222
222
|
}
|
|
223
223
|
});
|
|
224
224
|
});
|
|
225
225
|
|
|
226
|
-
return
|
|
226
|
+
return instConfigList;
|
|
227
227
|
},
|
|
228
228
|
/**
|
|
229
229
|
* 隐藏
|
|
230
230
|
* @param popsType
|
|
231
|
-
* @param
|
|
231
|
+
* @param instConfigList
|
|
232
232
|
* @param guid
|
|
233
233
|
* @param config
|
|
234
234
|
* @param animElement
|
|
235
235
|
* @param maskElement
|
|
236
236
|
*/
|
|
237
237
|
hide(
|
|
238
|
-
popsType:
|
|
239
|
-
|
|
238
|
+
popsType: PopsInstStoreType,
|
|
239
|
+
instConfigList: PopsInstCommonConfig[],
|
|
240
240
|
guid: string,
|
|
241
241
|
config:
|
|
242
242
|
| PopsAlertDetails
|
|
@@ -267,31 +267,33 @@ export const PopsInstanceUtils = {
|
|
|
267
267
|
resolve();
|
|
268
268
|
}, drawerConfig.closeDelay);
|
|
269
269
|
} else {
|
|
270
|
-
let
|
|
271
|
-
(
|
|
270
|
+
let fintInst = instConfigList.find(
|
|
271
|
+
(instConfigItem) => instConfigItem.guid === guid
|
|
272
272
|
);
|
|
273
|
-
if (
|
|
273
|
+
if (fintInst) {
|
|
274
274
|
/* 存在动画 */
|
|
275
|
-
let
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
275
|
+
let instConfigItem = fintInst;
|
|
276
|
+
instConfigItem.animElement.style.width = "100%";
|
|
277
|
+
instConfigItem.animElement.style.height = "100%";
|
|
278
|
+
// @ts-ignore
|
|
279
|
+
instConfigItem.animElement.style["animation-name"] =
|
|
280
|
+
instConfigItem.animElement.getAttribute("anim") + "-reverse";
|
|
280
281
|
if (
|
|
281
282
|
PopsAnimation.hasAnim(
|
|
282
|
-
|
|
283
|
+
// @ts-ignore
|
|
284
|
+
instConfigItem.animElement.style["animation-name"]
|
|
283
285
|
)
|
|
284
286
|
) {
|
|
285
287
|
/**
|
|
286
288
|
* 动画结束的回调
|
|
287
289
|
*/
|
|
288
290
|
function animationendCallBack() {
|
|
289
|
-
|
|
290
|
-
if (
|
|
291
|
-
|
|
291
|
+
instConfigItem.animElement.style.display = "none";
|
|
292
|
+
if (instConfigItem.maskElement) {
|
|
293
|
+
instConfigItem.maskElement.style.display = "none";
|
|
292
294
|
}
|
|
293
295
|
popsDOMUtils.off(
|
|
294
|
-
|
|
296
|
+
instConfigItem.animElement,
|
|
295
297
|
popsDOMUtils.getAnimationEndNameList(),
|
|
296
298
|
animationendCallBack,
|
|
297
299
|
{
|
|
@@ -301,7 +303,7 @@ export const PopsInstanceUtils = {
|
|
|
301
303
|
resolve();
|
|
302
304
|
}
|
|
303
305
|
popsDOMUtils.on(
|
|
304
|
-
|
|
306
|
+
instConfigItem.animElement,
|
|
305
307
|
popsDOMUtils.getAnimationEndNameList(),
|
|
306
308
|
animationendCallBack,
|
|
307
309
|
{
|
|
@@ -309,9 +311,9 @@ export const PopsInstanceUtils = {
|
|
|
309
311
|
}
|
|
310
312
|
);
|
|
311
313
|
} else {
|
|
312
|
-
|
|
313
|
-
if (
|
|
314
|
-
|
|
314
|
+
instConfigItem.animElement.style.display = "none";
|
|
315
|
+
if (instConfigItem.maskElement) {
|
|
316
|
+
instConfigItem.maskElement.style.display = "none";
|
|
315
317
|
}
|
|
316
318
|
|
|
317
319
|
resolve();
|
|
@@ -323,15 +325,15 @@ export const PopsInstanceUtils = {
|
|
|
323
325
|
/**
|
|
324
326
|
* 显示
|
|
325
327
|
* @param popsType
|
|
326
|
-
* @param
|
|
328
|
+
* @param instConfigList
|
|
327
329
|
* @param guid
|
|
328
330
|
* @param config
|
|
329
331
|
* @param animElement
|
|
330
332
|
* @param maskElement
|
|
331
333
|
*/
|
|
332
334
|
show(
|
|
333
|
-
popsType:
|
|
334
|
-
|
|
335
|
+
popsType: PopsInstStoreType,
|
|
336
|
+
instConfigList: PopsInstCommonConfig[],
|
|
335
337
|
guid: string,
|
|
336
338
|
config:
|
|
337
339
|
| PopsAlertDetails
|
|
@@ -364,20 +366,21 @@ export const PopsInstanceUtils = {
|
|
|
364
366
|
resolve();
|
|
365
367
|
}, drawerConfig.openDelay ?? 0);
|
|
366
368
|
} else {
|
|
367
|
-
let
|
|
368
|
-
(
|
|
369
|
+
let fintInst = instConfigList.find(
|
|
370
|
+
(instConfigItem) => instConfigItem.guid === guid
|
|
369
371
|
);
|
|
370
|
-
if (
|
|
371
|
-
let
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
372
|
+
if (fintInst) {
|
|
373
|
+
let instConfigItem = fintInst;
|
|
374
|
+
instConfigItem.animElement.style.width = "";
|
|
375
|
+
instConfigItem.animElement.style.height = "";
|
|
376
|
+
// @ts-ignore
|
|
377
|
+
instConfigItem.animElement.style["animation-name"] = instConfigItem
|
|
378
|
+
.animElement!.getAttribute("anim")!
|
|
379
|
+
.replace("-reverse", "");
|
|
378
380
|
if (
|
|
379
381
|
PopsAnimation.hasAnim(
|
|
380
|
-
|
|
382
|
+
// @ts-ignore
|
|
383
|
+
instConfigItem.animElement.style["animation-name"]
|
|
381
384
|
)
|
|
382
385
|
) {
|
|
383
386
|
/**
|
|
@@ -385,7 +388,7 @@ export const PopsInstanceUtils = {
|
|
|
385
388
|
*/
|
|
386
389
|
function animationendCallBack() {
|
|
387
390
|
popsDOMUtils.off(
|
|
388
|
-
|
|
391
|
+
instConfigItem.animElement,
|
|
389
392
|
popsDOMUtils.getAnimationEndNameList(),
|
|
390
393
|
animationendCallBack,
|
|
391
394
|
{
|
|
@@ -394,12 +397,12 @@ export const PopsInstanceUtils = {
|
|
|
394
397
|
);
|
|
395
398
|
resolve();
|
|
396
399
|
}
|
|
397
|
-
|
|
398
|
-
if (
|
|
399
|
-
|
|
400
|
+
instConfigItem.animElement.style.display = "";
|
|
401
|
+
if (instConfigItem.maskElement) {
|
|
402
|
+
instConfigItem.maskElement.style.display = "";
|
|
400
403
|
}
|
|
401
404
|
popsDOMUtils.on(
|
|
402
|
-
|
|
405
|
+
instConfigItem.animElement,
|
|
403
406
|
popsDOMUtils.getAnimationEndNameList(),
|
|
404
407
|
animationendCallBack,
|
|
405
408
|
{
|
|
@@ -407,9 +410,9 @@ export const PopsInstanceUtils = {
|
|
|
407
410
|
}
|
|
408
411
|
);
|
|
409
412
|
} else {
|
|
410
|
-
|
|
411
|
-
if (
|
|
412
|
-
|
|
413
|
+
instConfigItem.animElement.style.display = "";
|
|
414
|
+
if (instConfigItem.maskElement) {
|
|
415
|
+
instConfigItem.maskElement.style.display = "";
|
|
413
416
|
}
|
|
414
417
|
resolve();
|
|
415
418
|
}
|
|
@@ -420,14 +423,14 @@ export const PopsInstanceUtils = {
|
|
|
420
423
|
/**
|
|
421
424
|
* 关闭
|
|
422
425
|
* @param popsType
|
|
423
|
-
* @param
|
|
426
|
+
* @param instConfigList
|
|
424
427
|
* @param guid
|
|
425
428
|
* @param config
|
|
426
429
|
* @param animElement
|
|
427
430
|
*/
|
|
428
431
|
close(
|
|
429
432
|
popsType: string,
|
|
430
|
-
|
|
433
|
+
instConfigList: PopsInstCommonConfig[],
|
|
431
434
|
guid: string,
|
|
432
435
|
config:
|
|
433
436
|
| PopsAlertDetails
|
|
@@ -461,7 +464,7 @@ export const PopsInstanceUtils = {
|
|
|
461
464
|
void 0,
|
|
462
465
|
closeCallBack
|
|
463
466
|
);
|
|
464
|
-
PopsInstanceUtils.removeInstance([
|
|
467
|
+
PopsInstanceUtils.removeInstance([instConfigList], guid);
|
|
465
468
|
resolve();
|
|
466
469
|
}
|
|
467
470
|
/* 监听过渡结束 */
|
|
@@ -498,7 +501,7 @@ export const PopsInstanceUtils = {
|
|
|
498
501
|
transitionendEvent();
|
|
499
502
|
}, drawerConfig.closeDelay);
|
|
500
503
|
} else {
|
|
501
|
-
PopsInstanceUtils.removeInstance([
|
|
504
|
+
PopsInstanceUtils.removeInstance([instConfigList], guid);
|
|
502
505
|
resolve();
|
|
503
506
|
}
|
|
504
507
|
});
|
package/src/PopsLayer.ts
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import type { PopsLayerCommonConfig } from "./types/layer";
|
|
2
|
-
import type { PopsLayerMode } from "./types/main";
|
|
3
|
-
|
|
4
|
-
export const PopsLayerData: {
|
|
5
|
-
[key in PopsLayerMode]: PopsLayerCommonConfig[];
|
|
6
|
-
} = {
|
|
7
|
-
alert: [],
|
|
8
|
-
confirm: [],
|
|
9
|
-
drawer: [],
|
|
10
|
-
folder: [],
|
|
11
|
-
iframe: [],
|
|
12
|
-
loading: [],
|
|
13
|
-
panel: [],
|
|
14
|
-
prompt: [],
|
|
15
|
-
rightClickMenu: [],
|
|
16
|
-
// 没有 searchSuggestion
|
|
17
|
-
tooltip: [],
|
|
18
|
-
};
|