@whitesev/pops 3.1.2 → 3.2.0

package/dist/index.system.js

@@ -264,47 +264,7 @@ System.register('pops', [], (function (exports) {
             const cache = createCache(LAST_NUMBER_WEAK_MAP);
             const generateUniqueNumber = createGenerateUniqueNumber(cache, LAST_NUMBER_WEAK_MAP);
 
-            const isMessagePort = (sender) => {
-                return typeof sender.start === 'function';
-            };
-
-            const PORT_MAP = new WeakMap();
-
-            const extendBrokerImplementation = (partialBrokerImplementation) => ({
-                ...partialBrokerImplementation,
-                connect: ({ call }) => {
-                    return async () => {
-                        const { port1, port2 } = new MessageChannel();
-                        const portId = await call('connect', { port: port1 }, [port1]);
-                        PORT_MAP.set(port2, portId);
-                        return port2;
-                    };
-                },
-                disconnect: ({ call }) => {
-                    return async (port) => {
-                        const portId = PORT_MAP.get(port);
-                        if (portId === undefined) {
-                            throw new Error('The given port is not connected.');
-                        }
-                        await call('disconnect', { portId });
-                    };
-                },
-                isSupported: ({ call }) => {
-                    return () => call('isSupported');
-                }
-            });
-
-            const ONGOING_REQUESTS = new WeakMap();
-            const createOrGetOngoingRequests = (sender) => {
-                if (ONGOING_REQUESTS.has(sender)) {
-                    // @todo TypeScript needs to be convinced that has() works as expected.
-                    return ONGOING_REQUESTS.get(sender);
-                }
-                const ongoingRequests = new Map();
-                ONGOING_REQUESTS.set(sender, ongoingRequests);
-                return ongoingRequests;
-            };
-            const createBroker = (brokerImplementation) => {
+            const createBrokerFactory = (createOrGetOngoingRequests, extendBrokerImplementation, generateUniqueNumber, isMessagePort) => (brokerImplementation) => {
                 const fullBrokerImplementation = extendBrokerImplementation(brokerImplementation);
                 return (sender) => {
                     const ongoingRequests = createOrGetOngoingRequests(sender);
@@ -347,81 +307,115 @@ System.register('pops', [], (function (exports) {
                 };
             };
 
-            // Prefilling the Maps with a function indexed by zero is necessary to be compliant with the specification.
-            const scheduledIntervalsState = new Map([[0, null]]); // tslint:disable-line no-empty
-            const scheduledTimeoutsState = new Map([[0, null]]); // tslint:disable-line no-empty
-            const wrap = createBroker({
-                clearInterval: ({ call }) => {
-                    return (timerId) => {
-                        if (typeof scheduledIntervalsState.get(timerId) === 'symbol') {
-                            scheduledIntervalsState.set(timerId, null);
-                            call('clear', { timerId, timerType: 'interval' }).then(() => {
-                                scheduledIntervalsState.delete(timerId);
-                            });
-                        }
+            const createCreateOrGetOngoingRequests = (ongoingRequestsMap) => (sender) => {
+                if (ongoingRequestsMap.has(sender)) {
+                    // @todo TypeScript needs to be convinced that has() works as expected.
+                    return ongoingRequestsMap.get(sender);
+                }
+                const ongoingRequests = new Map();
+                ongoingRequestsMap.set(sender, ongoingRequests);
+                return ongoingRequests;
+            };
+
+            const createExtendBrokerImplementation = (portMap) => (partialBrokerImplementation) => ({
+                ...partialBrokerImplementation,
+                connect: ({ call }) => {
+                    return async () => {
+                        const { port1, port2 } = new MessageChannel();
+                        const portId = await call('connect', { port: port1 }, [port1]);
+                        portMap.set(port2, portId);
+                        return port2;
                     };
                 },
-                clearTimeout: ({ call }) => {
-                    return (timerId) => {
-                        if (typeof scheduledTimeoutsState.get(timerId) === 'symbol') {
-                            scheduledTimeoutsState.set(timerId, null);
-                            call('clear', { timerId, timerType: 'timeout' }).then(() => {
-                                scheduledTimeoutsState.delete(timerId);
-                            });
+                disconnect: ({ call }) => {
+                    return async (port) => {
+                        const portId = portMap.get(port);
+                        if (portId === undefined) {
+                            throw new Error('The given port is not connected.');
                         }
+                        await call('disconnect', { portId });
                     };
                 },
-                setInterval: ({ call }) => {
-                    return (func, delay = 0, ...args) => {
-                        const symbol = Symbol();
-                        const timerId = generateUniqueNumber(scheduledIntervalsState);
-                        scheduledIntervalsState.set(timerId, symbol);
-                        const schedule = () => call('set', {
-                            delay,
-                            now: performance.timeOrigin + performance.now(),
-                            timerId,
-                            timerType: 'interval'
-                        }).then(() => {
-                            const state = scheduledIntervalsState.get(timerId);
-                            if (state === undefined) {
-                                throw new Error('The timer is in an undefined state.');
-                            }
-                            if (state === symbol) {
-                                func(...args);
-                                // Doublecheck if the interval should still be rescheduled because it could have been cleared inside of func().
-                                if (scheduledIntervalsState.get(timerId) === symbol) {
-                                    schedule();
-                                }
-                            }
-                        });
-                        schedule();
-                        return timerId;
-                    };
-                },
-                setTimeout: ({ call }) => {
-                    return (func, delay = 0, ...args) => {
-                        const symbol = Symbol();
-                        const timerId = generateUniqueNumber(scheduledTimeoutsState);
-                        scheduledTimeoutsState.set(timerId, symbol);
-                        call('set', {
-                            delay,
-                            now: performance.timeOrigin + performance.now(),
-                            timerId,
-                            timerType: 'timeout'
-                        }).then(() => {
-                            const state = scheduledTimeoutsState.get(timerId);
-                            if (state === undefined) {
-                                throw new Error('The timer is in an undefined state.');
-                            }
-                            if (state === symbol) {
-                                // A timeout can be savely deleted because it is only called once.
-                                scheduledTimeoutsState.delete(timerId);
-                                func(...args);
-                            }
-                        });
-                        return timerId;
-                    };
+                isSupported: ({ call }) => {
+                    return () => call('isSupported');
+                }
+            });
+
+            const isMessagePort = (sender) => {
+                return typeof sender.start === 'function';
+            };
+
+            const createBroker = createBrokerFactory(createCreateOrGetOngoingRequests(new WeakMap()), createExtendBrokerImplementation(new WeakMap()), generateUniqueNumber, isMessagePort);
+
+            const createClearIntervalFactory = (scheduledIntervalsState) => (clear) => (timerId) => {
+                if (typeof scheduledIntervalsState.get(timerId) === 'symbol') {
+                    scheduledIntervalsState.set(timerId, null);
+                    clear(timerId).then(() => {
+                        scheduledIntervalsState.delete(timerId);
+                    });
+                }
+            };
+
+            const createClearTimeoutFactory = (scheduledTimeoutsState) => (clear) => (timerId) => {
+                if (typeof scheduledTimeoutsState.get(timerId) === 'symbol') {
+                    scheduledTimeoutsState.set(timerId, null);
+                    clear(timerId).then(() => {
+                        scheduledTimeoutsState.delete(timerId);
+                    });
                 }
+            };
+
+            const createSetIntervalFactory = (generateUniqueNumber, scheduledIntervalsState) => (set) => (func, delay = 0, ...args) => {
+                const symbol = Symbol();
+                const timerId = generateUniqueNumber(scheduledIntervalsState);
+                scheduledIntervalsState.set(timerId, symbol);
+                const schedule = () => set(delay, timerId).then(() => {
+                    const state = scheduledIntervalsState.get(timerId);
+                    if (state === undefined) {
+                        throw new Error('The timer is in an undefined state.');
+                    }
+                    if (state === symbol) {
+                        func(...args);
+                        // Doublecheck if the interval should still be rescheduled because it could have been cleared inside of func().
+                        if (scheduledIntervalsState.get(timerId) === symbol) {
+                            schedule();
+                        }
+                    }
+                });
+                schedule();
+                return timerId;
+            };
+
+            const createSetTimeoutFactory = (generateUniqueNumber, scheduledTimeoutsState) => (set) => (func, delay = 0, ...args) => {
+                const symbol = Symbol();
+                const timerId = generateUniqueNumber(scheduledTimeoutsState);
+                scheduledTimeoutsState.set(timerId, symbol);
+                set(delay, timerId).then(() => {
+                    const state = scheduledTimeoutsState.get(timerId);
+                    if (state === undefined) {
+                        throw new Error('The timer is in an undefined state.');
+                    }
+                    if (state === symbol) {
+                        // A timeout can be savely deleted because it is only called once.
+                        scheduledTimeoutsState.delete(timerId);
+                        func(...args);
+                    }
+                });
+                return timerId;
+            };
+
+            // Prefilling the Maps with a function indexed by zero is necessary to be compliant with the specification.
+            const scheduledIntervalsState = new Map([[0, null]]); // tslint:disable-line no-empty
+            const scheduledTimeoutsState = new Map([[0, null]]); // tslint:disable-line no-empty
+            const createClearInterval = createClearIntervalFactory(scheduledIntervalsState);
+            const createClearTimeout = createClearTimeoutFactory(scheduledTimeoutsState);
+            const createSetInterval = createSetIntervalFactory(generateUniqueNumber, scheduledIntervalsState);
+            const createSetTimeout = createSetTimeoutFactory(generateUniqueNumber, scheduledTimeoutsState);
+            const wrap = createBroker({
+                clearInterval: ({ call }) => createClearInterval((timerId) => call('clear', { timerId, timerType: 'interval' })),
+                clearTimeout: ({ call }) => createClearTimeout((timerId) => call('clear', { timerId, timerType: 'timeout' })),
+                setInterval: ({ call }) => createSetInterval((delay, timerId) => call('set', { delay, now: performance.timeOrigin + performance.now(), timerId, timerType: 'interval' })),
+                setTimeout: ({ call }) => createSetTimeout((delay, timerId) => call('set', { delay, now: performance.timeOrigin + performance.now(), timerId, timerType: 'timeout' }))
             });
             const load = (url) => {
                 const worker = new Worker(url);
@@ -444,7 +438,7 @@ System.register('pops', [], (function (exports) {
             };
 
             // This is the minified and stringified code of the worker-timers-worker package.
-            const worker = `(()=>{var e={455:function(e,t){!function(e){"use strict";var t=function(e){return function(t){var r=e(t);return t.add(r),r}},r=function(e){return function(t,r){return e.set(t,r),r}},n=void 0===Number.MAX_SAFE_INTEGER?9007199254740991:Number.MAX_SAFE_INTEGER,o=536870912,s=2*o,a=function(e,t){return function(r){var a=t.get(r),i=void 0===a?r.size:a<s?a+1:0;if(!r.has(i))return e(r,i);if(r.size<o){for(;r.has(i);)i=Math.floor(Math.random()*s);return e(r,i)}if(r.size>n)throw new Error("Congratulations, you created a collection of unique numbers which uses all available integers!");for(;r.has(i);)i=Math.floor(Math.random()*n);return e(r,i)}},i=new WeakMap,u=r(i),c=a(u,i),l=t(c);e.addUniqueNumber=l,e.generateUniqueNumber=c}(t)}},t={};function r(n){var o=t[n];if(void 0!==o)return o.exports;var s=t[n]={exports:{}};return e[n].call(s.exports,s,s.exports,r),s.exports}(()=>{"use strict";const e=-32603,t=-32602,n=-32601,o=(e,t)=>Object.assign(new Error(e),{status:t}),s=t=>o('The handler of the method called "'.concat(t,'" returned an unexpected result.'),e),a=(t,r)=>async({data:{id:a,method:i,params:u}})=>{const c=r[i];try{if(void 0===c)throw(e=>o('The requested method called "'.concat(e,'" is not supported.'),n))(i);const r=void 0===u?c():c(u);if(void 0===r)throw(t=>o('The handler of the method called "'.concat(t,'" returned no required result.'),e))(i);const l=r instanceof Promise?await r:r;if(null===a){if(void 0!==l.result)throw s(i)}else{if(void 0===l.result)throw s(i);const{result:e,transferables:r=[]}=l;t.postMessage({id:a,result:e},r)}}catch(e){const{message:r,status:n=-32603}=e;t.postMessage({error:{code:n,message:r},id:a})}};var i=r(455);const u=new Map,c=(e,r,n)=>({...r,connect:({port:t})=>{t.start();const n=e(t,r),o=(0,i.generateUniqueNumber)(u);return u.set(o,()=>{n(),t.close(),u.delete(o)}),{result:o}},disconnect:({portId:e})=>{const r=u.get(e);if(void 0===r)throw(e=>o('The specified parameter called "portId" with the given value "'.concat(e,'" does not identify a port connected to this worker.'),t))(e);return r(),{result:null}},isSupported:async()=>{if(await new Promise(e=>{const t=new ArrayBuffer(0),{port1:r,port2:n}=new MessageChannel;r.onmessage=({data:t})=>e(null!==t),n.postMessage(t,[t])})){const e=n();return{result:e instanceof Promise?await e:e}}return{result:!1}}}),l=(e,t,r=()=>!0)=>{const n=c(l,t,r),o=a(e,n);return e.addEventListener("message",o),()=>e.removeEventListener("message",o)},d=(e,t)=>r=>{const n=t.get(r);if(void 0===n)return Promise.resolve(!1);const[o,s]=n;return e(o),t.delete(r),s(!1),Promise.resolve(!0)},f=(e,t,r,n)=>(o,s,a)=>{const i=o+s-t.timeOrigin,u=i-t.now();return new Promise(t=>{e.set(a,[r(n,u,i,e,t,a),t])})},m=new Map,h=d(globalThis.clearTimeout,m),p=new Map,v=d(globalThis.clearTimeout,p),w=((e,t)=>{const r=(n,o,s,a)=>{const i=n-e.now();i>0?o.set(a,[t(r,i,n,o,s,a),s]):(o.delete(a),s(!0))};return r})(performance,globalThis.setTimeout),g=f(m,performance,globalThis.setTimeout,w),T=f(p,performance,globalThis.setTimeout,w);l(self,{clear:async({timerId:e,timerType:t})=>({result:await("interval"===t?h(e):v(e))}),set:async({delay:e,now:t,timerId:r,timerType:n})=>({result:await("interval"===n?g:T)(e,t,r)})})})()})();`; // tslint:disable-line:max-line-length
+            const worker = `(()=>{var e={455(e,t){!function(e){"use strict";var t=function(e){return function(t){var r=e(t);return t.add(r),r}},r=function(e){return function(t,r){return e.set(t,r),r}},n=void 0===Number.MAX_SAFE_INTEGER?9007199254740991:Number.MAX_SAFE_INTEGER,o=536870912,s=2*o,a=function(e,t){return function(r){var a=t.get(r),i=void 0===a?r.size:a<s?a+1:0;if(!r.has(i))return e(r,i);if(r.size<o){for(;r.has(i);)i=Math.floor(Math.random()*s);return e(r,i)}if(r.size>n)throw new Error("Congratulations, you created a collection of unique numbers which uses all available integers!");for(;r.has(i);)i=Math.floor(Math.random()*n);return e(r,i)}},i=new WeakMap,u=r(i),c=a(u,i),l=t(c);e.addUniqueNumber=l,e.generateUniqueNumber=c}(t)}},t={};function r(n){var o=t[n];if(void 0!==o)return o.exports;var s=t[n]={exports:{}};return e[n].call(s.exports,s,s.exports,r),s.exports}(()=>{"use strict";const e=-32603,t=-32602,n=-32601,o=(e,t)=>Object.assign(new Error(e),{status:t}),s=t=>o('The handler of the method called "'.concat(t,'" returned an unexpected result.'),e),a=(t,r)=>async({data:{id:a,method:i,params:u}})=>{const c=r[i];try{if(void 0===c)throw(e=>o('The requested method called "'.concat(e,'" is not supported.'),n))(i);const r=void 0===u?c():c(u);if(void 0===r)throw(t=>o('The handler of the method called "'.concat(t,'" returned no required result.'),e))(i);const l=r instanceof Promise?await r:r;if(null===a){if(void 0!==l.result)throw s(i)}else{if(void 0===l.result)throw s(i);const{result:e,transferables:r=[]}=l;t.postMessage({id:a,result:e},r)}}catch(e){const{message:r,status:n=-32603}=e;t.postMessage({error:{code:n,message:r},id:a})}};var i=r(455);const u=new Map,c=(e,r,n)=>({...r,connect:({port:t})=>{t.start();const n=e(t,r),o=(0,i.generateUniqueNumber)(u);return u.set(o,()=>{n(),t.close(),u.delete(o)}),{result:o}},disconnect:({portId:e})=>{const r=u.get(e);if(void 0===r)throw(e=>o('The specified parameter called "portId" with the given value "'.concat(e,'" does not identify a port connected to this worker.'),t))(e);return r(),{result:null}},isSupported:async()=>{if(await new Promise(e=>{const t=new ArrayBuffer(0),{port1:r,port2:n}=new MessageChannel;r.onmessage=({data:t})=>e(null!==t),n.postMessage(t,[t])})){const e=n();return{result:e instanceof Promise?await e:e}}return{result:!1}}}),l=(e,t,r=()=>!0)=>{const n=c(l,t,r),o=a(e,n);return e.addEventListener("message",o),()=>e.removeEventListener("message",o)},d=(e,t)=>r=>{const n=t.get(r);if(void 0===n)return Promise.resolve(!1);const[o,s]=n;return e(o),t.delete(r),s(!1),Promise.resolve(!0)},m=(e,t,r,n)=>(o,s,a)=>{const i=o+s-t.timeOrigin,u=i-t.now();return new Promise(t=>{e.set(a,[r(n,u,i,e,t,a),t])})},f=new Map,h=d(globalThis.clearTimeout,f),p=new Map,v=d(globalThis.clearTimeout,p),w=((e,t)=>{const r=(n,o,s,a)=>{const i=n-e.now();i>0?o.set(a,[t(r,i,n,o,s,a),s]):(o.delete(a),s(!0))};return r})(performance,globalThis.setTimeout),g=m(f,performance,globalThis.setTimeout,w),T=m(p,performance,globalThis.setTimeout,w);l(self,{clear:async({timerId:e,timerType:t})=>({result:await("interval"===t?h(e):v(e))}),set:async({delay:e,now:t,timerId:r,timerType:n})=>({result:await("interval"===n?g:T)(e,t,r)})})})()})();`; // tslint:disable-line:max-line-length
 
             const loadOrReturnBroker = createLoadOrReturnBroker(load, worker);
             const clearInterval$1 = (timerId) => loadOrReturnBroker().clearInterval(timerId);
@@ -525,7 +519,7 @@ System.register('pops', [], (function (exports) {
                  * @param propName
                  */
                 delete(target, propName) {
-                    if (typeof Reflect === "object" && Reflect.deleteProperty) {
+                    if (typeof Reflect === "object" && typeof Reflect.deleteProperty === "function") {
                         Reflect.deleteProperty(target, propName);
                     }
                     else {
@@ -1031,13 +1025,13 @@ System.register('pops', [], (function (exports) {
                     if (element == null) {
                         return;
                     }
-                    let elementList = [];
+                    let $elList = [];
                     if (element instanceof NodeList || Array.isArray(element)) {
                         element = element;
-                        elementList = [...element];
+                        $elList = $elList.concat(element);
                     }
                     else {
-                        elementList.push(element);
+                        $elList.push(element);
                     }
                     let eventTypeList = [];
                     if (Array.isArray(eventType)) {
@@ -1088,7 +1082,7 @@ System.register('pops', [], (function (exports) {
                         // 目标函数、事件名、回调函数、事件配置、过滤函数
                         filter = option;
                     }
-                    elementList.forEach((elementItem) => {
+                    $elList.forEach((elementItem) => {
                         // 获取对象上的事件
                         const elementEvents = Reflect.get(elementItem, SymbolEvents) || {};
                         eventTypeList.forEach((eventName) => {
@@ -1135,18 +1129,19 @@ System.register('pops', [], (function (exports) {
                  * @param eventType （可选）需要取消监听的事件
                  */
                 offAll(element, eventType) {
+                    const that = this;
                     if (typeof element === "string") {
-                        element = PopsCore.document.querySelectorAll(element);
+                        element = that.selectorAll(element);
                     }
                     if (element == null) {
                         return;
                     }
-                    let elementList = [];
+                    let $elList = [];
                     if (element instanceof NodeList || Array.isArray(element)) {
-                        elementList = [...element];
+                        $elList = $elList.concat(Array.from(element));
                     }
                     else {
-                        elementList.push(element);
+                        $elList.push(element);
                     }
                     let eventTypeList = [];
                     if (Array.isArray(eventType)) {
@@ -1155,12 +1150,13 @@ System.register('pops', [], (function (exports) {
                     else if (typeof eventType === "string") {
                         eventTypeList = eventTypeList.concat(eventType.split(" "));
                     }
-                    elementList.forEach((elementItem) => {
-                        Object.getOwnPropertySymbols(elementItem).forEach((__symbolEvents) => {
-                            if (!__symbolEvents.toString().startsWith("Symbol(events_")) {
+                    $elList.forEach(($elItem) => {
+                        const symbolList = [...new Set([...Object.getOwnPropertySymbols($elItem), SymbolEvents])];
+                        symbolList.forEach((symbolItem) => {
+                            if (!symbolItem.toString().startsWith("Symbol(events_")) {
                                 return;
                             }
-                            const elementEvents = elementItem[__symbolEvents] || {};
+                            const elementEvents = Reflect.get($elItem, symbolItem) || {};
                             const iterEventNameList = eventTypeList.length ? eventTypeList : Object.keys(elementEvents);
                             iterEventNameList.forEach((eventName) => {
                                 const handlers = elementEvents[eventName];
@@ -1168,11 +1164,12 @@ System.register('pops', [], (function (exports) {
                                     return;
                                 }
                                 for (const handler of handlers) {
-                                    elementItem.removeEventListener(eventName, handler.callback, {
+                                    $elItem.removeEventListener(eventName, handler.callback, {
                                         capture: handler["option"]["capture"],
                                     });
                                 }
-                                popsUtils.delete(elementItem[__symbolEvents], eventName);
+                                const events = Reflect.get($elItem, symbolItem);
+                                popsUtils.delete(events, eventName);
                             });
                         });
                     });
@@ -1915,7 +1912,8 @@ System.register('pops', [], (function (exports) {
                     }
                     return $el.classList.contains(className);
                 }
-                css(element, property, value) {
+                css($el, property, value) {
+                    const that = this;
                     /**
                      * 把纯数字没有px的加上
                      */
@@ -1929,10 +1927,33 @@ System.register('pops', [], (function (exports) {
                         }
                         return propertyValue;
                     }
-                    if (typeof element === "string") {
-                        element = PopsCore.document.querySelector(element);
+                    if (typeof $el === "string") {
+                        $el = that.selectorAll($el);
                     }
-                    if (element == null) {
+                    if ($el == null) {
+                        return;
+                    }
+                    if (Array.isArray($el) || $el instanceof NodeList) {
+                        if (typeof property === "string") {
+                            if (value == null) {
+                                // 获取属性
+                                return that.css($el[0], property);
+                            }
+                            else {
+                                // 设置属性
+                                $el.forEach(($elItem) => {
+                                    that.css($elItem, property);
+                                });
+                                return;
+                            }
+                        }
+                        else if (typeof property === "object") {
+                            // 设置属性
+                            $el.forEach(($elItem) => {
+                                that.css($elItem, property);
+                            });
+                            return;
+                        }
                         return;
                     }
                     const setStyleProperty = (propertyName, propertyValue) => {
@@ -1941,16 +1962,16 @@ System.register('pops', [], (function (exports) {
                                 .trim()
                                 .replace(/!important$/gi, "")
                                 .trim();
-                            element.style.setProperty(propertyName, propertyValue, "important");
+                            $el.style.setProperty(propertyName, propertyValue, "important");
                         }
                         else {
                             propertyValue = handlePixe(propertyName, propertyValue);
-                            element.style.setProperty(propertyName, propertyValue);
+                            $el.style.setProperty(propertyName, propertyValue);
                         }
                     };
                     if (typeof property === "string") {
                         if (value == null) {
-                            return getComputedStyle(element).getPropertyValue(property);
+                            return PopsCore.globalThis.getComputedStyle($el).getPropertyValue(property);
                         }
                         else {
                             setStyleProperty(property, value);
@@ -1962,6 +1983,10 @@ System.register('pops', [], (function (exports) {
                             setStyleProperty(prop, value);
                         }
                     }
+                    else {
+                        // 其他情况
+                        throw new TypeError("property must be string or object");
+                    }
                 }
                 /**
                  * 创建元素
@@ -3096,16 +3121,16 @@ System.register('pops', [], (function (exports) {
                 },
                 /**
                  * 删除配置中对应的对象
-                 * @param instConfigList 配置实例列表
+                 * @param totalInstConfigList 配置实例列表
                  * @param  guid 唯一标识
                  * @param isAll 是否全部删除
                  */
-                removeInstance(instConfigList, guid, isAll = false) {
+                async removeInstance(totalInstConfigList, guid, isAll = false) {
                     /**
                      * 移除元素实例
                      * @param instCommonConfig
                      */
-                    function removeItem(instCommonConfig) {
+                    const removeInst = function (instCommonConfig) {
                         if (typeof instCommonConfig.beforeRemoveCallBack === "function") {
                             // 调用移除签的回调
                             instCommonConfig.beforeRemoveCallBack(instCommonConfig);
@@ -3114,39 +3139,44 @@ System.register('pops', [], (function (exports) {
                         instCommonConfig?.$pops?.remove();
                         instCommonConfig?.$mask?.remove();
                         instCommonConfig?.$shadowContainer?.remove();
-                    }
+                    };
+                    const asyncInstTask = [];
                     // [ inst[], inst[],...]
-                    instConfigList.forEach((instConfigList) => {
+                    totalInstConfigList.forEach((instConfigList) => {
                         //  inst[]
-                        instConfigList.forEach((instConfigItem, index) => {
+                        instConfigList.forEach(async (instConfigItem, index) => {
                             // 移除全部或者guid相同
-                            if (isAll || instConfigItem["guid"] === guid) {
+                            if (isAll || (typeof guid === "string" && instConfigItem.guid === guid)) {
                                 // 判断是否有动画
                                 const animName = instConfigItem.$anim.getAttribute("anim");
                                 if (PopsAnimation.hasAnim(animName)) {
                                     const reverseAnimName = animName + "-reverse";
-                                    instConfigItem.$anim.style.width = "100%";
-                                    instConfigItem.$anim.style.height = "100%";
-                                    instConfigItem.$anim.style["animation-name"] = reverseAnimName;
-                                    if (PopsAnimation.hasAnim(instConfigItem.$anim.style["animation-name"])) {
-                                        popsDOMUtils.on(instConfigItem.$anim, popsDOMUtils.getAnimationEndNameList(), function () {
-                                            removeItem(instConfigItem);
-                                        }, {
-                                            capture: true,
-                                        });
+                                    popsDOMUtils.css(instConfigItem.$anim, "width", "100%");
+                                    popsDOMUtils.css(instConfigItem.$anim, "height", "100%");
+                                    popsDOMUtils.css(instConfigItem.$anim, "animation-name", reverseAnimName);
+                                    if (PopsAnimation.hasAnim(popsDOMUtils.css(instConfigItem.$anim, "animation-name"))) {
+                                        asyncInstTask.push(new Promise((resolve) => {
+                                            popsDOMUtils.on(instConfigItem.$anim, popsDOMUtils.getAnimationEndNameList(), function () {
+                                                removeInst(instConfigItem);
+                                                resolve();
+                                            }, {
+                                                capture: true,
+                                            });
+                                        }));
                                     }
                                     else {
-                                        removeItem(instConfigItem);
+                                        removeInst(instConfigItem);
                                     }
                                 }
                                 else {
-                                    removeItem(instConfigItem);
+                                    removeInst(instConfigItem);
                                 }
                                 instConfigList.splice(index, 1);
                             }
                         });
                     });
-                    return instConfigList;
+                    await Promise.all(asyncInstTask);
+                    return totalInstConfigList;
                 },
                 /**
                  * 隐藏
@@ -3291,8 +3321,9 @@ System.register('pops', [], (function (exports) {
                  * @param config
                  * @param $anim
                  */
-                close(config, popsType, instConfigList, guid, $anim) {
-                    return new Promise((resolve) => {
+                async close(config, popsType, instConfigList, guid, $anim) {
+                    // eslint-disable-next-line no-async-promise-executor
+                    await new Promise(async (resolve) => {
                         const $pops = $anim.querySelector(".pops[type-value]");
                         const drawerConfig = config;
                         /**
@@ -3302,12 +3333,12 @@ System.register('pops', [], (function (exports) {
                             /**
                              * 弹窗已关闭的回调
                              */
-                            function closeCallBack(event) {
+                            async function closeCallBack(event) {
                                 if (event.propertyName !== "transform") {
                                     return;
                                 }
-                                popsDOMUtils.off($pops, popsDOMUtils.getTransitionEndNameList(), void 0, closeCallBack);
-                                PopsInstanceUtils.removeInstance([instConfigList], guid);
+                                popsDOMUtils.off($pops, popsDOMUtils.getTransitionEndNameList(), closeCallBack);
+                                await PopsInstanceUtils.removeInstance([instConfigList], guid);
                                 resolve();
                             }
                             // 监听过渡结束
@@ -3339,10 +3370,32 @@ System.register('pops', [], (function (exports) {
                             }, drawerConfig.closeDelay);
                         }
                         else {
-                            PopsInstanceUtils.removeInstance([instConfigList], guid);
+                            await PopsInstanceUtils.removeInstance([instConfigList], guid);
                             resolve();
                         }
                     });
+                    // 判断组件内是否有rightClickMenu、tooltip、searchSuggestion组件
+                    // 有的话也需要关闭
+                    PopsInstData.rightClickMenu.forEach((itemConfig) => {
+                        const config = itemConfig.config;
+                        if (config.$target instanceof HTMLElement) {
+                            const $root = config.$target.getRootNode();
+                            if ($root instanceof HTMLElement && $root.parentElement == null) {
+                                // 触发销毁元素
+                                itemConfig.destory();
+                            }
+                        }
+                    });
+                    PopsInstData.tooltip.forEach((itemConfig) => {
+                        const config = itemConfig.config;
+                        if (config.$target instanceof HTMLElement) {
+                            const $root = config.$target.getRootNode();
+                            if ($root instanceof HTMLElement && $root.parentElement == null) {
+                                // 触发销毁元素
+                                itemConfig.destory();
+                            }
+                        }
+                    });
                 },
                 /**
                  * 拖拽元素
@@ -3681,12 +3734,12 @@ System.register('pops', [], (function (exports) {
                                 element.hasAttribute("anim"));
                         }
                         // 判断按下的元素是否是pops-anim
-                        popsDOMUtils.on(config.animElement, ["touchstart", "mousedown"], void 0, (event) => {
+                        popsDOMUtils.on(config.animElement, ["touchstart", "mousedown"], (event) => {
                             const $click = event.composedPath()[0];
                             isMaskClick = isAnimElement($click);
                         });
                         // 如果有动画层，在动画层上监听点击事件
-                        popsDOMUtils.on(config.animElement, "click", void 0, (event) => {
+                        popsDOMUtils.on(config.animElement, "click", (event) => {
                             const $click = event.composedPath()[0];
                             if (isAnimElement($click) && isMaskClick) {
                                 return clickEvent(event);
@@ -3694,7 +3747,7 @@ System.register('pops', [], (function (exports) {
                         });
                         // 在遮罩层监听点击事件
                         // 如果有动画层，那么该点击事件触发不了
-                        popsDOMUtils.on(result.maskElement, "click", void 0, (event) => {
+                        popsDOMUtils.on(result.maskElement, "click", (event) => {
                             isMaskClick = true;
                             clickEvent(event);
                         });
@@ -3837,13 +3890,13 @@ System.register('pops', [], (function (exports) {
                  * @param guid
                  * @param $shadowContainer
                  * @param $shadowRoot
-                 * @param mode 当前弹窗类型
+                 * @param type 当前弹窗类型
                  * @param $anim 动画层
                  * @param $pops 主元素
                  * @param $mask 遮罩层
                  * @param config 当前配置
                  */
-                handleEventConfig(config, guid, $shadowContainer, $shadowRoot, mode, $anim, $pops, $mask) {
+                handleEventConfig(config, guid, $shadowContainer, $shadowRoot, type, $anim, $pops, $mask) {
                     return {
                         $shadowContainer: $shadowContainer,
                         $shadowRoot: $shadowRoot,
@@ -3851,44 +3904,47 @@ System.register('pops', [], (function (exports) {
                         $anim: $anim,
                         $pops: $pops,
                         $mask: $mask,
-                        mode: mode,
+                        mode: type,
                         guid: guid,
                         close() {
-                            return PopsInstanceUtils.close(config, mode, PopsInstData[mode], guid, $anim);
+                            return PopsInstanceUtils.close(config, type, PopsInstData[type], guid, $anim);
                         },
                         hide() {
-                            return PopsInstanceUtils.hide(config, mode, PopsInstData[mode], guid, $anim, $mask);
+                            return PopsInstanceUtils.hide(config, type, PopsInstData[type], guid, $anim, $mask);
                         },
-                        show() {
-                            return PopsInstanceUtils.show(config, mode, PopsInstData[mode], guid, $anim, $mask);
+                        show($parent) {
+                            if ($parent) {
+                                $parent.appendChild(PopsInstData[type][0].$shadowRoot);
+                            }
+                            return PopsInstanceUtils.show(config, type, PopsInstData[type], guid, $anim, $mask);
                         },
                     };
                 },
                 /**
                  * 获取loading的事件配置
                  * @param guid
-                 * @param mode 当前弹窗类型
+                 * @param type 当前弹窗类型
                  * @param $anim 动画层
                  * @param $pops 主元素
                  * @param $mask 遮罩层
                  * @param config 当前配置
                  */
-                handleLoadingEventConfig(config, guid, mode, $anim, $pops, $mask) {
+                handleLoadingEventConfig(config, guid, type, $anim, $pops, $mask) {
                     return {
                         $el: $anim,
                         $anim: $anim,
                         $pops: $pops,
                         $mask: $mask,
-                        mode: mode,
+                        mode: type,
                         guid: guid,
                         close() {
-                            return PopsInstanceUtils.close(config, mode, PopsInstData[mode], guid, $anim);
+                            return PopsInstanceUtils.close(config, type, PopsInstData[type], guid, $anim);
                         },
                         hide() {
-                            return PopsInstanceUtils.hide(config, mode, PopsInstData[mode], guid, $anim, $mask);
+                            return PopsInstanceUtils.hide(config, type, PopsInstData[type], guid, $anim, $mask);
                         },
                         show() {
-                            return PopsInstanceUtils.show(config, mode, PopsInstData[mode], guid, $anim, $mask);
+                            return PopsInstanceUtils.show(config, type, PopsInstData[type], guid, $anim, $mask);
                         },
                     };
                 },
@@ -4001,8 +4057,8 @@ System.register('pops', [], (function (exports) {
                 handleOnly(type, config) {
                     if (config.only) {
                         // .loading
-                        // .tooltip
                         // .rightClickMenu
+                        // .tooltip
                         // 单独处理
                         if (type === "loading" || type === "tooltip" || type === "rightClickMenu") {
                             const inst = PopsInstData[type];
@@ -4014,11 +4070,11 @@ System.register('pops', [], (function (exports) {
                             PopsInstanceUtils.removeInstance([
                                 PopsInstData.alert,
                                 PopsInstData.confirm,
-                                PopsInstData.prompt,
-                                PopsInstData.iframe,
                                 PopsInstData.drawer,
                                 PopsInstData.folder,
+                                PopsInstData.iframe,
                                 PopsInstData.panel,
+                                PopsInstData.prompt,
                             ], "", true);
                         }
                     }
@@ -4182,6 +4238,7 @@ System.register('pops', [], (function (exports) {
                     }
                     // 处理返回的配置
                     const evtConfig = PopsHandler.handleEventConfig(config, guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask);
+                    const result = PopsHandler.handleResultConfig(evtConfig);
                     // 为顶部右边的关闭按钮添加点击事件
                     PopsHandler.handleClickEvent("close", $headerCloseBtn, evtConfig, config.btn.close?.callback);
                     // 为底部ok按钮添加点击事件
@@ -4204,6 +4261,8 @@ System.register('pops', [], (function (exports) {
                         $mask: $mask,
                         $shadowContainer: $shadowContainer,
                         $shadowRoot: $shadowRoot,
+                        config: config,
+                        destory: result.close,
                     });
                     // 拖拽
                     if (config.drag) {
@@ -4215,7 +4274,6 @@ System.register('pops', [], (function (exports) {
                             endCallBack: config.dragEndCallBack,
                         });
                     }
-                    const result = PopsHandler.handleResultConfig(evtConfig);
                     return result;
                 },
             };
@@ -4389,6 +4447,7 @@ System.register('pops', [], (function (exports) {
                         $elList.push($mask);
                     }
                     const evtConfig = PopsHandler.handleEventConfig(config, guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask);
+                    const result = PopsHandler.handleResultConfig(evtConfig);
                     PopsHandler.handleClickEvent("close", $btnClose, evtConfig, config.btn.close.callback);
                     PopsHandler.handleClickEvent("ok", $btnOk, evtConfig, config.btn.ok.callback);
                     PopsHandler.handleClickEvent("cancel", $btnCancel, evtConfig, config.btn.cancel.callback);
@@ -4409,6 +4468,8 @@ System.register('pops', [], (function (exports) {
                         $mask: $mask,
                         $shadowContainer: $shadowContainer,
                         $shadowRoot: $shadowRoot,
+                        config: config,
+                        destory: result.close,
                     });
                     // 拖拽
                     if (config.drag) {
@@ -4420,7 +4481,6 @@ System.register('pops', [], (function (exports) {
                             endCallBack: config.dragEndCallBack,
                         });
                     }
-                    const result = PopsHandler.handleResultConfig(evtConfig);
                     return result;
                 },
             };
@@ -4599,6 +4659,7 @@ System.register('pops', [], (function (exports) {
                         $elList.push($mask);
                     }
                     const evtConfig = PopsHandler.handleEventConfig(config, guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask);
+                    const result = PopsHandler.handleResultConfig(evtConfig);
                     // 处理方向
                     $pops.setAttribute("direction", config.direction);
                     // 处理border-radius
@@ -4694,8 +4755,9 @@ System.register('pops', [], (function (exports) {
                         $mask: $mask,
                         $shadowContainer: $shadowContainer,
                         $shadowRoot: $shadowRoot,
+                        config: config,
+                        destory: result.close,
                     });
-                    const result = PopsHandler.handleResultConfig(evtConfig);
                     return result;
                 },
             };
@@ -5204,6 +5266,7 @@ System.register('pops', [], (function (exports) {
                     }
                     // 事件
                     const evtConfig = PopsHandler.handleEventConfig(config, guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask);
+                    const result = PopsHandler.handleResultConfig(evtConfig);
                     PopsHandler.handleClickEvent("close", $btnCloseBtn, evtConfig, config.btn.close.callback);
                     PopsHandler.handleClickEvent("ok", btnOkElement, evtConfig, config.btn.ok.callback);
                     PopsHandler.handleClickEvent("cancel", btnCancelElement, evtConfig, config.btn.cancel.callback);
@@ -5783,8 +5846,9 @@ System.register('pops', [], (function (exports) {
                         $mask: $mask,
                         $shadowContainer: $shadowContainer,
                         $shadowRoot: $shadowRoot,
+                        config: config,
+                        destory: result.close,
                     });
-                    const result = PopsHandler.handleResultConfig(evtConfig);
                     return result;
                 },
             };
@@ -5940,6 +6004,7 @@ System.register('pops', [], (function (exports) {
                     const evtConfig = PopsHandler.handleEventConfig(config, guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask);
                     // 赋值额外的$iframe参数
                     evtConfig.$iframe = $iframe;
+                    const result = PopsHandler.handleResultConfig(evtConfig);
                     popsDOMUtils.on($anim, popsDOMUtils.getAnimationEndNameList(), function () {
                         // 动画加载完毕
                         $anim.style.width = "0%";
@@ -6071,10 +6136,10 @@ System.register('pops', [], (function (exports) {
                         capture: true,
                     });
                     // 关闭按钮点击事件
-                    popsDOMUtils.on(headerCloseBtnElement, "click", (event) => {
+                    popsDOMUtils.on(headerCloseBtnElement, "click", async (event) => {
                         event.preventDefault();
                         event.stopPropagation();
-                        PopsInstanceUtils.removeInstance([PopsInstData.iframe], guid, false);
+                        await PopsInstanceUtils.removeInstance([PopsInstData.iframe], guid, false);
                         if (typeof config?.btn?.close?.callback === "function") {
                             config.btn.close.callback(evtConfig, event);
                         }
@@ -6088,8 +6153,9 @@ System.register('pops', [], (function (exports) {
                         $mask: $mask,
                         $shadowContainer: $shadowContainer,
                         $shadowRoot: $shadowRoot,
+                        config: config,
+                        destory: result.close,
                     });
-                    const result = PopsHandler.handleResultConfig(evtConfig);
                     return result;
                 },
             };
@@ -7055,7 +7121,7 @@ System.register('pops', [], (function (exports) {
                     isFixed: false,
                     alwaysShow: false,
                     onShowEventName: "mouseenter touchstart",
-                    onCloseEventName: "mouseleave touchend",
+                    onCloseEventName: "mouseleave touchend touchcancel",
                     zIndex: 10000,
                     only: false,
                     eventOption: {
@@ -7281,12 +7347,12 @@ System.register('pops', [], (function (exports) {
                 changePosition(event) {
                     const positionInfo = this.calcToolTipPosition(this.$data.config.$target, this.$data.config.arrowDistance, this.$data.config.otherDistance, event);
                     const positionKey = this.$data.config.position.toUpperCase();
-                    const positionDetail = positionInfo[positionKey];
-                    if (positionDetail) {
-                        this.$el.$toolTip.style.left = positionDetail.left + "px";
-                        this.$el.$toolTip.style.top = positionDetail.top + "px";
-                        this.$el.$toolTip.setAttribute("data-motion", positionDetail.motion);
-                        this.$el.$arrow.setAttribute("data-position", positionDetail.arrow);
+                    const position = positionInfo[positionKey];
+                    if (position) {
+                        this.$el.$toolTip.style.left = position.left + "px";
+                        this.$el.$toolTip.style.top = position.top + "px";
+                        this.$el.$toolTip.setAttribute("data-motion", position.motion);
+                        this.$el.$arrow.setAttribute("data-position", position.arrow);
                     }
                     else {
                         console.error("不存在该位置", this.$data.config.position);
@@ -7392,9 +7458,7 @@ System.register('pops', [], (function (exports) {
                  * 取消绑定 显示事件
                  */
                 offShowEvent() {
-                    popsDOMUtils.off(this.$data.config.$target, this.$data.config.onShowEventName, this.show, {
-                        capture: true,
-                    });
+                    popsDOMUtils.off(this.$data.config.$target, this.$data.config.onShowEventName, this.show, this.$data.config.eventOption);
                 }
                 /**
                  * 关闭提示框
@@ -7453,22 +7517,20 @@ System.register('pops', [], (function (exports) {
                  * 取消绑定 关闭事件
                  */
                 offCloseEvent() {
-                    popsDOMUtils.off(this.$data.config.$target, this.$data.config.onCloseEventName, this.close, {
-                        capture: true,
-                    });
+                    popsDOMUtils.off(this.$data.config.$target, this.$data.config.onCloseEventName, this.close, this.$data.config.eventOption);
                 }
                 /**
                  * 销毁元素
                  */
                 destory() {
                     if (this.$el.$toolTip) {
-                        this.$el.$shadowRoot.removeChild(this.$el.$toolTip);
+                        this.$el.$toolTip.remove();
                     }
-                    // @ts-ignore
+                    // @ts-expect-error
                     this.$el.$toolTip = null;
-                    // @ts-ignore
+                    // @ts-expect-error
                     this.$el.$arrow = null;
-                    // @ts-ignore
+                    // @ts-expect-error
                     this.$el.$content = null;
                 }
                 /**
@@ -7516,29 +7578,29 @@ System.register('pops', [], (function (exports) {
                     popsDOMUtils.on(this.$el.$toolTip, "mouseenter touchstart", this.toolTipMouseEnterEvent, this.$data.config.eventOption);
                 }
                 /**
-                 * 取消监听鼠标|触摸事件
+                 * 取消监听事件 - 鼠标|触摸
                  */
                 offToolTipMouseEnterEvent() {
                     popsDOMUtils.off(this.$el.$toolTip, "mouseenter touchstart", this.toolTipMouseEnterEvent, this.$data.config.eventOption);
                 }
                 /**
-                 * 鼠标|触摸离开事件
+                 * 离开事件 - 鼠标|触摸
                  */
                 toolTipMouseLeaveEvent(event) {
                     this.close(event);
                     // this.$el.$toolTip.style.animationPlayState = "running";
                 }
                 /**
-                 * 监听鼠标|触摸离开事件
+                 * 监听离开事件 - 鼠标|触摸
                  */
                 onToolTipMouseLeaveEvent() {
-                    popsDOMUtils.on(this.$el.$toolTip, "mouseleave touchend", this.toolTipMouseLeaveEvent, this.$data.config.eventOption);
+                    popsDOMUtils.on(this.$el.$toolTip, "mouseleave touchend touchcancel", this.toolTipMouseLeaveEvent, this.$data.config.eventOption);
                 }
                 /**
-                 * 取消监听鼠标|触摸离开事件
+                 * 取消监听离开事件 - 鼠标|触摸
                  */
                 offToolTipMouseLeaveEvent() {
-                    popsDOMUtils.off(this.$el.$toolTip, "mouseleave touchend", this.toolTipMouseLeaveEvent, this.$data.config.eventOption);
+                    popsDOMUtils.off(this.$el.$toolTip, "mouseleave touchend touchcancel", this.toolTipMouseLeaveEvent, this.$data.config.eventOption);
                 }
             }
             const PopsTooltip = {
@@ -7553,6 +7615,15 @@ System.register('pops', [], (function (exports) {
                         throw new TypeError("config.target 必须是HTMLElement类型");
                     }
                     config = PopsHandler.handleOnly(popsType, config);
+                    if (config.position === "follow") {
+                        config.onShowEventName = config.onShowEventName.trim();
+                        const showEventNameSplit = config.onShowEventName.split(" ");
+                        ["mousemove", "touchmove"].forEach((it) => {
+                            if (showEventNameSplit.includes(it))
+                                return;
+                            config.onShowEventName += ` ${it}`;
+                        });
+                    }
                     const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
                     PopsHandler.handleInit($shadowRoot, [
                         {
@@ -8817,7 +8888,7 @@ System.register('pops', [], (function (exports) {
                              * 监听输入框内容改变
                              */
                             onValueChange() {
-                                popsDOMUtils.on(this.$el.input, ["input", "propertychange"], void 0, (event) => {
+                                popsDOMUtils.on(this.$el.input, ["input", "propertychange"], (event) => {
                                     this.$data.value = this.$el.input.value;
                                     if (inputType !== "password") {
                                         // 不是密码框
@@ -9190,7 +9261,7 @@ System.register('pops', [], (function (exports) {
                                  * 监听点击事件
                                  */
                                 onClick() {
-                                    popsDOMUtils.on(this.$el.$select, "click", void 0, (event) => {
+                                    popsDOMUtils.on(this.$el.$select, "click", (event) => {
                                         this.setSelectOptionsDisableStatus();
                                         if (typeof viewConfig.clickCallBack === "function") {
                                             const $isSelectedElement = this.$el.$select[this.$el.$select.selectedIndex];
@@ -10957,7 +11028,7 @@ System.register('pops', [], (function (exports) {
                              * 设置按钮的点击事件
                              */
                             onButtonClick() {
-                                popsDOMUtils.on(this.$ele.button, "click", void 0, (event) => {
+                                popsDOMUtils.on(this.$ele.button, "click", (event) => {
                                     if (typeof viewConfig.callback === "function") {
                                         viewConfig.callback(event);
                                     }
@@ -11026,13 +11097,13 @@ System.register('pops', [], (function (exports) {
                             initContainerItem($container, formItemConfig) {
                                 const containerViewConfig = formItemConfig;
                                 if (containerViewConfig.type === "container") {
-                                    const childForms = containerViewConfig["views"];
+                                    const childViewConfig = containerViewConfig["views"];
                                     // 每一项<li>元素
-                                    const formContainerListElement = popsDOMUtils.createElement("li");
+                                    const $itemLi = popsDOMUtils.createElement("li");
                                     // 每一项<li>内的子<ul>元素
-                                    const formContainerULElement = popsDOMUtils.createElement("ul");
-                                    formContainerULElement.classList.add("pops-panel-forms-container-item-formlist");
-                                    formContainerListElement.classList.add("pops-panel-forms-container-item");
+                                    const $itemUL = popsDOMUtils.createElement("ul");
+                                    $itemUL.classList.add("pops-panel-forms-container-item-formlist");
+                                    $itemLi.classList.add("pops-panel-forms-container-item");
                                     // 区域头部的文字
                                     const formHeaderDivElement = popsDOMUtils.createElement("div", {
                                         className: "pops-panel-forms-container-item-header-text",
@@ -11052,42 +11123,42 @@ System.register('pops', [], (function (exports) {
 							`);
                                         // 添加点击事件
                                         popsDOMUtils.on(formHeaderDivElement, "click", () => {
-                                            if (formContainerListElement.hasAttribute("data-fold-enable")) {
-                                                formContainerListElement.removeAttribute("data-fold-enable");
+                                            if ($itemLi.hasAttribute("data-fold-enable")) {
+                                                $itemLi.removeAttribute("data-fold-enable");
                                             }
                                             else {
-                                                formContainerListElement.setAttribute("data-fold-enable", "");
+                                                $itemLi.setAttribute("data-fold-enable", "");
                                             }
                                         });
                                         popsDOMUtils.addClassName(formHeaderDivElement, "pops-panel-forms-fold-container");
                                         popsDOMUtils.addClassName(formHeaderDivElement, PopsCommonCSSClassName.userSelectNone);
-                                        formContainerListElement.setAttribute("data-fold-enable", "");
+                                        $itemLi.setAttribute("data-fold-enable", "");
                                         popsDOMUtils.addClassName(formHeaderDivElement, "pops-panel-forms-fold");
-                                        formContainerListElement.appendChild(formHeaderDivElement);
+                                        $itemLi.appendChild(formHeaderDivElement);
                                     }
                                     else {
                                         // 加进容器内
-                                        formContainerListElement.appendChild(formHeaderDivElement);
+                                        $itemLi.appendChild(formHeaderDivElement);
                                     }
-                                    that.setElementClassName(formContainerListElement, formItemConfig.className);
-                                    that.setElementAttributes(formContainerListElement, formItemConfig.attributes);
-                                    that.setElementProps(formContainerListElement, formItemConfig.props);
-                                    childForms.forEach((childViewConfig) => {
+                                    that.setElementClassName($itemLi, formItemConfig.className);
+                                    that.setElementAttributes($itemLi, formItemConfig.attributes);
+                                    that.setElementProps($itemLi, formItemConfig.props);
+                                    $itemLi.appendChild($itemUL);
+                                    $container.appendChild($itemLi);
+                                    childViewConfig.forEach((childViewConfig) => {
                                         that.uListContainerAddItem(childViewConfig, {
-                                            ulElement: formContainerULElement,
+                                            ulElement: $itemUL,
                                             sectionContainerULElement: that.sectionContainerULElement,
-                                            formContainerListElement: formContainerListElement,
+                                            formContainerListElement: $itemLi,
                                             formHeaderDivElement: formHeaderDivElement,
                                         });
                                     });
-                                    formContainerListElement.appendChild(formContainerULElement);
-                                    $container.appendChild(formContainerListElement);
                                     if (typeof containerViewConfig.afterAddToUListCallBack === "function") {
                                         containerViewConfig.afterAddToUListCallBack(viewConfig, {
-                                            target: formContainerListElement,
-                                            ulElement: formContainerULElement,
+                                            target: $itemLi,
+                                            ulElement: $itemUL,
                                             sectionContainerULElement: that.sectionContainerULElement,
-                                            formContainerListElement: formContainerListElement,
+                                            formContainerListElement: $itemLi,
                                             formHeaderDivElement: formHeaderDivElement,
                                         });
                                     }
@@ -11226,7 +11297,7 @@ System.register('pops', [], (function (exports) {
                             },
                             /** 设置项的点击事件 */
                             onLiClick() {
-                                popsDOMUtils.on($li, "click", void 0, async (event) => {
+                                popsDOMUtils.on($li, "click", async (event) => {
                                     if (typeof viewConfig.clickCallBack === "function") {
                                         const result = await viewConfig.clickCallBack(event, viewConfig);
                                         if (result) {
@@ -11554,6 +11625,7 @@ System.register('pops', [], (function (exports) {
                     }
                     // 处理返回的配置
                     const evtConfig = PopsHandler.handleEventConfig(config, guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask);
+                    const result = PopsHandler.handleResultConfig(evtConfig);
                     // 为顶部右边的关闭按钮添加点击事件
                     PopsHandler.handleClickEvent("close", $headerBtnClose, evtConfig, config.btn?.close?.callback);
                     // 创建到页面中
@@ -11591,6 +11663,8 @@ System.register('pops', [], (function (exports) {
                         $mask: $mask,
                         $shadowContainer: $shadowContainer,
                         $shadowRoot: $shadowRoot,
+                        config: config,
+                        destory: result.close,
                     });
                     // 拖拽
                     if (config.drag) {
@@ -11602,7 +11676,6 @@ System.register('pops', [], (function (exports) {
                             endCallBack: config.dragEndCallBack,
                         });
                     }
-                    const result = PopsHandler.handleResultConfig(evtConfig);
                     return {
                         ...result,
                         addEventListener: (event, listener, options) => {
@@ -11794,6 +11867,7 @@ System.register('pops', [], (function (exports) {
                         $elList.push($mask);
                     }
                     const evtConfig = PopsHandler.handleEventConfig(config, guid, $shadowContainer, $shadowRoot, popsType, $anim, $pops, $mask);
+                    const result = PopsHandler.handleResultConfig(evtConfig);
                     // 输入框赋值初始值
                     $input.value = config.content.text;
                     PopsHandler.handlePromptClickEvent("close", $input, $btnClose, evtConfig, config.btn.close.callback);
@@ -11816,6 +11890,8 @@ System.register('pops', [], (function (exports) {
                         $mask: $mask,
                         $shadowContainer: $shadowContainer,
                         $shadowRoot: $shadowRoot,
+                        config: config,
+                        destory: result.close,
                     });
                     // 拖拽
                     if (config.drag) {
@@ -11835,7 +11911,6 @@ System.register('pops', [], (function (exports) {
                     if (config.content.select) {
                         $input.select();
                     }
-                    const result = PopsHandler.handleResultConfig(evtConfig);
                     return result;
                 },
             };
@@ -11937,6 +12012,7 @@ System.register('pops', [], (function (exports) {
                     beforeAppendToPageCallBack() { },
                     limitPositionXInView: true,
                     limitPositionYInView: true,
+                    beforeShowCallBack() { },
                 };
             };
 
@@ -11996,6 +12072,8 @@ System.register('pops', [], (function (exports) {
                                 return;
                             }
                             if ($click.className && $click.className === "pops-shadow-container" && $click.shadowRoot != null) {
+                                // pops的shadow-container
+                                PopsContextMenu.shadowRootCheckClickEvent(event);
                                 return;
                             }
                             PopsContextMenu.closeAllMenu(PopsContextMenu.$el.$root);
@@ -12008,7 +12086,7 @@ System.register('pops', [], (function (exports) {
                             if (!PopsContextMenu.$el.$root) {
                                 return;
                             }
-                            const $click = event.target;
+                            const $click = event.composedPath()[0];
                             if ($click.closest(`.pops-${popsType}`)) {
                                 return;
                             }
@@ -12018,13 +12096,13 @@ System.register('pops', [], (function (exports) {
                          * 添加全局点击检测事件
                          */
                         addWindowCheckClickListener() {
-                            popsDOMUtils.on(globalThis, "click touchstart", void 0, PopsContextMenu.windowCheckClickEvent, {
+                            popsDOMUtils.on(globalThis, "click touchstart", PopsContextMenu.windowCheckClickEvent, {
                                 capture: true,
                             });
                             if (config.$target instanceof Node) {
                                 const $shadowRoot = config.$target.getRootNode();
                                 if ($shadowRoot instanceof ShadowRoot) {
-                                    popsDOMUtils.on($shadowRoot, "click touchstart", void 0, PopsContextMenu.shadowRootCheckClickEvent, {
+                                    popsDOMUtils.on($shadowRoot, "click touchstart", PopsContextMenu.shadowRootCheckClickEvent, {
                                         capture: true,
                                     });
                                 }
@@ -12034,13 +12112,13 @@ System.register('pops', [], (function (exports) {
                          * 移除全局点击检测事件
                          */
                         removeWindowCheckClickListener() {
-                            popsDOMUtils.off(globalThis, "click touchstart", void 0, PopsContextMenu.windowCheckClickEvent, {
+                            popsDOMUtils.off(globalThis, "click touchstart", PopsContextMenu.windowCheckClickEvent, {
                                 capture: true,
                             });
                             if (config.$target instanceof Node) {
                                 const $shadowRoot = config.$target.getRootNode();
                                 if ($shadowRoot instanceof ShadowRoot) {
-                                    popsDOMUtils.off($shadowRoot, "click touchstart", void 0, PopsContextMenu.windowCheckClickEvent, {
+                                    popsDOMUtils.off($shadowRoot, "click touchstart", PopsContextMenu.windowCheckClickEvent, {
                                         capture: true,
                                     });
                                 }
@@ -12051,7 +12129,7 @@ System.register('pops', [], (function (exports) {
                          * @param event
                          * @param selectorTarget
                          */
-                        contextMenuEvent(event, selectorTarget) {
+                        async contextMenuEvent(event, selectorTarget) {
                             if (config.preventDefault) {
                                 popsDOMUtils.preventEvent(event);
                             }
@@ -12060,6 +12138,10 @@ System.register('pops', [], (function (exports) {
                                 PopsContextMenu.closeAllMenu(PopsContextMenu.$el.$root);
                             }
                             selectorTarget = selectorTarget ?? config.$target;
+                            const beforeShowCallBackResult = await config?.beforeShowCallBack(event);
+                            if (typeof beforeShowCallBackResult === "boolean" && !beforeShowCallBackResult) {
+                                return;
+                            }
                             const rootElement = PopsContextMenu.showMenu(event, config.data, selectorTarget);
                             PopsContextMenu.$el.$root = rootElement;
                             if (config.only) {
@@ -12072,6 +12154,10 @@ System.register('pops', [], (function (exports) {
                                     beforeRemoveCallBack(instCommonConfig) {
                                         PopsContextMenu.closeAllMenu(instCommonConfig.$pops);
                                     },
+                                    config: config,
+                                    destory: () => {
+                                        PopsContextMenu.closeAllMenu(rootElement);
+                                    },
                                 });
                             }
                         },
@@ -12375,7 +12461,8 @@ System.register('pops', [], (function (exports) {
                                     menuLiElement.appendChild(iconElement);
                                 }
                                 // 插入文字
-                                menuLiElement.insertAdjacentHTML("beforeend", PopsSafeUtils.getSafeHTML(`<span>${item.text}</span>`));
+                                const text = typeof item.text === "function" ? item.text() : item.text;
+                                menuLiElement.insertAdjacentHTML("beforeend", PopsSafeUtils.getSafeHTML(`<span>${text}</span>`));
                                 // 如果存在子数据，显示
                                 if (item.item && Array.isArray(item.item)) {
                                     popsDOMUtils.addClassName(menuLiElement, `pops-${popsType}-item`);
@@ -13014,10 +13101,10 @@ System.register('pops', [], (function (exports) {
                         setShowEvent(option = defaultListenerOption) {
                             /* 焦点|点击事件*/
                             if (config.followPosition === "target") {
-                                popsDOMUtils.on([config.$target], ["focus", "click"], void 0, SearchSuggestion.showEvent, option);
+                                popsDOMUtils.on([config.$target], ["focus", "click"], SearchSuggestion.showEvent, option);
                             }
                             else if (config.followPosition === "input") {
-                                popsDOMUtils.on([config.$inputTarget], ["focus", "click"], void 0, SearchSuggestion.showEvent, option);
+                                popsDOMUtils.on([config.$inputTarget], ["focus", "click"], SearchSuggestion.showEvent, option);
                             }
                             else if (config.followPosition === "inputCursor") {
                                 popsDOMUtils.on([config.$inputTarget], ["focus", "click", "input"], SearchSuggestion.showEvent, option);
@@ -13031,9 +13118,9 @@ System.register('pops', [], (function (exports) {
                          */
                         removeShowEvent(option = defaultListenerOption) {
                             /* 焦点|点击事件*/
-                            popsDOMUtils.off([config.$target, config.$inputTarget], ["focus", "click"], void 0, SearchSuggestion.showEvent, option);
+                            popsDOMUtils.off([config.$target, config.$inputTarget], ["focus", "click"], SearchSuggestion.showEvent, option);
                             // 内容改变事件
-                            popsDOMUtils.off([config.$inputTarget], ["input"], void 0, SearchSuggestion.showEvent, option);
+                            popsDOMUtils.off([config.$inputTarget], ["input"], SearchSuggestion.showEvent, option);
                         },
                         /**
                          * 隐藏搜索建议框的事件
@@ -13064,7 +13151,7 @@ System.register('pops', [], (function (exports) {
                             // 全局触摸屏点击事件
                             if (Array.isArray(SearchSuggestion.selfDocument)) {
                                 SearchSuggestion.selfDocument.forEach(($checkParent) => {
-                                    popsDOMUtils.on($checkParent, ["click", "touchstart"], void 0, SearchSuggestion.hideEvent, option);
+                                    popsDOMUtils.on($checkParent, ["click", "touchstart"], SearchSuggestion.hideEvent, option);
                                 });
                             }
                             else {
@@ -13077,11 +13164,11 @@ System.register('pops', [], (function (exports) {
                         removeHideEvent(option = defaultListenerOption) {
                             if (Array.isArray(SearchSuggestion.selfDocument)) {
                                 SearchSuggestion.selfDocument.forEach(($checkParent) => {
-                                    popsDOMUtils.off($checkParent, ["click", "touchstart"], void 0, SearchSuggestion.hideEvent, option);
+                                    popsDOMUtils.off($checkParent, ["click", "touchstart"], SearchSuggestion.hideEvent, option);
                                 });
                             }
                             else {
-                                popsDOMUtils.off(SearchSuggestion.selfDocument, ["click", "touchstart"], void 0, SearchSuggestion.hideEvent, option);
+                                popsDOMUtils.off(SearchSuggestion.selfDocument, ["click", "touchstart"], SearchSuggestion.hideEvent, option);
                             }
                         },
                         /**
@@ -13342,7 +13429,7 @@ System.register('pops', [], (function (exports) {
                 },
             };
 
-            const version = "3.1.2";
+            const version = "3.2.0";
 
             class Pops {
                 /** 配置 */