@whitesev/pops 4.0.2 → 4.2.0
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 +363 -275
- package/dist/index.amd.js.map +1 -1
- package/dist/index.amd.min.js +1 -1
- package/dist/index.amd.min.js.map +1 -1
- package/dist/index.cjs.js +363 -275
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.cjs.min.js +1 -1
- package/dist/index.cjs.min.js.map +1 -1
- package/dist/index.esm.js +363 -275
- package/dist/index.esm.js.map +1 -1
- package/dist/index.esm.min.js +1 -1
- package/dist/index.esm.min.js.map +1 -1
- package/dist/index.iife.js +363 -275
- package/dist/index.iife.js.map +1 -1
- package/dist/index.iife.min.js +1 -1
- package/dist/index.iife.min.js.map +1 -1
- package/dist/index.system.js +363 -275
- package/dist/index.system.js.map +1 -1
- package/dist/index.system.min.js +1 -1
- package/dist/index.system.min.js.map +1 -1
- package/dist/index.umd.js +363 -275
- package/dist/index.umd.js.map +1 -1
- package/dist/index.umd.min.js +1 -1
- package/dist/index.umd.min.js.map +1 -1
- package/dist/types/src/Pops.d.ts +116 -16
- package/dist/types/src/components/loading/types/index.d.ts +1 -1
- package/dist/types/src/components/panel/index.d.ts +3 -2
- package/dist/types/src/components/rightClickMenu/types/index.d.ts +1 -1
- package/dist/types/src/components/searchSuggestion/types/index.d.ts +1 -1
- package/dist/types/src/components/tooltip/index.d.ts +82 -1
- package/dist/types/src/components/tooltip/types/index.d.ts +1 -1
- package/dist/types/src/config/GlobalConfig.d.ts +3 -3
- package/dist/types/src/event/EventEmiter.d.ts +7 -1
- package/dist/types/src/handler/PopsInstHandler.d.ts +4 -4
- package/dist/types/src/types/EventEmitter.d.ts +21 -0
- package/dist/types/src/types/PopsDOMUtilsEventType.d.ts +1 -1
- package/dist/types/src/types/components.d.ts +15 -18
- package/dist/types/src/types/global.d.ts +2 -0
- package/dist/types/src/types/mask.d.ts +6 -6
- package/dist/types/src/utils/PopsDOMUtils.d.ts +2 -2
- package/dist/types/src/utils/PopsInstanceUtils.d.ts +22 -0
- package/dist/types/src/utils/PopsUtils.d.ts +21 -16
- package/package.json +1 -1
- package/src/Pops.ts +11 -11
- package/src/components/alert/defaultConfig.ts +1 -1
- package/src/components/alert/index.ts +1 -1
- package/src/components/confirm/defaultConfig.ts +1 -1
- package/src/components/confirm/index.ts +1 -1
- package/src/components/drawer/defaultConfig.ts +1 -1
- package/src/components/drawer/index.ts +2 -1
- package/src/components/folder/defaultConfig.ts +1 -1
- package/src/components/folder/index.ts +1 -1
- package/src/components/iframe/defaultConfig.ts +1 -1
- package/src/components/iframe/index.ts +10 -6
- package/src/components/loading/defaultConfig.ts +1 -0
- package/src/components/loading/index.ts +10 -10
- package/src/components/loading/types/index.ts +1 -4
- package/src/components/panel/defaultConfig.ts +1 -1
- package/src/components/panel/handlerComponents.ts +4 -4
- package/src/components/panel/index.ts +3 -2
- package/src/components/prompt/defaultConfig.ts +1 -1
- package/src/components/prompt/index.ts +1 -1
- package/src/components/rightClickMenu/defaultConfig.ts +1 -1
- package/src/components/rightClickMenu/index.ts +1 -1
- package/src/components/rightClickMenu/types/index.ts +1 -1
- package/src/components/searchSuggestion/defaultConfig.ts +1 -0
- package/src/components/searchSuggestion/index.ts +1 -1
- package/src/components/searchSuggestion/types/index.ts +1 -1
- package/src/components/tooltip/defaultConfig.ts +1 -1
- package/src/components/tooltip/index.ts +1 -1
- package/src/components/tooltip/types/index.ts +1 -1
- package/src/event/EventEmiter.ts +15 -14
- package/src/handler/PopsHandler.ts +9 -21
- package/src/handler/PopsInstHandler.ts +65 -47
- package/src/types/EventEmitter.d.ts +21 -0
- package/src/types/PopsDOMUtilsEventType.d.ts +1 -1
- package/src/types/components.d.ts +15 -18
- package/src/types/global.d.ts +2 -0
- package/src/types/mask.d.ts +6 -6
- package/src/utils/PopsDOMUtils.ts +6 -3
- package/src/utils/PopsInstanceUtils.ts +50 -0
- package/src/utils/PopsUtils.ts +95 -68
- package/dist/types/src/utils/PopsDOMUtilsEventsConfig.d.ts +0 -4
- package/src/utils/PopsDOMUtilsEventsConfig.ts +0 -4
package/dist/index.umd.js
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.pops = factory());
|
|
5
5
|
})(this, (function () { 'use strict';
|
|
6
6
|
|
|
7
|
-
const version = "4.0
|
|
7
|
+
const version = "4.2.0";
|
|
8
8
|
|
|
9
9
|
const GlobalConfig = {
|
|
10
10
|
config: {},
|
|
@@ -63,15 +63,16 @@
|
|
|
63
63
|
};
|
|
64
64
|
|
|
65
65
|
class EventEmiter {
|
|
66
|
-
|
|
67
|
-
|
|
66
|
+
[Symbol.toStringTag] = "EventEmiter";
|
|
67
|
+
type;
|
|
68
|
+
data = new Map();
|
|
68
69
|
constructor(type) {
|
|
69
|
-
this
|
|
70
|
+
this.type = type;
|
|
70
71
|
}
|
|
71
72
|
on(eventName, callback) {
|
|
72
|
-
const eventList = this
|
|
73
|
-
eventList.push({ type: this
|
|
74
|
-
this
|
|
73
|
+
const eventList = this.data.get(eventName) ?? [];
|
|
74
|
+
eventList.push({ type: this.type, time: Date.now(), callback: callback });
|
|
75
|
+
this.data.set(eventName, eventList);
|
|
75
76
|
return {
|
|
76
77
|
off: () => {
|
|
77
78
|
this.off(eventName, callback);
|
|
@@ -82,7 +83,7 @@
|
|
|
82
83
|
};
|
|
83
84
|
}
|
|
84
85
|
off(eventName, callback) {
|
|
85
|
-
const eventList = this
|
|
86
|
+
const eventList = this.data.get(eventName) ?? [];
|
|
86
87
|
let isOffSuccess = false;
|
|
87
88
|
for (let index = eventList.length - 1; index >= 0; index--) {
|
|
88
89
|
if (eventList[index].callback === callback) {
|
|
@@ -92,27 +93,27 @@
|
|
|
92
93
|
}
|
|
93
94
|
if (eventList.length === 0) {
|
|
94
95
|
// empty
|
|
95
|
-
this
|
|
96
|
+
this.data.delete(eventName);
|
|
96
97
|
}
|
|
97
98
|
else {
|
|
98
99
|
if (isOffSuccess) {
|
|
99
100
|
// update
|
|
100
|
-
this
|
|
101
|
+
this.data.set(eventName, eventList);
|
|
101
102
|
}
|
|
102
103
|
}
|
|
103
104
|
}
|
|
104
105
|
async emit(eventName, ...args) {
|
|
105
|
-
const eventList = this
|
|
106
|
+
const eventList = this.data.get(eventName) ?? [];
|
|
106
107
|
for (const item of eventList) {
|
|
107
108
|
await item.callback(...args);
|
|
108
109
|
}
|
|
109
110
|
}
|
|
110
111
|
offAll(eventName) {
|
|
111
112
|
if (typeof eventName === "string") {
|
|
112
|
-
this
|
|
113
|
+
this.data.delete(eventName);
|
|
113
114
|
}
|
|
114
115
|
else {
|
|
115
|
-
this
|
|
116
|
+
this.data.clear();
|
|
116
117
|
}
|
|
117
118
|
}
|
|
118
119
|
/**
|
|
@@ -120,10 +121,10 @@
|
|
|
120
121
|
*/
|
|
121
122
|
getAllEvents(eventName) {
|
|
122
123
|
if (typeof eventName === "string") {
|
|
123
|
-
return this
|
|
124
|
+
return this.data.get(eventName);
|
|
124
125
|
}
|
|
125
126
|
else {
|
|
126
|
-
return Array.from(this
|
|
127
|
+
return Array.from(this.data.values());
|
|
127
128
|
}
|
|
128
129
|
}
|
|
129
130
|
}
|
|
@@ -247,11 +248,6 @@
|
|
|
247
248
|
},
|
|
248
249
|
};
|
|
249
250
|
|
|
250
|
-
/**
|
|
251
|
-
* 存储在元素属性上的事件名
|
|
252
|
-
*/
|
|
253
|
-
const SymbolEvents = Symbol("events_" + (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1));
|
|
254
|
-
|
|
255
251
|
const OriginPrototype = {
|
|
256
252
|
Object: {
|
|
257
253
|
defineProperty: Object.defineProperty,
|
|
@@ -301,31 +297,31 @@
|
|
|
301
297
|
},
|
|
302
298
|
};
|
|
303
299
|
|
|
304
|
-
|
|
300
|
+
const n$1="clientX",e$2="clientY",t$1=16,c$3="start",o$1="move",s$1="cancel",u$3="end",a$2="left",i$3="right",r$4="up",d$1="down",m$2={4:"start",5:"move",1:"end",3:"cancel"};function v$1(n){return m$2[n]}function b(n,e,t){const c={1:{0:{move:4},4:{move:5,end:1,cancel:3},5:{move:5,end:1,cancel:3}},0:{4:{move:2,end:1,cancel:3},5:{start:2,move:2,end:1,cancel:3}}}[Number(n)][e];return void 0!==c&&c[t]||0}function g$1(n){[1,3,2].includes(n.state)&&(n.state=0);}function h$3(n){return [5,1,3].includes(n)}function j(n){if(n.disabled)return n.state=0,true}function O(n,e){return Object.assign(Object.assign(Object.assign({},n),e),{state:0,disabled:false})}function p$3(n){return Math.round(100*n)/100}
|
|
305
301
|
|
|
306
|
-
|
|
302
|
+
var x=r=>Math.sqrt(r.x*r.x+r.y*r.y),y=(r,a)=>r.x*a.x+r.y*a.y,e$1=(r,a)=>{var t=x(r)*x(a);if(0===t)return 0;var h=y(r,a)/t;return h>1&&(h=1),Math.acos(h)},n=(r,a)=>r.x*a.y-a.x*r.y,o=r=>r/Math.PI*180,s=(r,a)=>{var t=e$1(r,a);return n(r,a)>0&&(t*=-1),o(t)},u$2=(x,y)=>{if(0!==x||0!==y)return Math.abs(x)>=Math.abs(y)?0<x?i$3:a$2:0<y?d$1:r$4};
|
|
307
303
|
|
|
308
|
-
function
|
|
304
|
+
function p$2(){let n=0,e=0;return function(o,r){const{prevVecotr:i,startVecotr:a,activeVecotr:c}=r;return c&&(e=Math.round(s(c,i)),n=Math.round(s(c,a))),{angle:n,deltaAngle:e}}}function d(){return function(t){const{prevInput:e}=t;let o$1=0,r=0,i=0;if(void 0!==e&&(o$1=t.x-e.x,r=t.y-e.y,0!==o$1||0!==r)){const t=Math.sqrt(Math.pow(o$1,2)+Math.pow(r,2));i=Math.round(o(Math.acos(Math.abs(o$1)/t)));}return {deltaX:o$1,deltaY:r,deltaXYAngle:i}}}function h$2(){let t,n=0,u=0,s=0,p=0,d=0;return function(h){const{phase:l,startInput:f}=h;return c$3===l?(n=0,u=0,s=0,p=0,d=0):o$1===l&&(n=Math.round(h.points[0][n$1]-f.points[0][n$1]),u=Math.round(h.points[0][e$2]-f.points[0][e$2]),s=Math.abs(n),p=Math.abs(u),d=Math.round(x({x:s,y:p})),t=u$2(n,u)),{displacementX:n,displacementY:u,distanceX:s,distanceY:p,distance:d,overallDirection:t}}}function l$1(){let t=1;return function(n,o){let r=1;const{prevVecotr:i,startVecotr:a,activeVecotr:c}=o;return c&&(r=p$3(x(c)/x(i)),t=p$3(x(c)/x(a))),{scale:t,deltaScale:r}}}function f(){let t,n,e=0,r=0,i=0,a=0;return function(c){if(void 0!==c){n=n||c.startInput;const u=c.timestamp-n.timestamp;if(t$1<u){const s=c.x-n.x,p=c.y-n.y;i=Math.round(s/u*100)/100,a=Math.round(p/u*100)/100,e=Math.abs(i),r=Math.abs(a),t=u$2(s,p),n=c;}}return {velocityX:e,velocityY:r,speedX:i,speedY:a,direction:t}}}function M(){let t=0;return function(n){const{phase:e}=n;return c$3===e&&(t=n.pointLength),{maxPointLength:t}}}function v(t){return {x:t.points[1][n$1]-t.points[0][n$1],y:t.points[1][e$2]-t.points[0][e$2]}}function m$1(){let t,n,e;return function(o){const{prevInput:r,startMultiInput:i}=o;return void 0!==i&&void 0!==r&&o.id!==i.id&&1<r.pointLength&&1<o.pointLength?(t=v(i),n=v(r),e=v(o)):e=void 0,{startVecotr:t,prevVecotr:n,activeVecotr:e}}}
|
|
309
305
|
|
|
310
|
-
|
|
306
|
+
const m={name:"tap",pointLength:1,tapTimes:1,waitNextTapTime:300,maxDistance:2,maxDistanceFromPrevTap:9,maxPressTime:250};function r$3(r,s){const c=O(m,s);let p,u,x$1,T=0;function f(){T=0,p=void 0,u=void 0;}return r.compute([h$2,M],(t=>{if(j(c))return;const{phase:i,x:o,y:m}=t;u$3===i&&(c.state=0,!function(){const{startInput:e,pointLength:n,timestamp:a}=t,i=a-e.timestamp,{distance:o,maxPointLength:m}=t;return m===c.pointLength&&0===n&&c.maxDistance>=o&&c.maxPressTime>i}()?(f(),c.state=2):(clearTimeout(x$1),function(t,e){if(void 0!==p){const n=x({x:t.x-p.x,y:t.y-p.y});return p=t,e.maxDistanceFromPrevTap>=n}return p=t,true}({x:o,y:m},c)&&function(t){const e=performance.now();if(void 0===u)return u=e,true;{const n=e-u;return u=e,n<t}}(c.waitNextTapTime)?T++:T=1,0==T%c.tapTimes?(c.state=1,r.emit2(c.name,t,c),f()):x$1=setTimeout((()=>{c.state=2,f();}),c.waitNextTapTime)));})),c}
|
|
311
307
|
|
|
312
|
-
function
|
|
308
|
+
function e(e){e.use(r$3,{name:"doubletap",tapTimes:2});const a=e.get("doubletap");let o;return e.beforeEach(((t,e)=>{"tap"===t?(clearTimeout(o),o=setTimeout((()=>{[0,2].includes(a.state)&&e();}),300)):e();})),a}
|
|
313
309
|
|
|
314
|
-
|
|
310
|
+
class t{constructor(){this.__map={};}beforeEach(t){this.__interceptor=t;}on(t,i){const s=Array.isArray(t)?t:[t];for(const t of s){this.__map[t]=this.__map[t]||[];const s=this.__map[t];s&&s.push(i);}return this}emit(t,i,s){ void 0!==this.__interceptor?this.__interceptor(t,(()=>{this.__emit(t,i),s&&s();})):(this.__emit(t,i),s&&s());}__emit(t,i){const s=this.__map[t];if(Array.isArray(s)&&(null==s?void 0:s.length))for(const _ of s)_(i,t);this.event=i;}off(t,i){const s=this.__map[t];if(void 0!==s)if(void 0===i)delete this.__map[t];else {const t=s.findIndex((t=>t===i));s.splice(t,1);}}destroy(){this.__map={};}}
|
|
315
311
|
|
|
316
|
-
const
|
|
312
|
+
function r$2(){let t,o,i,r,a=0;return function(u){if(t=o,void 0!==u){a=Number.MAX_SAFE_INTEGER>a?++a:1;const h=function(t,o){const{phase:i,points:r,changedPoints:a,nativeEvent:u}=t,h=r.length,p=c$3===i,g=u$3===i&&0===h||s$1===i,l=Date.now(),{x:d,y:m}=c$2(r)||c$2(a),{currentTarget:v}=u;return Object.assign(t,{id:o,x:d,y:m,timestamp:l,isStart:p,isEnd:g,pointLength:h,currentTarget:v,getOffset(t=v){const e=t.getBoundingClientRect();return {x:d-Math.round(e.left),y:m-Math.round(e.top)}}})}(u,a);o=h;const{isStart:p,pointLength:g}=h;return p&&(i=h,t=void 0,r=1<g?h:void 0),Object.assign(Object.assign({},h),{prevInput:t,startMultiInput:r,startInput:i})}}}function c$2(t){const{length:e}=t;if(0<e){if(1===e){const{clientX:e,clientY:n}=t[0];return {x:Math.round(e),y:Math.round(n)}}const n=t.reduce(((t,e)=>(t.x+=e[n$1],t.y+=e[e$2],t)),{x:0,y:0});return {x:Math.round(n.x/e),y:Math.round(n.y/e)}}}function a$1(t,e,n,s){const o={};for(const t in n)["target","currentTarget","type"].includes(t)||(o[t]=n[t]);let i;return document.createEvent?(i=document.createEvent("HTMLEvents"),i.initEvent(t,null==s?void 0:s.bubbles,null==s?void 0:s.cancelable)):i=new Event(t,s),Object.assign(i,o,{match:()=>n.targets&&0<n.targets.length&&n.targets.every((t=>i.currentTarget.contains(t)))}),e.dispatchEvent(i)}function u$1(t,e){const{preventDefault:n}=e;return s=n,"[object Function]"===Object.prototype.toString.call(s)?n(t):!!n;var s;}const h$1=["touchstart","touchmove","touchend","touchcancel","mousedown"],p$1=["mousemove","mouseup"];const g={domEvents:{bubbles:true,cancelable:true},preventDefault:t=>{if(t.target&&"tagName"in t.target){const{tagName:e}=t.target;return !/^(?:INPUT|TEXTAREA|BUTTON|SELECT)$/.test(e)}return false}};class l extends t{constructor(t,e){super(),this.v="2.1.3",this.__computeFunctionList=[],this.__computeFunctionCreatorList=[],this.__pluginContexts=[],this.__isIgnoreMouse=false,this.el=t,this.c={},this.__options=Object.assign(Object.assign({},g),e);const n=function(t){const e=r$2();return function(n){const s=[],o=[];Array.from(n.touches).forEach((({clientX:e,clientY:n,target:i})=>{(null==t?void 0:t.contains(i))&&(s.push(i),o.push({clientX:e,clientY:n,target:i}));}));const i=Array.from(n.changedTouches).map((({clientX:t,clientY:e,target:n})=>({clientX:t,clientY:e,target:n})));return e({phase:n.type.replace("touch",""),changedPoints:i,points:o,nativeEvent:n,target:n.target,targets:s})}}(this.el),s=function(){let t,e=false,n=null;const s=r$2();return function(o){const{clientX:i,clientY:r,type:c,button:a,target:u}=o;let h,p=[{clientX:i,clientY:r,target:u}];if("mousedown"===c&&0===a)n=u,e=true,h="start";else {if(!e)return;"mousemove"===c?h="move":"mouseup"===c&&(p=[],h="end",e=false);}const g=t||[{clientX:i,clientY:r,target:u}];if(t=[{clientX:i,clientY:r,target:u}],void 0!==h)return s({phase:h,changedPoints:g,points:p,target:n,targets:[n],nativeEvent:o})}}();if(this.__inputCreatorMap={touchstart:n,touchmove:n,touchend:n,touchcancel:n,mousedown:s,mousemove:s,mouseup:s},this.on("at:after",(t=>{const{target:e,__type:n}=t,{domEvents:s}=this.__options;s&&void 0!==this.el&&e&&(a$1(n,e,t,s),a$1("at:after",e,t,s));})),void 0!==t){t.style.webkitTapHighlightColor="rgba(0,0,0,0)";let e=false;try{const t={};Object.defineProperty(t,"passive",{get(){e=!0;}}),window.addEventListener("_",(()=>{}),t);}catch(t){}this.on("u",function(t,e,n){return h$1.forEach((s=>{t.addEventListener(s,e,n);})),p$1.forEach((t=>{window.addEventListener(t,e,n);})),()=>{h$1.forEach((n=>{t.removeEventListener(n,e);})),p$1.forEach((t=>{window.removeEventListener(t,e);}));}}(t,this.catchEvent.bind(this),false===this.__options.preventDefault&&e?{passive:true}:{passive:false}));}}use(t,e){this.__pluginContexts.push(t(this,e));}catchEvent(t){const e=this.__inputCreatorMap[t.type](t);if(void 0!==e){const n=()=>t.stopPropagation(),s=()=>t.stopImmediatePropagation(),o=()=>t.preventDefault();if(u$1(t,this.__options))o();else if("touchstart"===t.type?this.__isIgnoreMouse=true:"touchmove"===t.type&&(this.__isIgnoreMouse=false),this.__isIgnoreMouse&&t.type.startsWith("mouse"))return void("mouseup"===t.type&&(this.__isIgnoreMouse=false));this.emit("input",e),this.emit2(`at:${e.phase}`,e,{});const i={};this.__computeFunctionList.forEach((t=>{const n=t(e,i);if(void 0!==n)for(const t in n)i[t]=n[t];})),this.emit("computed",Object.assign(Object.assign(Object.assign({},e),i),{stopPropagation:n,stopImmediatePropagation:s,preventDefault:o}));}}compute(t,e){for(const e of t)this.__computeFunctionCreatorList.includes(e)||(this.__computeFunctionCreatorList.push(e),this.__computeFunctionList.push(e()));this.on("computed",e);}beforeEach(t){super.beforeEach(((e,n)=>{var s;(null===(s=this.c)||void 0===s?void 0:s.name)?t(e,n):n();}));}get(t){return this.__pluginContexts.find((e=>t===e.name))}set(t){this.__options=Object.assign(Object.assign({},this.__options),t);}emit2(t,e,n){this.c=n,this.emit(t,Object.assign(Object.assign({},e),{type:t}),(()=>{this.emit("at:after",Object.assign(Object.assign({},e),{name:t,__type:t}));}));}destroy(){this.emit("u"),super.destroy();}}
|
|
317
313
|
|
|
318
|
-
const
|
|
314
|
+
const p={name:"pan",threshold:10,pointLength:1};function u(u,d$1){const f$1=O(p,d$1);return u.compute([f,h$2,d],(t=>{if(g$1(f$1),j(f$1))return;const c=function(){const{pointLength:e,distance:n}=t;return f$1.pointLength===e&&f$1.threshold<=n}();if(f$1.state=b(c,f$1.state,t.phase),c||h$3(f$1.state)){const{name:e}=f$1;u.emit2(e,t,f$1),u.emit2(e+v$1(f$1.state),t,f$1),![u$3,s$1].includes(t.phase)&&t.direction&&u.emit2(e+t.direction,t,f$1);}})),f$1}
|
|
319
315
|
|
|
320
|
-
const
|
|
316
|
+
const c$1={name:"swipe",threshold:10,velocity:.3,pointLength:1};function a(a,r){const s=O(c$1,r);return a.compute([h$2,f,M],(t=>{if(s.state=0,!s.disabled&&function(){if(u$3!==t.phase)return false;const{velocityX:o,velocityY:n,distance:i,maxPointLength:c}=t;return c===s.pointLength&&0===t.points.length&&s.threshold<i&&s.velocity<Math.max(o,n)}()){const{name:e}=s;s.state=1,a.emit2(e,t,s),a.emit2(e+t.direction,t,s);}})),s}
|
|
321
317
|
|
|
322
|
-
const
|
|
318
|
+
const r$1={name:"press",pointLength:1,maxDistance:9,minPressTime:251};function c(c,u){const p=O(r$1,u);let f=0;return c.compute([h$2],(t=>{if(j(p))return;const{phase:o,startInput:r,pointLength:u}=t;if(c$3===o&&p.pointLength===u)g$1(p),clearTimeout(f),f=setTimeout((()=>{p.state=1,c.emit2(p.name,t,p);}),p.minPressTime);else if(u$3===o&&1===p.state)c.emit2(`${p.name}${r$4}`,t,p);else if(1!==p.state){const e=t.timestamp-r.timestamp;(!function(){const{distance:e}=t;return e&&p.maxDistance>e}()||p.minPressTime>e&&[u$3,s$1].includes(o))&&(clearTimeout(f),p.state=2);}})),p}
|
|
323
319
|
|
|
324
|
-
const
|
|
320
|
+
const i$2={name:"pinch",threshold:0,pointLength:2};function r(r,m){const p=O(i$2,m);return r.compute([m$1,l$1],(t=>{if(g$1(p),j(p))return;const c=function(){const{pointLength:e,scale:n,deltaScale:o,phase:a}=t;return p.pointLength===e&&p.threshold<Math.abs(n-1)}();p.state=b(c,p.state,t.phase);const{name:h}=p;if(c||h$3(p.state)){r.emit2(h,t,p);const{deltaScale:e}=t;1!==e&&r.emit2(h+(1<e?"in":"out"),t,p);}const i=v$1(p.state);i&&r.emit2(h+i,t,p);})),p}
|
|
325
321
|
|
|
326
|
-
|
|
322
|
+
const h={name:"rotate",threshold:0,pointLength:2};function i$1(i,m){const u=O(h,m);return i.compute([m$1,p$2],(t=>{if(j(u))return;g$1(u);const r=function(){const{pointLength:e,angle:n}=t;return u.pointLength===e&&u.threshold<Math.abs(n)}();u.state=b(r,u.state,t.phase);const{name:c}=u;(r||h$3(u.state))&&i.emit2(c,t,u);const h=v$1(u.state);h&&i.emit2(c+h,t,u);})),u}
|
|
327
323
|
|
|
328
|
-
class i extends l
|
|
324
|
+
class i extends l{constructor(t,u$1){super(t,u$1),this.use(r$3),this.use(u),this.use(a),this.use(c),this.use(r),this.use(i$1);}}i.STATE_POSSIBLE=0,i.STATE_START=4,i.STATE_MOVE=5,i.STATE_END=1,i.STATE_CANCELLED=3,i.STATE_FAILED=2,i.STATE_RECOGNIZED=1,i.tap=r$3,i.pan=u,i.swipe=a,i.press=c,i.rotate=i$1,i.pinch=r,i.doubletap=e;
|
|
329
325
|
|
|
330
326
|
class PopsUtils {
|
|
331
327
|
/**
|
|
@@ -434,7 +430,8 @@
|
|
|
434
430
|
if (typeof sourceValue === "object" &&
|
|
435
431
|
sourceValue != null &&
|
|
436
432
|
keyName in target &&
|
|
437
|
-
!UtilsContext.isDOM(sourceValue)
|
|
433
|
+
!UtilsContext.isDOM(sourceValue) &&
|
|
434
|
+
!(sourceValue instanceof EventEmiter)) {
|
|
438
435
|
// 源端的值是object类型,且不是元素节点
|
|
439
436
|
// 如果是数组,那此数组中有值,清空旧的数组再赋值
|
|
440
437
|
let childObjectValue;
|
|
@@ -450,7 +447,7 @@
|
|
|
450
447
|
Reflect.set(target, keyName, childObjectValue);
|
|
451
448
|
}
|
|
452
449
|
else {
|
|
453
|
-
|
|
450
|
+
// 直接赋值
|
|
454
451
|
Reflect.set(target, keyName, sourceValue);
|
|
455
452
|
}
|
|
456
453
|
}
|
|
@@ -640,33 +637,31 @@
|
|
|
640
637
|
if (typeof deviation !== "number" || Number.isNaN(deviation)) {
|
|
641
638
|
deviation = 10;
|
|
642
639
|
}
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
const
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
center,
|
|
669
|
-
];
|
|
640
|
+
/** 坐标偏移 */
|
|
641
|
+
const positionDistance = 10;
|
|
642
|
+
const defaultCalcPostion = [];
|
|
643
|
+
const maxPostionX = globalThis.innerWidth;
|
|
644
|
+
const maxPostionY = globalThis.innerHeight;
|
|
645
|
+
const gridXCount = 8;
|
|
646
|
+
const gridYCount = 8;
|
|
647
|
+
for (let i = 0; i < gridXCount; i++) {
|
|
648
|
+
for (let j = 0; j < gridYCount; j++) {
|
|
649
|
+
const positionX = globalThis.innerWidth * (i / gridXCount) + positionDistance;
|
|
650
|
+
const positionY = globalThis.innerHeight * (j / gridYCount) + positionDistance;
|
|
651
|
+
const position = {
|
|
652
|
+
x: positionX,
|
|
653
|
+
y: positionY,
|
|
654
|
+
};
|
|
655
|
+
if (position.x > maxPostionX) {
|
|
656
|
+
position.x = maxPostionX;
|
|
657
|
+
}
|
|
658
|
+
if (position.y > maxPostionY) {
|
|
659
|
+
position.y = maxPostionY;
|
|
660
|
+
}
|
|
661
|
+
defaultCalcPostion.push(position);
|
|
662
|
+
}
|
|
663
|
+
}
|
|
664
|
+
const delayHandlerElementPostionList = defaultCalcPostion;
|
|
670
665
|
if ($el) {
|
|
671
666
|
delayHandlerElementPostionList.length = 0;
|
|
672
667
|
if (Array.isArray($el)) {
|
|
@@ -678,61 +673,79 @@
|
|
|
678
673
|
}
|
|
679
674
|
const positionInfoList = delayHandlerElementPostionList
|
|
680
675
|
.map((position) => {
|
|
681
|
-
let
|
|
676
|
+
let $position;
|
|
682
677
|
let positionX;
|
|
683
678
|
let positionY;
|
|
684
679
|
if (position instanceof HTMLElement) {
|
|
685
|
-
|
|
680
|
+
$position = position;
|
|
686
681
|
const nodeRect = position.getBoundingClientRect();
|
|
687
682
|
positionX = nodeRect.x + nodeRect.width / 2;
|
|
688
683
|
positionY = nodeRect.y + nodeRect.height / 2;
|
|
689
684
|
}
|
|
690
685
|
else {
|
|
691
|
-
|
|
686
|
+
$position = document.elementFromPoint(position.x, position.y);
|
|
692
687
|
positionX = position.x;
|
|
693
688
|
positionY = position.y;
|
|
694
689
|
}
|
|
695
|
-
const shadowRoot =
|
|
690
|
+
const shadowRoot = $position?.shadowRoot;
|
|
696
691
|
if (shadowRoot) {
|
|
697
|
-
|
|
692
|
+
// 处理ShadowRoot
|
|
693
|
+
$position = shadowRoot.elementFromPoint(positionX, positionY);
|
|
698
694
|
}
|
|
699
|
-
if (
|
|
700
|
-
return;
|
|
701
|
-
if (positionNode instanceof HTMLScriptElement)
|
|
702
|
-
return;
|
|
703
|
-
if (positionNode instanceof HTMLMetaElement)
|
|
704
|
-
return;
|
|
705
|
-
if (positionNode instanceof HTMLHeadElement)
|
|
706
|
-
return;
|
|
707
|
-
if (!(positionNode instanceof HTMLElement))
|
|
695
|
+
if (!($position instanceof HTMLElement))
|
|
708
696
|
return;
|
|
709
|
-
let parent =
|
|
697
|
+
let $parent = $position;
|
|
710
698
|
let zIndex = 0;
|
|
711
|
-
let maxZIndexNode = null;
|
|
712
|
-
|
|
713
|
-
|
|
699
|
+
let $maxZIndexNode = null;
|
|
700
|
+
let rect = {
|
|
701
|
+
x: 0,
|
|
702
|
+
y: 0,
|
|
703
|
+
width: 0,
|
|
704
|
+
height: 0,
|
|
705
|
+
top: 0,
|
|
706
|
+
right: 0,
|
|
707
|
+
bottom: 0,
|
|
708
|
+
left: 0,
|
|
709
|
+
};
|
|
710
|
+
while ($parent) {
|
|
711
|
+
const nodeStyle = globalThis.getComputedStyle($parent);
|
|
714
712
|
const nodeZIndex = parseInt(nodeStyle.zIndex);
|
|
715
713
|
if (nodeStyle.position !== "static" && !isNaN(nodeZIndex)) {
|
|
716
714
|
if (nodeZIndex > zIndex) {
|
|
717
715
|
zIndex = nodeZIndex;
|
|
718
|
-
maxZIndexNode = parent;
|
|
719
|
-
}
|
|
720
|
-
}
|
|
721
|
-
parent = parent.parentElement;
|
|
716
|
+
$maxZIndexNode = $parent;
|
|
717
|
+
}
|
|
718
|
+
}
|
|
719
|
+
$parent = $parent.parentElement;
|
|
720
|
+
}
|
|
721
|
+
if ($maxZIndexNode) {
|
|
722
|
+
const maxRect = $maxZIndexNode.getBoundingClientRect();
|
|
723
|
+
rect = {
|
|
724
|
+
x: maxRect.x,
|
|
725
|
+
y: maxRect.y,
|
|
726
|
+
width: maxRect.width,
|
|
727
|
+
height: maxRect.height,
|
|
728
|
+
top: maxRect.top,
|
|
729
|
+
right: maxRect.right,
|
|
730
|
+
bottom: maxRect.bottom,
|
|
731
|
+
left: maxRect.left,
|
|
732
|
+
};
|
|
722
733
|
}
|
|
723
734
|
return {
|
|
724
|
-
/**
|
|
735
|
+
/** 计算偏移量后的z-index值 */
|
|
725
736
|
zIndex: zIndex + deviation,
|
|
726
|
-
/**
|
|
737
|
+
/** 获取到的最大的z-index值 */
|
|
727
738
|
originZIndex: zIndex,
|
|
728
739
|
/** 拥有最大z-index的元素 */
|
|
729
|
-
node: maxZIndexNode,
|
|
740
|
+
node: $maxZIndexNode,
|
|
730
741
|
/** 目标坐标元素 */
|
|
731
|
-
positionNode:
|
|
732
|
-
/** x坐标 */
|
|
742
|
+
positionNode: $position,
|
|
743
|
+
/** 目标x坐标 */
|
|
733
744
|
positionX: positionX,
|
|
734
|
-
/** y坐标 */
|
|
745
|
+
/** 目标y坐标 */
|
|
735
746
|
positionY: positionY,
|
|
747
|
+
/** node位置信息 */
|
|
748
|
+
rect,
|
|
736
749
|
};
|
|
737
750
|
})
|
|
738
751
|
.filter((it) => it != null);
|
|
@@ -783,11 +796,22 @@
|
|
|
783
796
|
const PopsCommonCSSClassName = {
|
|
784
797
|
flexCenter: "pops-flex-items-center",
|
|
785
798
|
flexYCenter: "pops-flex-y-center",
|
|
799
|
+
flexXCenter: "pops-flex-x-center",
|
|
786
800
|
hide: "pops-hide",
|
|
787
801
|
hideImportant: "pops-hide-important",
|
|
802
|
+
noBorder: "pops-no-border",
|
|
803
|
+
noBorderImportant: "pops-no-border-important",
|
|
788
804
|
userSelectNone: "pops-user-select-none",
|
|
789
|
-
|
|
805
|
+
lineHeightCenter: "pops-line-height-center",
|
|
806
|
+
widthFill: "pops-width-fill",
|
|
807
|
+
textIsDisabled: "pops-text-is-disabled",
|
|
808
|
+
textIsDisabledImportant: "pops-text-is-disabled-important",
|
|
809
|
+
};
|
|
790
810
|
|
|
811
|
+
/**
|
|
812
|
+
* 存储在元素属性上的事件名
|
|
813
|
+
*/
|
|
814
|
+
const SymbolEvents = Symbol("events_" + (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1));
|
|
791
815
|
class PopsDOMUtilsEvent {
|
|
792
816
|
on(element, eventType, selector, callback, option) {
|
|
793
817
|
/**
|
|
@@ -3132,6 +3156,134 @@
|
|
|
3132
3156
|
tooltip: [],
|
|
3133
3157
|
};
|
|
3134
3158
|
|
|
3159
|
+
const PopsInstanceUtils = {
|
|
3160
|
+
/**
|
|
3161
|
+
* 获取pops所有弹窗中的最大的z-index
|
|
3162
|
+
* @param deviation
|
|
3163
|
+
*/
|
|
3164
|
+
getPopsMaxZIndex(deviation = 1) {
|
|
3165
|
+
deviation = Number.isNaN(deviation) ? 1 : deviation;
|
|
3166
|
+
// 最大值 2147483647
|
|
3167
|
+
// const browserMaxZIndex = Math.pow(2, 31) - 1;
|
|
3168
|
+
// 比较值 2000000000
|
|
3169
|
+
const maxZIndex = 2 * Math.pow(10, 9);
|
|
3170
|
+
// 当前页面最大的z-index
|
|
3171
|
+
let zIndex = 0;
|
|
3172
|
+
// 当前的最大z-index的元素,调试使用
|
|
3173
|
+
let maxZIndexNode = null;
|
|
3174
|
+
Object.keys(PopsInstData).forEach((instKeyName) => {
|
|
3175
|
+
const instData = PopsInstData[instKeyName];
|
|
3176
|
+
for (let index = 0; index < instData.length; index++) {
|
|
3177
|
+
const inst = instData[index];
|
|
3178
|
+
// 不对position为static和display为none的元素进行获取它们的z-index
|
|
3179
|
+
const $elList = [inst.$anim, inst.$pops, inst.$mask].filter((it) => it instanceof HTMLElement);
|
|
3180
|
+
const nodeZIndexInfoList = popsUtils.getMaxZIndexNodeInfoFromPoint($elList);
|
|
3181
|
+
const maxNodeZIndexInfo = nodeZIndexInfoList[0];
|
|
3182
|
+
if (maxNodeZIndexInfo) {
|
|
3183
|
+
const nodeZIndex = maxNodeZIndexInfo.zIndex;
|
|
3184
|
+
if (nodeZIndex > zIndex) {
|
|
3185
|
+
zIndex = nodeZIndex;
|
|
3186
|
+
maxZIndexNode = maxNodeZIndexInfo.node || maxNodeZIndexInfo.positionNode;
|
|
3187
|
+
}
|
|
3188
|
+
}
|
|
3189
|
+
}
|
|
3190
|
+
});
|
|
3191
|
+
zIndex += deviation;
|
|
3192
|
+
const isOverMaxZIndex = zIndex >= maxZIndex;
|
|
3193
|
+
if (isOverMaxZIndex) {
|
|
3194
|
+
// 超出z-index最大值
|
|
3195
|
+
zIndex = maxZIndex;
|
|
3196
|
+
}
|
|
3197
|
+
return { zIndex: zIndex, animElement: maxZIndexNode, isOverMaxZIndex };
|
|
3198
|
+
},
|
|
3199
|
+
/**
|
|
3200
|
+
* 排序数组
|
|
3201
|
+
* @param getBeforeValueFun
|
|
3202
|
+
* @param getAfterValueFun
|
|
3203
|
+
* @param sortByDesc 排序是否降序,默认降序
|
|
3204
|
+
*/
|
|
3205
|
+
sortElementListByProperty(getBeforeValueFun, getAfterValueFun, sortByDesc = true) {
|
|
3206
|
+
if (typeof sortByDesc !== "boolean") {
|
|
3207
|
+
throw new TypeError("参数 sortByDesc 必须为boolean类型");
|
|
3208
|
+
}
|
|
3209
|
+
if (getBeforeValueFun == null || getAfterValueFun == null) {
|
|
3210
|
+
throw new Error("获取前面的值或后面的值的方法不能为空");
|
|
3211
|
+
}
|
|
3212
|
+
return function (after_obj, before_obj) {
|
|
3213
|
+
const beforeValue = getBeforeValueFun(before_obj); // 前
|
|
3214
|
+
const afterValue = getAfterValueFun(after_obj); // 后
|
|
3215
|
+
if (sortByDesc) {
|
|
3216
|
+
if (afterValue > beforeValue) {
|
|
3217
|
+
return -1;
|
|
3218
|
+
}
|
|
3219
|
+
else if (afterValue < beforeValue) {
|
|
3220
|
+
return 1;
|
|
3221
|
+
}
|
|
3222
|
+
else {
|
|
3223
|
+
return 0;
|
|
3224
|
+
}
|
|
3225
|
+
}
|
|
3226
|
+
else {
|
|
3227
|
+
if (afterValue < beforeValue) {
|
|
3228
|
+
return -1;
|
|
3229
|
+
}
|
|
3230
|
+
else if (afterValue > beforeValue) {
|
|
3231
|
+
return 1;
|
|
3232
|
+
}
|
|
3233
|
+
else {
|
|
3234
|
+
return 0;
|
|
3235
|
+
}
|
|
3236
|
+
}
|
|
3237
|
+
};
|
|
3238
|
+
},
|
|
3239
|
+
/**
|
|
3240
|
+
* 是否是隐藏状态
|
|
3241
|
+
*
|
|
3242
|
+
* 检测以下项:
|
|
3243
|
+
*
|
|
3244
|
+
* + `display`: none
|
|
3245
|
+
* + `visibility`: hidden
|
|
3246
|
+
* + `opacity`: 0
|
|
3247
|
+
* + `使用了pops的自定义的隐藏class类`
|
|
3248
|
+
* @param $el 需要检测的元素
|
|
3249
|
+
*/
|
|
3250
|
+
isHide($el) {
|
|
3251
|
+
let flag = false;
|
|
3252
|
+
if ($el?.classList?.contains(PopsCommonCSSClassName.hide) ||
|
|
3253
|
+
$el?.classList?.contains(PopsCommonCSSClassName.hideImportant)) {
|
|
3254
|
+
flag = true;
|
|
3255
|
+
}
|
|
3256
|
+
else {
|
|
3257
|
+
if ($el instanceof HTMLElement) {
|
|
3258
|
+
const style = $el.style;
|
|
3259
|
+
flag = style.display.includes("none") || style.visibility.includes("hidden") || style.opacity !== "0";
|
|
3260
|
+
}
|
|
3261
|
+
if (!flag) {
|
|
3262
|
+
const style = globalThis.getComputedStyle($el);
|
|
3263
|
+
flag = style.display.includes("none") || style.visibility.includes("hidden") || style.opacity !== "0";
|
|
3264
|
+
}
|
|
3265
|
+
}
|
|
3266
|
+
return flag;
|
|
3267
|
+
},
|
|
3268
|
+
/**
|
|
3269
|
+
* 判断元素是否是在`.pops`内
|
|
3270
|
+
* @param $el 目标元素
|
|
3271
|
+
*/
|
|
3272
|
+
isNodeInPopsNode($el) {
|
|
3273
|
+
return !!($el.closest(".pops") || $el.matches(".pops"));
|
|
3274
|
+
},
|
|
3275
|
+
/**
|
|
3276
|
+
* 判断是否是`.pops-anim`元素
|
|
3277
|
+
* @param $el 目标元素
|
|
3278
|
+
*/
|
|
3279
|
+
isAnimNode($el) {
|
|
3280
|
+
return !!($el?.localName?.toLowerCase() === "div" &&
|
|
3281
|
+
$el.className &&
|
|
3282
|
+
$el.className === "pops-anim" &&
|
|
3283
|
+
$el.hasAttribute("anim"));
|
|
3284
|
+
},
|
|
3285
|
+
};
|
|
3286
|
+
|
|
3135
3287
|
const PopsInstHandler = {
|
|
3136
3288
|
/**
|
|
3137
3289
|
* 删除配置中对应的对象
|
|
@@ -3194,7 +3346,7 @@
|
|
|
3194
3346
|
return totalInstConfigList;
|
|
3195
3347
|
},
|
|
3196
3348
|
/**
|
|
3197
|
-
*
|
|
3349
|
+
* 显示
|
|
3198
3350
|
* @param popsType
|
|
3199
3351
|
* @param instConfigList
|
|
3200
3352
|
* @param guid
|
|
@@ -3202,24 +3354,34 @@
|
|
|
3202
3354
|
* @param $anim
|
|
3203
3355
|
* @param $mask
|
|
3204
3356
|
*/
|
|
3205
|
-
|
|
3357
|
+
show(config, popsType, instConfigList, guid, $anim, $mask) {
|
|
3206
3358
|
// oxlint-disable-next-line no-async-promise-executor
|
|
3207
3359
|
return new Promise(async (resolve) => {
|
|
3208
3360
|
const $pops = $anim.querySelector(".pops[type-value]");
|
|
3209
3361
|
const fintInst = instConfigList.find((instConfigItem) => instConfigItem.guid === guid);
|
|
3210
3362
|
if (fintInst) {
|
|
3211
|
-
//
|
|
3363
|
+
// 由于是隐蔽状态
|
|
3364
|
+
// 先设置好动画状态
|
|
3365
|
+
// 再显示,会自执行动画
|
|
3366
|
+
const checkVisible = () => {
|
|
3367
|
+
if (!PopsInstanceUtils.isHide($anim)) {
|
|
3368
|
+
return true;
|
|
3369
|
+
}
|
|
3370
|
+
else {
|
|
3371
|
+
return false;
|
|
3372
|
+
}
|
|
3373
|
+
};
|
|
3212
3374
|
const startAnim = async () => {
|
|
3213
3375
|
if (popsType === "drawer") {
|
|
3214
3376
|
// drawer是抽屉
|
|
3215
3377
|
// 单独处理动画
|
|
3216
3378
|
const drawerConfig = config;
|
|
3217
|
-
await popsUtils.sleep(drawerConfig.
|
|
3379
|
+
await popsUtils.sleep(drawerConfig.openDelay ?? 0);
|
|
3218
3380
|
if ($mask) {
|
|
3219
|
-
popsDOMUtils.css($mask, "display", "
|
|
3381
|
+
popsDOMUtils.css($mask, "display", "");
|
|
3220
3382
|
}
|
|
3221
3383
|
const direction = drawerConfig.direction;
|
|
3222
|
-
const size =
|
|
3384
|
+
const size = drawerConfig.size.toString();
|
|
3223
3385
|
if (["top", "bottom"].includes(direction)) {
|
|
3224
3386
|
$pops.style.setProperty("height", size);
|
|
3225
3387
|
}
|
|
@@ -3227,26 +3389,26 @@
|
|
|
3227
3389
|
$pops.style.setProperty("width", size);
|
|
3228
3390
|
}
|
|
3229
3391
|
else {
|
|
3230
|
-
console.error("未知direction
|
|
3392
|
+
console.error("未知direction:", direction);
|
|
3231
3393
|
}
|
|
3232
3394
|
}
|
|
3233
3395
|
else {
|
|
3234
|
-
instConfigItem.$anim.style.width = "
|
|
3235
|
-
instConfigItem.$anim.style.height = "
|
|
3236
|
-
Reflect.set(instConfigItem.$anim.style, "animation-name",
|
|
3396
|
+
instConfigItem.$anim.style.width = "";
|
|
3397
|
+
instConfigItem.$anim.style.height = "";
|
|
3398
|
+
Reflect.set(instConfigItem.$anim.style, "animation-name", animName);
|
|
3237
3399
|
}
|
|
3238
|
-
|
|
3239
|
-
const endCallback = () => {
|
|
3240
|
-
instConfigItem.$anim.style.display = "none";
|
|
3400
|
+
instConfigItem.$anim.style.display = "";
|
|
3241
3401
|
if (instConfigItem.$mask) {
|
|
3242
|
-
instConfigItem.$mask.style.display = "
|
|
3402
|
+
instConfigItem.$mask.style.display = "";
|
|
3243
3403
|
}
|
|
3244
|
-
|
|
3404
|
+
};
|
|
3405
|
+
const endCallback = () => {
|
|
3406
|
+
fintInst.emitter.emit("pops:show", instConfigItem);
|
|
3245
3407
|
};
|
|
3246
3408
|
const instConfigItem = fintInst;
|
|
3247
|
-
|
|
3248
|
-
|
|
3249
|
-
if (PopsAnimation.hasAnim(
|
|
3409
|
+
const animName = instConfigItem.$anim.getAttribute("anim").replace("-reverse", "");
|
|
3410
|
+
fintInst.emitter.emit("pops:before-show", instConfigItem);
|
|
3411
|
+
if (checkVisible() && PopsAnimation.hasAnim(animName)) {
|
|
3250
3412
|
/**
|
|
3251
3413
|
* 动画结束的回调
|
|
3252
3414
|
*/
|
|
@@ -3257,22 +3419,23 @@
|
|
|
3257
3419
|
};
|
|
3258
3420
|
const listener = popsDOMUtils.on(instConfigItem.$anim, popsDOMUtils.getAnimationEndNameList(), animationendCallBack, {
|
|
3259
3421
|
capture: true,
|
|
3260
|
-
once: true,
|
|
3261
3422
|
});
|
|
3423
|
+
await startAnim();
|
|
3262
3424
|
}
|
|
3263
3425
|
else {
|
|
3426
|
+
await startAnim();
|
|
3264
3427
|
endCallback();
|
|
3265
3428
|
resolve();
|
|
3266
3429
|
}
|
|
3267
3430
|
}
|
|
3268
3431
|
else {
|
|
3269
|
-
console.error("
|
|
3432
|
+
console.error("show-error: 该实例未存储");
|
|
3270
3433
|
resolve();
|
|
3271
3434
|
}
|
|
3272
3435
|
});
|
|
3273
3436
|
},
|
|
3274
3437
|
/**
|
|
3275
|
-
*
|
|
3438
|
+
* 隐藏
|
|
3276
3439
|
* @param popsType
|
|
3277
3440
|
* @param instConfigList
|
|
3278
3441
|
* @param guid
|
|
@@ -3280,23 +3443,35 @@
|
|
|
3280
3443
|
* @param $anim
|
|
3281
3444
|
* @param $mask
|
|
3282
3445
|
*/
|
|
3283
|
-
|
|
3446
|
+
hide(config, popsType, instConfigList, guid, $anim, $mask) {
|
|
3284
3447
|
// oxlint-disable-next-line no-async-promise-executor
|
|
3285
3448
|
return new Promise(async (resolve) => {
|
|
3286
3449
|
const $pops = $anim.querySelector(".pops[type-value]");
|
|
3287
3450
|
const fintInst = instConfigList.find((instConfigItem) => instConfigItem.guid === guid);
|
|
3288
3451
|
if (fintInst) {
|
|
3452
|
+
// 由于是已显示状态
|
|
3453
|
+
// 先执行动画
|
|
3454
|
+
// 再隐藏
|
|
3455
|
+
// 存在实例
|
|
3456
|
+
const checkVisible = () => {
|
|
3457
|
+
if (!PopsInstanceUtils.isHide($anim)) {
|
|
3458
|
+
return true;
|
|
3459
|
+
}
|
|
3460
|
+
else {
|
|
3461
|
+
return false;
|
|
3462
|
+
}
|
|
3463
|
+
};
|
|
3289
3464
|
const startAnim = async () => {
|
|
3290
3465
|
if (popsType === "drawer") {
|
|
3291
3466
|
// drawer是抽屉
|
|
3292
3467
|
// 单独处理动画
|
|
3293
3468
|
const drawerConfig = config;
|
|
3294
|
-
await popsUtils.sleep(drawerConfig.
|
|
3469
|
+
await popsUtils.sleep(drawerConfig.closeDelay ?? 0);
|
|
3295
3470
|
if ($mask) {
|
|
3296
|
-
popsDOMUtils.css($mask, "display", "");
|
|
3471
|
+
popsDOMUtils.css($mask, "display", "none");
|
|
3297
3472
|
}
|
|
3298
3473
|
const direction = drawerConfig.direction;
|
|
3299
|
-
const size =
|
|
3474
|
+
const size = "0";
|
|
3300
3475
|
if (["top", "bottom"].includes(direction)) {
|
|
3301
3476
|
$pops.style.setProperty("height", size);
|
|
3302
3477
|
}
|
|
@@ -3304,26 +3479,27 @@
|
|
|
3304
3479
|
$pops.style.setProperty("width", size);
|
|
3305
3480
|
}
|
|
3306
3481
|
else {
|
|
3307
|
-
console.error("未知direction
|
|
3482
|
+
console.error("未知direction: ", direction);
|
|
3308
3483
|
}
|
|
3309
3484
|
}
|
|
3310
3485
|
else {
|
|
3311
|
-
instConfigItem.$anim.style.width = "";
|
|
3312
|
-
instConfigItem.$anim.style.height = "";
|
|
3313
|
-
Reflect.set(instConfigItem.$anim.style, "animation-name",
|
|
3486
|
+
instConfigItem.$anim.style.width = "100%";
|
|
3487
|
+
instConfigItem.$anim.style.height = "100%";
|
|
3488
|
+
Reflect.set(instConfigItem.$anim.style, "animation-name", reverseAnimName);
|
|
3314
3489
|
}
|
|
3315
3490
|
};
|
|
3316
3491
|
const endCallback = () => {
|
|
3317
|
-
instConfigItem.$anim.style.display = "";
|
|
3492
|
+
instConfigItem.$anim.style.display = "none";
|
|
3318
3493
|
if (instConfigItem.$mask) {
|
|
3319
|
-
instConfigItem.$mask.style.display = "";
|
|
3494
|
+
instConfigItem.$mask.style.display = "none";
|
|
3320
3495
|
}
|
|
3321
|
-
fintInst.emitter.emit("pops:
|
|
3496
|
+
fintInst.emitter.emit("pops:hide", instConfigItem);
|
|
3322
3497
|
};
|
|
3323
3498
|
const instConfigItem = fintInst;
|
|
3324
|
-
|
|
3325
|
-
|
|
3326
|
-
|
|
3499
|
+
const animName = instConfigItem.$anim.getAttribute("anim").replace("-reverse", "");
|
|
3500
|
+
const reverseAnimName = animName + "-reverse";
|
|
3501
|
+
fintInst.emitter.emit("pops:before-hide", instConfigItem);
|
|
3502
|
+
if (!checkVisible() && PopsAnimation.hasAnim(reverseAnimName)) {
|
|
3327
3503
|
/**
|
|
3328
3504
|
* 动画结束的回调
|
|
3329
3505
|
*/
|
|
@@ -3334,15 +3510,18 @@
|
|
|
3334
3510
|
};
|
|
3335
3511
|
const listener = popsDOMUtils.on(instConfigItem.$anim, popsDOMUtils.getAnimationEndNameList(), animationendCallBack, {
|
|
3336
3512
|
capture: true,
|
|
3513
|
+
once: true,
|
|
3337
3514
|
});
|
|
3515
|
+
await startAnim();
|
|
3338
3516
|
}
|
|
3339
3517
|
else {
|
|
3518
|
+
await startAnim();
|
|
3340
3519
|
endCallback();
|
|
3341
3520
|
resolve();
|
|
3342
3521
|
}
|
|
3343
3522
|
}
|
|
3344
3523
|
else {
|
|
3345
|
-
console.error("
|
|
3524
|
+
console.error("hide-error: 该实例未存储");
|
|
3346
3525
|
resolve();
|
|
3347
3526
|
}
|
|
3348
3527
|
});
|
|
@@ -3382,7 +3561,7 @@
|
|
|
3382
3561
|
await new Promise(async (resolve) => {
|
|
3383
3562
|
const $pops = $anim.querySelector(".pops[type-value]");
|
|
3384
3563
|
const drawerConfig = config;
|
|
3385
|
-
const
|
|
3564
|
+
const startAnim = () => {
|
|
3386
3565
|
/**
|
|
3387
3566
|
* 弹窗已关闭的回调
|
|
3388
3567
|
*/
|
|
@@ -3423,7 +3602,7 @@
|
|
|
3423
3602
|
};
|
|
3424
3603
|
if (popsType === "drawer") {
|
|
3425
3604
|
await popsUtils.sleep(drawerConfig.closeDelay ?? 0);
|
|
3426
|
-
|
|
3605
|
+
startAnim();
|
|
3427
3606
|
}
|
|
3428
3607
|
else {
|
|
3429
3608
|
await PopsInstHandler.removeInstance([instConfigList], guid);
|
|
@@ -3703,11 +3882,11 @@
|
|
|
3703
3882
|
* 点击其它区域的事件
|
|
3704
3883
|
* @param event
|
|
3705
3884
|
*/
|
|
3706
|
-
|
|
3885
|
+
const clickEvent = (event) => {
|
|
3707
3886
|
popsDOMUtils.preventEvent(event);
|
|
3708
3887
|
// 获取该类型实例存储列表
|
|
3709
3888
|
const targetInst = PopsInstData[config.type];
|
|
3710
|
-
|
|
3889
|
+
const continueExec = () => {
|
|
3711
3890
|
if (config.config.mask.clickEvent.toClose) {
|
|
3712
3891
|
// 关闭
|
|
3713
3892
|
return PopsInstHandler.close(config.config, config.type, targetInst, config.guid, config.animElement);
|
|
@@ -3716,37 +3895,26 @@
|
|
|
3716
3895
|
// 隐藏
|
|
3717
3896
|
return PopsInstHandler.hide(config.config, config.type, targetInst, config.guid, config.animElement, result.maskElement);
|
|
3718
3897
|
}
|
|
3719
|
-
}
|
|
3898
|
+
};
|
|
3720
3899
|
if (typeof config.config.mask.clickCallBack === "function") {
|
|
3721
|
-
config.config.mask.clickCallBack(
|
|
3900
|
+
config.config.mask.clickCallBack(continueExec, config.config);
|
|
3722
3901
|
}
|
|
3723
3902
|
else {
|
|
3724
|
-
|
|
3903
|
+
continueExec();
|
|
3725
3904
|
}
|
|
3726
3905
|
return false;
|
|
3727
|
-
}
|
|
3906
|
+
};
|
|
3728
3907
|
// 判断是否启用了遮罩层点击动作
|
|
3729
3908
|
if (config.config.mask.clickEvent.toClose || config.config.mask.clickEvent.toHide) {
|
|
3730
|
-
/**
|
|
3731
|
-
* 判断点击的元素是否是动画层的元素
|
|
3732
|
-
* @param element
|
|
3733
|
-
* @returns
|
|
3734
|
-
*/
|
|
3735
|
-
function isAnimElement(element) {
|
|
3736
|
-
return Boolean(element?.localName?.toLowerCase() === "div" &&
|
|
3737
|
-
element.className &&
|
|
3738
|
-
element.className === "pops-anim" &&
|
|
3739
|
-
element.hasAttribute("anim"));
|
|
3740
|
-
}
|
|
3741
3909
|
// 判断按下的元素是否是pops-anim
|
|
3742
3910
|
popsDOMUtils.on(config.animElement, "pointerup", (event) => {
|
|
3743
3911
|
const $click = event.composedPath()[0];
|
|
3744
|
-
isMaskClick =
|
|
3912
|
+
isMaskClick = PopsInstanceUtils.isAnimNode($click);
|
|
3745
3913
|
});
|
|
3746
3914
|
// 如果有动画层,在动画层上监听点击事件
|
|
3747
3915
|
popsDOMUtils.on(config.animElement, "click", (event) => {
|
|
3748
3916
|
const $click = event.composedPath()[0];
|
|
3749
|
-
if (isMaskClick &&
|
|
3917
|
+
if (isMaskClick && PopsInstanceUtils.isAnimNode($click)) {
|
|
3750
3918
|
return clickEvent(event);
|
|
3751
3919
|
}
|
|
3752
3920
|
});
|
|
@@ -4174,8 +4342,8 @@
|
|
|
4174
4342
|
style: null,
|
|
4175
4343
|
lightStyle: null,
|
|
4176
4344
|
darkStyle: null,
|
|
4177
|
-
beforeAppendToPageCallBack() { },
|
|
4178
4345
|
stopKeyDownEventPropagation: true,
|
|
4346
|
+
emitter: null,
|
|
4179
4347
|
};
|
|
4180
4348
|
};
|
|
4181
4349
|
|
|
@@ -4184,11 +4352,11 @@
|
|
|
4184
4352
|
const guid = popsUtils.getRandomGUID();
|
|
4185
4353
|
// 设置当前类型
|
|
4186
4354
|
const popsType = "alert";
|
|
4187
|
-
const emitter = new EventEmiter(popsType);
|
|
4188
4355
|
let config = PopsAlertDefaultConfig();
|
|
4189
4356
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4190
4357
|
config = popsUtils.assign(config, __config__);
|
|
4191
4358
|
config = PopsHandler.handleOnly(popsType, config);
|
|
4359
|
+
const emitter = config.emitter ?? new EventEmiter(popsType);
|
|
4192
4360
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
4193
4361
|
PopsHandler.handleInit($shadowRoot, [
|
|
4194
4362
|
{
|
|
@@ -4382,8 +4550,8 @@
|
|
|
4382
4550
|
style: null,
|
|
4383
4551
|
lightStyle: null,
|
|
4384
4552
|
darkStyle: null,
|
|
4385
|
-
beforeAppendToPageCallBack() { },
|
|
4386
4553
|
stopKeyDownEventPropagation: true,
|
|
4554
|
+
emitter: null,
|
|
4387
4555
|
};
|
|
4388
4556
|
};
|
|
4389
4557
|
|
|
@@ -4392,11 +4560,11 @@
|
|
|
4392
4560
|
const guid = popsUtils.getRandomGUID();
|
|
4393
4561
|
// 设置当前类型
|
|
4394
4562
|
const popsType = "confirm";
|
|
4395
|
-
const emitter = new EventEmiter(popsType);
|
|
4396
4563
|
let config = PopsConfirmDefaultConfig();
|
|
4397
4564
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4398
4565
|
config = popsUtils.assign(config, __config__);
|
|
4399
4566
|
config = PopsHandler.handleOnly(popsType, config);
|
|
4567
|
+
const emitter = config.emitter ?? new EventEmiter(popsType);
|
|
4400
4568
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
4401
4569
|
PopsHandler.handleInit($shadowRoot, [
|
|
4402
4570
|
{
|
|
@@ -4589,9 +4757,9 @@
|
|
|
4589
4757
|
style: null,
|
|
4590
4758
|
lightStyle: null,
|
|
4591
4759
|
darkStyle: null,
|
|
4592
|
-
beforeAppendToPageCallBack() { },
|
|
4593
4760
|
forbiddenScroll: false,
|
|
4594
4761
|
stopKeyDownEventPropagation: true,
|
|
4762
|
+
emitter: null,
|
|
4595
4763
|
};
|
|
4596
4764
|
};
|
|
4597
4765
|
|
|
@@ -4600,11 +4768,11 @@
|
|
|
4600
4768
|
const guid = popsUtils.getRandomGUID();
|
|
4601
4769
|
// 设置当前类型
|
|
4602
4770
|
const popsType = "drawer";
|
|
4603
|
-
const emitter = new EventEmiter(popsType);
|
|
4604
4771
|
let config = PopsDrawerDefaultConfig();
|
|
4605
4772
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4606
4773
|
config = popsUtils.assign(config, __config__);
|
|
4607
4774
|
config = PopsHandler.handleOnly(popsType, config);
|
|
4775
|
+
const emitter = config.emitter ?? new EventEmiter(popsType);
|
|
4608
4776
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
4609
4777
|
PopsHandler.handleInit($shadowRoot, [
|
|
4610
4778
|
{
|
|
@@ -4815,6 +4983,7 @@
|
|
|
4815
4983
|
darkStyle: null,
|
|
4816
4984
|
addIndexCSS: true,
|
|
4817
4985
|
stopKeyDownEventPropagation: true,
|
|
4986
|
+
emitter: null,
|
|
4818
4987
|
};
|
|
4819
4988
|
};
|
|
4820
4989
|
|
|
@@ -4822,19 +4991,19 @@
|
|
|
4822
4991
|
init(__config__) {
|
|
4823
4992
|
const guid = popsUtils.getRandomGUID();
|
|
4824
4993
|
// 设置当前类型
|
|
4825
|
-
const
|
|
4826
|
-
const emitter = new EventEmiter(PopsType);
|
|
4994
|
+
const popsType = "loading";
|
|
4827
4995
|
let config = PopsLoadingDefaultConfig();
|
|
4828
4996
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
4829
4997
|
config = popsUtils.assign(config, __config__);
|
|
4830
|
-
config = PopsHandler.handleOnly(
|
|
4998
|
+
config = PopsHandler.handleOnly(popsType, config);
|
|
4999
|
+
const emitter = config.emitter ?? new EventEmiter(popsType);
|
|
4831
5000
|
// 先把z-index提取出来
|
|
4832
5001
|
const zIndex = PopsHandler.getTargerOrFunctionValue(config.zIndex);
|
|
4833
5002
|
const maskHTML = PopsElementHandler.createMask(guid, zIndex);
|
|
4834
5003
|
const { contentPStyle } = PopsElementHandler.createContentStyle("loading", config);
|
|
4835
|
-
const animHTML = PopsElementHandler.createAnim(guid,
|
|
5004
|
+
const animHTML = PopsElementHandler.createAnim(guid, popsType, config,
|
|
4836
5005
|
/*html*/ `
|
|
4837
|
-
<div class="pops-content pops-${
|
|
5006
|
+
<div class="pops-content pops-${popsType}-content">${config.addIndexCSS
|
|
4838
5007
|
? /*html*/ `
|
|
4839
5008
|
<style data-model-name="index">${PopsCSS.index}</style>
|
|
4840
5009
|
<style data-model-name="anim">${PopsCSS.anim}</style>
|
|
@@ -4845,13 +5014,13 @@
|
|
|
4845
5014
|
${PopsCSS.loadingCSS}
|
|
4846
5015
|
</style>
|
|
4847
5016
|
${config.style != null ? `<style>${config.style}</style>` : ""}
|
|
4848
|
-
<p pops class="pops-${
|
|
5017
|
+
<p pops class="pops-${popsType}-content-text" style="${contentPStyle}">${config.content.text}</p>
|
|
4849
5018
|
</div>`, "", zIndex);
|
|
4850
5019
|
/**
|
|
4851
5020
|
* 弹窗的主元素,包括动画层
|
|
4852
5021
|
*/
|
|
4853
5022
|
const $anim = PopsElementHandler.parseElement(animHTML);
|
|
4854
|
-
const { $pops: $pops } = PopsHandler.handleQueryElement($anim,
|
|
5023
|
+
const { $pops: $pops } = PopsHandler.handleQueryElement($anim, popsType);
|
|
4855
5024
|
/**
|
|
4856
5025
|
* 遮罩层元素
|
|
4857
5026
|
*/
|
|
@@ -4863,7 +5032,7 @@
|
|
|
4863
5032
|
if (config.mask.enable) {
|
|
4864
5033
|
// 创建遮罩层
|
|
4865
5034
|
const handleMask = PopsHandler.handleMask({
|
|
4866
|
-
type:
|
|
5035
|
+
type: popsType,
|
|
4867
5036
|
guid: guid,
|
|
4868
5037
|
config: config,
|
|
4869
5038
|
animElement: $anim,
|
|
@@ -4872,12 +5041,12 @@
|
|
|
4872
5041
|
$mask = handleMask.maskElement;
|
|
4873
5042
|
$elList.push($mask);
|
|
4874
5043
|
}
|
|
4875
|
-
const evtConfig = PopsHandler.handleLoadingEventConfig(config, guid,
|
|
5044
|
+
const evtConfig = PopsHandler.handleLoadingEventConfig(config, guid, popsType, $anim, $pops, emitter, $mask);
|
|
4876
5045
|
popsDOMUtils.append(config.$parent, $elList);
|
|
4877
5046
|
if ($mask != null) {
|
|
4878
5047
|
$anim.after($mask);
|
|
4879
5048
|
}
|
|
4880
|
-
PopsHandler.handlePush(
|
|
5049
|
+
PopsHandler.handlePush(popsType, {
|
|
4881
5050
|
$shadowContainer: $pops,
|
|
4882
5051
|
$shadowRoot: $pops,
|
|
4883
5052
|
guid: guid,
|
|
@@ -5046,8 +5215,8 @@
|
|
|
5046
5215
|
style: null,
|
|
5047
5216
|
lightStyle: null,
|
|
5048
5217
|
darkStyle: null,
|
|
5049
|
-
beforeAppendToPageCallBack() { },
|
|
5050
5218
|
stopKeyDownEventPropagation: true,
|
|
5219
|
+
emitter: null,
|
|
5051
5220
|
};
|
|
5052
5221
|
};
|
|
5053
5222
|
|
|
@@ -5084,11 +5253,11 @@
|
|
|
5084
5253
|
const guid = popsUtils.getRandomGUID();
|
|
5085
5254
|
// 设置当前类型
|
|
5086
5255
|
const popsType = "folder";
|
|
5087
|
-
const emitter = new EventEmiter(popsType);
|
|
5088
5256
|
let config = PopsFolderDefaultConfig();
|
|
5089
5257
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
5090
5258
|
config = popsUtils.assign(config, __config__);
|
|
5091
5259
|
config = PopsHandler.handleOnly(popsType, config);
|
|
5260
|
+
const emitter = config.emitter ?? new EventEmiter(popsType);
|
|
5092
5261
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
5093
5262
|
PopsHandler.handleInit($shadowRoot, [
|
|
5094
5263
|
{
|
|
@@ -6011,8 +6180,8 @@
|
|
|
6011
6180
|
style: null,
|
|
6012
6181
|
lightStyle: null,
|
|
6013
6182
|
darkStyle: null,
|
|
6014
|
-
beforeAppendToPageCallBack() { },
|
|
6015
6183
|
stopKeyDownEventPropagation: true,
|
|
6184
|
+
emitter: null,
|
|
6016
6185
|
};
|
|
6017
6186
|
};
|
|
6018
6187
|
|
|
@@ -6021,7 +6190,6 @@
|
|
|
6021
6190
|
const guid = popsUtils.getRandomGUID();
|
|
6022
6191
|
// 设置当前类型
|
|
6023
6192
|
const popsType = "iframe";
|
|
6024
|
-
const emitter = new EventEmiter(popsType);
|
|
6025
6193
|
let config = PopsIframeDefaultConfig();
|
|
6026
6194
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
6027
6195
|
config = popsUtils.assign(config, __config__);
|
|
@@ -6029,6 +6197,8 @@
|
|
|
6029
6197
|
throw new TypeError("config.url must not be null.");
|
|
6030
6198
|
}
|
|
6031
6199
|
config = PopsHandler.handleOnly(popsType, config);
|
|
6200
|
+
const emitter = config.emitter ??
|
|
6201
|
+
new EventEmiter(popsType);
|
|
6032
6202
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
6033
6203
|
PopsHandler.handleInit($shadowRoot, [
|
|
6034
6204
|
{
|
|
@@ -6056,7 +6226,7 @@
|
|
|
6056
6226
|
css: PopsCSS.iframeCSS,
|
|
6057
6227
|
},
|
|
6058
6228
|
]);
|
|
6059
|
-
const maskExtraStyle = config.animation != null && config.animation != "" ? "position:absolute;" : "";
|
|
6229
|
+
const maskExtraStyle = config.animation != null && config.animation != "" && config.animation ? "position:absolute;" : "";
|
|
6060
6230
|
// 先把z-index提取出来
|
|
6061
6231
|
const zIndex = PopsHandler.getTargerOrFunctionValue(config.zIndex);
|
|
6062
6232
|
const maskHTML = PopsElementHandler.createMask(guid, zIndex, maskExtraStyle);
|
|
@@ -7137,9 +7307,9 @@
|
|
|
7137
7307
|
style: null,
|
|
7138
7308
|
lightStyle: null,
|
|
7139
7309
|
darkStyle: null,
|
|
7140
|
-
beforeAppendToPageCallBack() { },
|
|
7141
7310
|
stopKeyDownEventPropagation: true,
|
|
7142
7311
|
listenEscapeKeyUpToExitDeepMenu: true,
|
|
7312
|
+
emitter: null,
|
|
7143
7313
|
};
|
|
7144
7314
|
};
|
|
7145
7315
|
|
|
@@ -7251,7 +7421,7 @@
|
|
|
7251
7421
|
style: "",
|
|
7252
7422
|
lightStyle: null,
|
|
7253
7423
|
darkStyle: null,
|
|
7254
|
-
|
|
7424
|
+
emitter: null,
|
|
7255
7425
|
};
|
|
7256
7426
|
};
|
|
7257
7427
|
|
|
@@ -7719,7 +7889,6 @@
|
|
|
7719
7889
|
const guid = popsUtils.getRandomGUID();
|
|
7720
7890
|
// 设置当前类型
|
|
7721
7891
|
const popsType = "tooltip";
|
|
7722
|
-
const emitter = new EventEmiter(popsType);
|
|
7723
7892
|
let config = PopsTooltipDefaultConfig();
|
|
7724
7893
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
7725
7894
|
config = popsUtils.assign(config, __config__);
|
|
@@ -7736,6 +7905,7 @@
|
|
|
7736
7905
|
config.onShowEventName += ` ${it}`;
|
|
7737
7906
|
});
|
|
7738
7907
|
}
|
|
7908
|
+
const emitter = config.emitter ?? new EventEmiter(popsType);
|
|
7739
7909
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
7740
7910
|
PopsHandler.handleInit($shadowRoot, [
|
|
7741
7911
|
{
|
|
@@ -9650,12 +9820,12 @@
|
|
|
9650
9820
|
},
|
|
9651
9821
|
mask: {
|
|
9652
9822
|
enable: true,
|
|
9653
|
-
clickCallBack(
|
|
9823
|
+
clickCallBack(continueExec) {
|
|
9654
9824
|
const ret = dialogCloseCallback();
|
|
9655
9825
|
if (typeof ret === "boolean" && !ret) {
|
|
9656
9826
|
return;
|
|
9657
9827
|
}
|
|
9658
|
-
|
|
9828
|
+
continueExec();
|
|
9659
9829
|
},
|
|
9660
9830
|
clickEvent: {
|
|
9661
9831
|
toClose: true,
|
|
@@ -10867,8 +11037,8 @@
|
|
|
10867
11037
|
},
|
|
10868
11038
|
mask: {
|
|
10869
11039
|
enable: true,
|
|
10870
|
-
clickCallBack(
|
|
10871
|
-
|
|
11040
|
+
clickCallBack(continueExec) {
|
|
11041
|
+
continueExec();
|
|
10872
11042
|
dialogCloseCallback();
|
|
10873
11043
|
},
|
|
10874
11044
|
clickEvent: {
|
|
@@ -11601,11 +11771,11 @@
|
|
|
11601
11771
|
const guid = popsUtils.getRandomGUID();
|
|
11602
11772
|
// 设置当前类型
|
|
11603
11773
|
const popsType = "panel";
|
|
11604
|
-
const emitter = new EventEmiter(popsType);
|
|
11605
11774
|
let config = PopsPanelDefaultConfig();
|
|
11606
11775
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
11607
11776
|
config = popsUtils.assign(config, __config__);
|
|
11608
11777
|
config = PopsHandler.handleOnly(popsType, config);
|
|
11778
|
+
const emitter = config.emitter ?? new EventEmiter(popsType);
|
|
11609
11779
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
11610
11780
|
PopsHandler.handleInit($shadowRoot, [
|
|
11611
11781
|
{
|
|
@@ -11855,8 +12025,8 @@
|
|
|
11855
12025
|
style: null,
|
|
11856
12026
|
lightStyle: null,
|
|
11857
12027
|
darkStyle: null,
|
|
11858
|
-
beforeAppendToPageCallBack() { },
|
|
11859
12028
|
stopKeyDownEventPropagation: true,
|
|
12029
|
+
emitter: null,
|
|
11860
12030
|
};
|
|
11861
12031
|
};
|
|
11862
12032
|
|
|
@@ -11865,11 +12035,11 @@
|
|
|
11865
12035
|
const guid = popsUtils.getRandomGUID();
|
|
11866
12036
|
// 设置当前类型
|
|
11867
12037
|
const popsType = "prompt";
|
|
11868
|
-
const emitter = new EventEmiter(popsType);
|
|
11869
12038
|
let config = PopsPromptDefaultConfig();
|
|
11870
12039
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
11871
12040
|
config = popsUtils.assign(config, __config__);
|
|
11872
12041
|
config = PopsHandler.handleOnly(popsType, config);
|
|
12042
|
+
const emitter = config.emitter ?? new EventEmiter(popsType);
|
|
11873
12043
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
11874
12044
|
PopsHandler.handleInit($shadowRoot, [
|
|
11875
12045
|
{
|
|
@@ -12090,10 +12260,10 @@
|
|
|
12090
12260
|
style: null,
|
|
12091
12261
|
lightStyle: null,
|
|
12092
12262
|
darkStyle: null,
|
|
12093
|
-
beforeAppendToPageCallBack() { },
|
|
12094
12263
|
limitPositionXInView: true,
|
|
12095
12264
|
limitPositionYInView: true,
|
|
12096
12265
|
beforeShowCallBack() { },
|
|
12266
|
+
emitter: null,
|
|
12097
12267
|
};
|
|
12098
12268
|
};
|
|
12099
12269
|
|
|
@@ -12102,11 +12272,11 @@
|
|
|
12102
12272
|
const guid = popsUtils.getRandomGUID();
|
|
12103
12273
|
// 设置当前类型
|
|
12104
12274
|
const popsType = "rightClickMenu";
|
|
12105
|
-
const emitter = new EventEmiter(popsType);
|
|
12106
12275
|
let config = PopsRightClickMenuDefaultConfig();
|
|
12107
12276
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
12108
12277
|
config = popsUtils.assign(config, __config__);
|
|
12109
12278
|
config = PopsHandler.handleOnly(popsType, config);
|
|
12279
|
+
const emitter = config.emitter ?? new EventEmiter(popsType);
|
|
12110
12280
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
12111
12281
|
PopsHandler.handleInit($shadowRoot, [
|
|
12112
12282
|
{
|
|
@@ -12728,6 +12898,7 @@
|
|
|
12728
12898
|
style: "",
|
|
12729
12899
|
lightStyle: null,
|
|
12730
12900
|
darkStyle: null,
|
|
12901
|
+
emitter: null,
|
|
12731
12902
|
};
|
|
12732
12903
|
};
|
|
12733
12904
|
|
|
@@ -12736,7 +12907,6 @@
|
|
|
12736
12907
|
const guid = popsUtils.getRandomGUID();
|
|
12737
12908
|
// 设置当前类型
|
|
12738
12909
|
const popsType = "searchSuggestion";
|
|
12739
|
-
const emitter = new EventEmiter(popsType);
|
|
12740
12910
|
let config = PopsSearchSuggestionDefaultConfig();
|
|
12741
12911
|
config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
|
|
12742
12912
|
config = popsUtils.assign(config, __config__);
|
|
@@ -12744,6 +12914,7 @@
|
|
|
12744
12914
|
if (config.$inputTarget == null) {
|
|
12745
12915
|
config.$inputTarget = config.$target;
|
|
12746
12916
|
}
|
|
12917
|
+
const emitter = config.emitter ?? new EventEmiter(popsType);
|
|
12747
12918
|
const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
|
|
12748
12919
|
PopsHandler.handleInit($shadowRoot, [
|
|
12749
12920
|
{
|
|
@@ -13512,93 +13683,12 @@
|
|
|
13512
13683
|
},
|
|
13513
13684
|
};
|
|
13514
13685
|
|
|
13515
|
-
const PopsInstanceUtils = {
|
|
13516
|
-
/**
|
|
13517
|
-
* 获取pops所有弹窗中的最大的z-index
|
|
13518
|
-
* @param deviation
|
|
13519
|
-
*/
|
|
13520
|
-
getPopsMaxZIndex(deviation = 1) {
|
|
13521
|
-
deviation = Number.isNaN(deviation) ? 1 : deviation;
|
|
13522
|
-
// 最大值 2147483647
|
|
13523
|
-
// const browserMaxZIndex = Math.pow(2, 31) - 1;
|
|
13524
|
-
// 比较值 2000000000
|
|
13525
|
-
const maxZIndex = 2 * Math.pow(10, 9);
|
|
13526
|
-
// 当前页面最大的z-index
|
|
13527
|
-
let zIndex = 0;
|
|
13528
|
-
// 当前的最大z-index的元素,调试使用
|
|
13529
|
-
let maxZIndexNode = null;
|
|
13530
|
-
Object.keys(PopsInstData).forEach((instKeyName) => {
|
|
13531
|
-
const instData = PopsInstData[instKeyName];
|
|
13532
|
-
for (let index = 0; index < instData.length; index++) {
|
|
13533
|
-
const inst = instData[index];
|
|
13534
|
-
// 不对position为static和display为none的元素进行获取它们的z-index
|
|
13535
|
-
const $elList = [inst.$anim, inst.$pops, inst.$mask].filter((it) => it instanceof HTMLElement);
|
|
13536
|
-
const nodeZIndexInfoList = popsUtils.getMaxZIndexNodeInfoFromPoint($elList);
|
|
13537
|
-
const maxNodeZIndexInfo = nodeZIndexInfoList[0];
|
|
13538
|
-
if (maxNodeZIndexInfo) {
|
|
13539
|
-
const nodeZIndex = maxNodeZIndexInfo.zIndex;
|
|
13540
|
-
if (nodeZIndex > zIndex) {
|
|
13541
|
-
zIndex = nodeZIndex;
|
|
13542
|
-
maxZIndexNode = maxNodeZIndexInfo.node || maxNodeZIndexInfo.positionNode;
|
|
13543
|
-
}
|
|
13544
|
-
}
|
|
13545
|
-
}
|
|
13546
|
-
});
|
|
13547
|
-
zIndex += deviation;
|
|
13548
|
-
const isOverMaxZIndex = zIndex >= maxZIndex;
|
|
13549
|
-
if (isOverMaxZIndex) {
|
|
13550
|
-
// 超出z-index最大值
|
|
13551
|
-
zIndex = maxZIndex;
|
|
13552
|
-
}
|
|
13553
|
-
return { zIndex: zIndex, animElement: maxZIndexNode, isOverMaxZIndex };
|
|
13554
|
-
},
|
|
13555
|
-
/**
|
|
13556
|
-
* 排序数组
|
|
13557
|
-
* @param getBeforeValueFun
|
|
13558
|
-
* @param getAfterValueFun
|
|
13559
|
-
* @param sortByDesc 排序是否降序,默认降序
|
|
13560
|
-
*/
|
|
13561
|
-
sortElementListByProperty(getBeforeValueFun, getAfterValueFun, sortByDesc = true) {
|
|
13562
|
-
if (typeof sortByDesc !== "boolean") {
|
|
13563
|
-
throw new TypeError("参数 sortByDesc 必须为boolean类型");
|
|
13564
|
-
}
|
|
13565
|
-
if (getBeforeValueFun == null || getAfterValueFun == null) {
|
|
13566
|
-
throw new Error("获取前面的值或后面的值的方法不能为空");
|
|
13567
|
-
}
|
|
13568
|
-
return function (after_obj, before_obj) {
|
|
13569
|
-
const beforeValue = getBeforeValueFun(before_obj); // 前
|
|
13570
|
-
const afterValue = getAfterValueFun(after_obj); // 后
|
|
13571
|
-
if (sortByDesc) {
|
|
13572
|
-
if (afterValue > beforeValue) {
|
|
13573
|
-
return -1;
|
|
13574
|
-
}
|
|
13575
|
-
else if (afterValue < beforeValue) {
|
|
13576
|
-
return 1;
|
|
13577
|
-
}
|
|
13578
|
-
else {
|
|
13579
|
-
return 0;
|
|
13580
|
-
}
|
|
13581
|
-
}
|
|
13582
|
-
else {
|
|
13583
|
-
if (afterValue < beforeValue) {
|
|
13584
|
-
return -1;
|
|
13585
|
-
}
|
|
13586
|
-
else if (afterValue > beforeValue) {
|
|
13587
|
-
return 1;
|
|
13588
|
-
}
|
|
13589
|
-
else {
|
|
13590
|
-
return 0;
|
|
13591
|
-
}
|
|
13592
|
-
}
|
|
13593
|
-
};
|
|
13594
|
-
},
|
|
13595
|
-
};
|
|
13596
|
-
|
|
13597
13686
|
class Pops {
|
|
13598
13687
|
/** 配置 */
|
|
13599
13688
|
config = {
|
|
13600
13689
|
/** 版本号 */
|
|
13601
13690
|
version: version,
|
|
13691
|
+
/** 样式配置 */
|
|
13602
13692
|
cssText: PopsCSS,
|
|
13603
13693
|
/** icon图标的svg代码 */
|
|
13604
13694
|
iconSVG: PopsIcon.$data,
|
|
@@ -13606,12 +13696,9 @@
|
|
|
13606
13696
|
animation: PopsAnimation.$data,
|
|
13607
13697
|
/** 存储已创建的元素 */
|
|
13608
13698
|
instData: PopsInstData,
|
|
13609
|
-
|
|
13610
|
-
|
|
13611
|
-
|
|
13612
|
-
return popsDOMUtils.preventEvent(event);
|
|
13613
|
-
},
|
|
13614
|
-
},
|
|
13699
|
+
};
|
|
13700
|
+
/** 导出的函数 */
|
|
13701
|
+
fn = {
|
|
13615
13702
|
/** pops使用的工具类 */
|
|
13616
13703
|
Utils: popsUtils,
|
|
13617
13704
|
/** pops使用的DOM工具类 */
|
|
@@ -13621,15 +13708,16 @@
|
|
|
13621
13708
|
/** pops处理float类型使用的工具类 */
|
|
13622
13709
|
MathFloatUtils: PopsMathFloatUtils,
|
|
13623
13710
|
/** 实例处理函数 */
|
|
13624
|
-
PopsInstHandler,
|
|
13711
|
+
InstHandler: PopsInstHandler,
|
|
13625
13712
|
/** pops.panel中用于处理各个类型的工具 */
|
|
13626
|
-
PanelHandlerComponents,
|
|
13713
|
+
PanelHandlerComponents: PanelHandlerComponents,
|
|
13627
13714
|
/** pops.panel中的动画 */
|
|
13628
|
-
PopsAnimation,
|
|
13715
|
+
Animation: PopsAnimation,
|
|
13629
13716
|
/** 事件类 */
|
|
13630
|
-
EventEmiter,
|
|
13717
|
+
EventEmiter: EventEmiter,
|
|
13718
|
+
/** 通用的CSS类名 */
|
|
13719
|
+
CommonCSSClassName: PopsCommonCSSClassName,
|
|
13631
13720
|
};
|
|
13632
|
-
init() { }
|
|
13633
13721
|
/**
|
|
13634
13722
|
* 释放原有的pops控制权
|
|
13635
13723
|
* @example
|