@whitesev/pops 1.0.0

package/dist/index.amd.js

@@ -0,0 +1,4651 @@
+define((function () { 'use strict';
+
+    const PopsCoreDefaultEnv = {
+        document: document,
+        window: window,
+        globalThis: globalThis,
+        self: self,
+    };
+    const PopsCoreEnv = {
+        document: document,
+        window: window,
+        globalThis: globalThis,
+        self: self,
+    };
+    const PopsCore = {
+        init(option) {
+            if (!option) {
+                option = Object.assign({}, PopsCoreDefaultEnv);
+            }
+            Object.assign(PopsCoreEnv, option);
+        },
+        get document() {
+            return PopsCoreEnv.document;
+        },
+        get window() {
+            return PopsCoreEnv.window;
+        },
+        get globalThis() {
+            return PopsCoreEnv.globalThis;
+        },
+        get self() {
+            return PopsCoreEnv.self;
+        },
+    };
+    const OriginPrototype$1 = {
+        Object: {
+            defineProperty: Object.defineProperty,
+        },
+    };
+
+    const SymbolEvents = Symbol("events_" + (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1));
+
+    // @ts-nocheck
+
+    const AnyTouch = function () {
+    	return (function (global, factory) {
+    		return factory();
+    	})(globalThis || window, function () {
+
+    		/*! *****************************************************************************
+    			Copyright (c) Microsoft Corporation.
+    		
+    			Permission to use, copy, modify, and/or distribute this software for any
+    			purpose with or without fee is hereby granted.
+    		
+    			THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+    			REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+    			AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+    			INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+    			LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+    			OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+    			PERFORMANCE OF THIS SOFTWARE.
+    			***************************************************************************** */
+    		/* global Reflect, Promise */
+
+    		var extendStatics = function (d, b) {
+    			extendStatics =
+    				Object.setPrototypeOf ||
+    				({ __proto__: [] } instanceof Array &&
+    					function (d, b) {
+    						d.__proto__ = b;
+    					}) ||
+    				function (d, b) {
+    					for (var p in b) if (Object.hasOwnProperty.call(b, p)) d[p] = b[p];
+    				};
+    			return extendStatics(d, b);
+    		};
+
+    		function __extends(d, b) {
+    			if (typeof b !== "function" && b !== null)
+    				throw new TypeError(
+    					"Class extends value " + String(b) + " is not a constructor or null"
+    				);
+    			extendStatics(d, b);
+    			function __() {
+    				this.constructor = d;
+    			}
+    			d.prototype =
+    				b === null
+    					? Object.create(b)
+    					: ((__.prototype = b.prototype), new __());
+    		}
+
+    		var __assign = function () {
+    			__assign =
+    				Object.assign ||
+    				function __assign(t) {
+    					for (var s, i = 1, n = arguments.length; i < n; i++) {
+    						s = arguments[i];
+    						for (var p in s) if (Object.hasOwnProperty.call(s, p)) t[p] = s[p];
+    					}
+    					return t;
+    				};
+
+    			return __assign.apply(this, arguments);
+    		};
+
+    		function __values(o) {
+    			var s = typeof Symbol === "function" && Symbol.iterator,
+    				m = s && o[s],
+    				i = 0;
+    			if (m) return m.call(o);
+    			if (o && typeof o.length === "number")
+    				return {
+    					next: function () {
+    						if (o && i >= o.length) o = void 0;
+    						return { value: o && o[i++], done: !o };
+    					},
+    				};
+    			throw new TypeError(
+    				s ? "Object is not iterable." : "Symbol.iterator is not defined."
+    			);
+    		}
+
+    		var AnyEvent = (function () {
+    			function AnyEvent() {
+    				this.__map = {};
+    			}
+
+    			AnyEvent.prototype.beforeEach = function (interceptor) {
+    				this.__interceptor = interceptor;
+    			};
+
+    			AnyEvent.prototype.on = function (typeOrTypes, listener) {
+    				var e_1, _a;
+    				var types = Array.isArray(typeOrTypes) ? typeOrTypes : [typeOrTypes];
+    				try {
+    					for (
+    						var types_1 = __values(types), types_1_1 = types_1.next();
+    						!types_1_1.done;
+    						types_1_1 = types_1.next()
+    					) {
+    						var type = types_1_1.value;
+
+    						this.__map[type] = this.__map[type] || [];
+
+    						var listeners = this.__map[type];
+    						if (listeners) {
+    							listeners.push(listener);
+    						}
+    					}
+    				} catch (e_1_1) {
+    					e_1 = { error: e_1_1 };
+    				} finally {
+    					try {
+    						if (types_1_1 && !types_1_1.done && (_a = types_1.return))
+    							_a.call(types_1);
+    					} finally {
+    						if (e_1) throw e_1.error;
+    					}
+    				}
+    				return this;
+    			};
+
+    			AnyEvent.prototype.emit = function (type, payload, callback) {
+    				var _this = this;
+    				if (void 0 !== this.__interceptor) {
+    					this.__interceptor(type, function () {
+    						_this.__emit(type, payload);
+    						callback && callback();
+    					});
+    				} else {
+    					this.__emit(type, payload);
+    					callback && callback();
+    				}
+    			};
+
+    			AnyEvent.prototype.__emit = function (type, event) {
+    				var e_2, _a;
+
+    				var listeners = this.__map[type];
+    				if (
+    					Array.isArray(listeners) &&
+    					(listeners === null || listeners === void 0
+    						? void 0
+    						: listeners.length)
+    				) {
+    					try {
+    						for (
+    							var listeners_1 = __values(listeners),
+    								listeners_1_1 = listeners_1.next();
+    							!listeners_1_1.done;
+    							listeners_1_1 = listeners_1.next()
+    						) {
+    							var listener = listeners_1_1.value;
+    							listener(event, type);
+    						}
+    					} catch (e_2_1) {
+    						e_2 = { error: e_2_1 };
+    					} finally {
+    						try {
+    							if (
+    								listeners_1_1 &&
+    								!listeners_1_1.done &&
+    								(_a = listeners_1.return)
+    							)
+    								_a.call(listeners_1);
+    						} finally {
+    							if (e_2) throw e_2.error;
+    						}
+    					}
+    				}
+    				this.event = event;
+    			};
+
+    			AnyEvent.prototype.off = function (type, listener) {
+    				var listeners = this.__map[type];
+    				if (void 0 !== listeners) {
+    					if (void 0 === listener) {
+    						delete this.__map[type];
+    					} else {
+    						var index = listeners.findIndex(function (cb) {
+    							return cb === listener;
+    						});
+    						listeners.splice(index, 1);
+    					}
+    				}
+    			};
+    			AnyEvent.prototype.destroy = function () {
+    				this.__map = {};
+    			};
+    			return AnyEvent;
+    		})();
+
+    		var TOUCH_START = "touchstart";
+    		var TOUCH_MOVE = "touchmove";
+    		var TOUCH_END = "touchend";
+    		var TOUCH_CANCEL = "touchcancel";
+    		var MOUSE_UP = "mouseup";
+    		var MOUSE_MOVE = "mousemove";
+    		var MOUSE_DOWN = "mousedown";
+    		var TYPE_START$1 = "start";
+    		var TYPE_MOVE$1 = "move";
+    		var TYPE_END$1 = "end";
+
+    		function isFunction(input) {
+    			return "[object Function]" === Object.prototype.toString.call(input);
+    		}
+
+    		var CLIENT_X = "clientX";
+    		var CLIENT_Y = "clientY";
+    		var COMPUTE_INTERVAL = 16;
+    		var TYPE_START = "start";
+    		var TYPE_MOVE = "move";
+    		var TYPE_CANCEL = "cancel";
+    		var TYPE_END = "end";
+    		var DIRECTION_LEFT = "left";
+    		var DIRECTION_RIGHT = "right";
+    		var DIRECTION_UP = "up";
+    		var DIRECTION_DOWN = "down";
+
+    		var _a;
+    		var STATUS_CODE_AND_NAME_MAP =
+    			((_a = {}),
+    			(_a[4] = TYPE_START),
+    			(_a[5] = TYPE_MOVE),
+    			(_a[1] = TYPE_END),
+    			(_a[3] = TYPE_CANCEL),
+    			_a);
+
+    		function getStatusName(code) {
+    			return STATUS_CODE_AND_NAME_MAP[code];
+    		}
+
+    		function flow(isVaild, lastStatus, phase) {
+    			var _a, _b, _c, _d, _e, _f, _g;
+    			var STATE_MAP = {
+    				1:
+    					((_a = {}),
+    					(_a[0] = ((_b = {}), (_b[TYPE_MOVE] = 4), _b)),
+    					(_a[4] =
+    						((_c = {}),
+    						(_c[TYPE_MOVE] = 5),
+    						(_c[TYPE_END] = 1),
+    						(_c[TYPE_CANCEL] = 3),
+    						_c)),
+    					(_a[5] =
+    						((_d = {}),
+    						(_d[TYPE_MOVE] = 5),
+    						(_d[TYPE_END] = 1),
+    						(_d[TYPE_CANCEL] = 3),
+    						_d)),
+    					_a),
+    				0:
+    					((_e = {}),
+    					(_e[4] =
+    						((_f = {}),
+    						(_f[TYPE_MOVE] = 2),
+    						(_f[TYPE_END] = 1),
+    						(_f[TYPE_CANCEL] = 3),
+    						_f)),
+    					(_e[5] =
+    						((_g = {}),
+    						(_g[TYPE_START] = 2),
+    						(_g[TYPE_MOVE] = 2),
+    						(_g[TYPE_END] = 1),
+    						(_g[TYPE_CANCEL] = 3),
+    						_g)),
+    					_e),
+    			};
+
+    			var map = STATE_MAP[Number(isVaild)][lastStatus];
+    			return (void 0 !== map && map[phase]) || 0;
+    		}
+
+    		function resetState(context) {
+    			if ([1, 3, 2].includes(context.state)) {
+    				context.state = 0;
+    			}
+    		}
+
+    		function isMoveOrEndOrCancel(state) {
+    			return [5, 1, 3].includes(state);
+    		}
+
+    		function isDisabled(context) {
+    			if (context.disabled) {
+    				context.state = 0;
+    				return true;
+    			}
+    		}
+
+    		function createPluginContext(defaultOptions, options) {
+    			return __assign(__assign(__assign({}, defaultOptions), options), {
+    				state: 0,
+    				disabled: false,
+    			});
+    		}
+
+    		function round2(n) {
+    			return Math.round(n * 100) / 100;
+    		}
+
+    		function inputCreator() {
+    			var id = 0;
+    			var prevInput;
+
+    			var activeInput;
+
+    			var startInput;
+
+    			var startMultiInput;
+
+    			return function (basicsInput) {
+    				prevInput = activeInput;
+    				if (void 0 !== basicsInput) {
+    					id = Number.MAX_SAFE_INTEGER > id ? ++id : 1;
+    					var pureInput = extendInput(basicsInput, id);
+    					activeInput = pureInput;
+    					var isStart = pureInput.isStart,
+    						pointLength = pureInput.pointLength;
+    					if (isStart) {
+    						startInput = pureInput;
+    						prevInput = void 0;
+    						if (1 < pointLength) {
+    							startMultiInput = pureInput;
+    						} else {
+    							startMultiInput = void 0;
+    						}
+    					}
+    					return __assign(__assign({}, pureInput), {
+    						prevInput: prevInput,
+
+    						startMultiInput: startMultiInput,
+
+    						startInput: startInput,
+    					});
+    				}
+    			};
+    		}
+
+    		function getCenter(points) {
+    			var length = points.length;
+    			if (0 < length) {
+    				if (1 === length) {
+    					var _a = points[0],
+    						clientX = _a.clientX,
+    						clientY = _a.clientY;
+    					return { x: Math.round(clientX), y: Math.round(clientY) };
+    				}
+    				var countPoint = points.reduce(
+    					function (countPoint, point) {
+    						countPoint.x += point[CLIENT_X];
+    						countPoint.y += point[CLIENT_Y];
+    						return countPoint;
+    					},
+    					{ x: 0, y: 0 }
+    				);
+    				return {
+    					x: Math.round(countPoint.x / length),
+    					y: Math.round(countPoint.y / length),
+    				};
+    			}
+    		}
+
+    		function extendInput(basicsInput, id) {
+    			var phase = basicsInput.phase,
+    				points = basicsInput.points,
+    				changedPoints = basicsInput.changedPoints,
+    				nativeEvent = basicsInput.nativeEvent;
+    			var pointLength = points.length;
+    			var isStart = TYPE_START === phase;
+    			var isEnd =
+    				(TYPE_END === phase && 0 === pointLength) || TYPE_CANCEL === phase;
+    			var timestamp = Date.now();
+    			var _a = getCenter(points) || getCenter(changedPoints),
+    				x = _a.x,
+    				y = _a.y;
+    			var currentTarget = nativeEvent.currentTarget;
+    			return Object.assign(basicsInput, {
+    				id: id,
+    				x: x,
+    				y: y,
+    				timestamp: timestamp,
+    				isStart: isStart,
+    				isEnd: isEnd,
+    				pointLength: pointLength,
+    				currentTarget: currentTarget,
+
+    				getOffset: function (el) {
+    					if (el === void 0) {
+    						el = currentTarget;
+    					}
+    					var rect = el.getBoundingClientRect();
+    					return {
+    						x: x - Math.round(rect.left),
+    						y: y - Math.round(rect.top),
+    					};
+    				},
+    			});
+    		}
+
+    		function mouse() {
+    			var prevPoints;
+    			var isPressed = false;
+
+    			var _target = null;
+    			var createInput = inputCreator();
+
+    			return function (event) {
+    				var clientX = event.clientX,
+    					clientY = event.clientY,
+    					type = event.type,
+    					button = event.button,
+    					target = event.target;
+    				var points = [{ clientX: clientX, clientY: clientY, target: target }];
+    				var phase;
+    				if (MOUSE_DOWN === type && 0 === button) {
+    					_target = target;
+    					isPressed = true;
+    					phase = TYPE_START$1;
+    				} else if (isPressed) {
+    					if (MOUSE_MOVE === type) {
+    						phase = TYPE_MOVE$1;
+    					} else if (MOUSE_UP === type) {
+    						points = [];
+    						phase = TYPE_END$1;
+    						isPressed = false;
+    					}
+    				} else {
+    					return;
+    				}
+
+    				var changedPoints = prevPoints || [
+    					{ clientX: clientX, clientY: clientY, target: target },
+    				];
+    				prevPoints = [{ clientX: clientX, clientY: clientY, target: target }];
+    				if (void 0 !== phase) {
+    					return createInput({
+    						phase: phase,
+    						changedPoints: changedPoints,
+    						points: points,
+
+    						target: _target,
+
+    						targets: [_target],
+    						nativeEvent: event,
+    					});
+    				}
+    			};
+    		}
+
+    		function touch(el) {
+    			var createInput = inputCreator();
+
+    			return function (event) {
+    				var targets = [];
+
+    				var points = [];
+    				Array.from(event.touches).forEach(function (_a) {
+    					var clientX = _a.clientX,
+    						clientY = _a.clientY,
+    						target = _a.target;
+    					if (el === null || el === void 0 ? void 0 : el.contains(target)) {
+    						targets.push(target);
+    						points.push({
+    							clientX: clientX,
+    							clientY: clientY,
+    							target: target,
+    						});
+    					}
+    				});
+    				var changedPoints = Array.from(event.changedTouches).map(function (_a) {
+    					var clientX = _a.clientX,
+    						clientY = _a.clientY,
+    						target = _a.target;
+    					return { clientX: clientX, clientY: clientY, target: target };
+    				});
+    				return createInput({
+    					phase: event.type.replace("touch", ""),
+    					changedPoints: changedPoints,
+
+    					points: points,
+    					nativeEvent: event,
+    					target: event.target,
+
+    					targets: targets,
+    				});
+    			};
+    		}
+
+    		function dispatchDomEvent(typeName, el, payload, eventInit) {
+    			var data = {};
+    			for (var key in payload) {
+    				if (!["target", "currentTarget", "type"].includes(key)) {
+    					data[key] = payload[key];
+    				}
+    			}
+
+    			var event;
+    			if (document.createEvent) {
+    				event = document.createEvent("HTMLEvents");
+    				event.initEvent(
+    					typeName,
+    					eventInit === null || eventInit === void 0
+    						? void 0
+    						: eventInit.bubbles,
+    					eventInit === null || eventInit === void 0
+    						? void 0
+    						: eventInit.cancelable
+    				);
+    			} else {
+    				event = new Event(typeName, eventInit);
+    			}
+    			Object.assign(event, data, {
+    				match: function () {
+    					return (
+    						payload.targets &&
+    						0 < payload.targets.length &&
+    						payload.targets.every(function (target) {
+    							return event.currentTarget.contains(target);
+    						})
+    					);
+    				},
+    			});
+    			return el.dispatchEvent(event);
+    		}
+
+    		function canPreventDefault(event, options) {
+    			var preventDefault = options.preventDefault;
+    			if (isFunction(preventDefault)) {
+    				return preventDefault(event);
+    			} else {
+    				return !!preventDefault;
+    			}
+    		}
+
+    		var ELEMENT_TYPES = [
+    			TOUCH_START,
+    			TOUCH_MOVE,
+    			TOUCH_END,
+    			TOUCH_CANCEL,
+    			MOUSE_DOWN,
+    		];
+    		var WINDOW_TYPES = [MOUSE_MOVE, MOUSE_UP];
+
+    		function bindElement(el, catchEvent, options) {
+    			ELEMENT_TYPES.forEach(function (type) {
+    				el.addEventListener(type, catchEvent, options);
+    			});
+    			WINDOW_TYPES.forEach(function (type) {
+    				window.addEventListener(type, catchEvent, options);
+    			});
+    			return function () {
+    				ELEMENT_TYPES.forEach(function (types) {
+    					el.removeEventListener(types, catchEvent);
+    				});
+    				WINDOW_TYPES.forEach(function (type) {
+    					window.removeEventListener(type, catchEvent);
+    				});
+    			};
+    		}
+
+    		var TYPE_COMPUTED = "computed";
+    		var DEFAULT_OPTIONS$6 = {
+    			domEvents: { bubbles: true, cancelable: true },
+
+    			preventDefault: function (event) {
+    				if (event.target && "tagName" in event.target) {
+    					var tagName = event.target.tagName;
+    					return !/^(?:INPUT|TEXTAREA|BUTTON|SELECT)$/.test(tagName);
+    				}
+    				return false;
+    			},
+    		};
+    		var TYPE_UNBIND = "u";
+    		var TYPE_INPUT = "input";
+    		var TYPE_AT_AFTER = "at:after";
+    		var default_1$1 = (function (_super) {
+    			__extends(default_1, _super);
+
+    			function default_1(el, options) {
+    				var _a;
+
+    				var _this = _super.call(this) || this;
+
+    				_this.v = "2.1.3";
+
+    				_this.__computeFunctionList = [];
+
+    				_this.__computeFunctionCreatorList = [];
+
+    				_this.__pluginContexts = [];
+    				_this.__isIgnoreMouse = false;
+
+    				_this.el = el;
+    				_this.c = {};
+    				_this.__options = __assign(__assign({}, DEFAULT_OPTIONS$6), options);
+
+    				var createInputFromTouch = touch(_this.el);
+    				var createInputFromMouse = mouse();
+
+    				_this.__inputCreatorMap =
+    					((_a = {}),
+    					(_a[TOUCH_START] = createInputFromTouch),
+    					(_a[TOUCH_MOVE] = createInputFromTouch),
+    					(_a[TOUCH_END] = createInputFromTouch),
+    					(_a[TOUCH_CANCEL] = createInputFromTouch),
+    					(_a[MOUSE_DOWN] = createInputFromMouse),
+    					(_a[MOUSE_MOVE] = createInputFromMouse),
+    					(_a[MOUSE_UP] = createInputFromMouse),
+    					_a);
+
+    				_this.on(TYPE_AT_AFTER, function (payload) {
+    					var target = payload.target,
+    						__type = payload.__type;
+    					var domEvents = _this.__options.domEvents;
+
+    					if (!!domEvents && void 0 !== _this.el && !!target) {
+    						dispatchDomEvent(__type, target, payload, domEvents);
+    						dispatchDomEvent(TYPE_AT_AFTER, target, payload, domEvents);
+    					}
+    				});
+    				if (void 0 !== el) {
+    					el.style.webkitTapHighlightColor = "rgba(0,0,0,0)";
+    					var supportsPassive_1 = false;
+    					try {
+    						var opts = {};
+    						OriginPrototype.Object.defineProperty(opts, "passive", {
+    							get: function () {
+    								supportsPassive_1 = true;
+    							},
+    						});
+    						window.addEventListener(
+    							"_",
+    							function () {
+    								return void 0;
+    							},
+    							opts
+    						);
+    					} catch (_b) {}
+
+    					_this.on(
+    						TYPE_UNBIND,
+    						bindElement(
+    							el,
+    							_this.catchEvent.bind(_this),
+    							false === _this.__options.preventDefault && supportsPassive_1
+    								? { passive: true }
+    								: { passive: false }
+    						)
+    					);
+    				}
+    				return _this;
+    			}
+
+    			default_1.prototype.use = function (plugin, pluginOptions) {
+    				this.__pluginContexts.push(plugin(this, pluginOptions));
+    			};
+
+    			default_1.prototype.catchEvent = function (event) {
+    				var input = this.__inputCreatorMap[event.type](event);
+    				if (void 0 !== input) {
+    					var stopPropagation = function () {
+    						return event.stopPropagation();
+    					};
+    					var stopImmediatePropagation = function () {
+    						return event.stopImmediatePropagation();
+    					};
+    					var preventDefault = function () {
+    						return event.preventDefault();
+    					};
+    					if (canPreventDefault(event, this.__options)) {
+    						preventDefault();
+    					} else {
+    						if ("touchstart" === event.type) {
+    							this.__isIgnoreMouse = true;
+    						} else if ("touchmove" === event.type) {
+    							this.__isIgnoreMouse = false;
+    						}
+    						if (this.__isIgnoreMouse && event.type.startsWith("mouse")) {
+    							if ("mouseup" === event.type) {
+    								this.__isIgnoreMouse = false;
+    							}
+    							return;
+    						}
+    					}
+
+    					this.emit(TYPE_INPUT, input);
+    					this.emit2("at:".concat(input.phase), input, {});
+    					var computed_1 = {};
+
+    					this.__computeFunctionList.forEach(function (compute) {
+    						var result = compute(input, computed_1);
+    						if (void 0 !== result) {
+    							for (var key in result) {
+    								computed_1[key] = result[key];
+    							}
+    						}
+    					});
+
+    					this.emit(
+    						TYPE_COMPUTED,
+    						__assign(__assign(__assign({}, input), computed_1), {
+    							stopPropagation: stopPropagation,
+    							stopImmediatePropagation: stopImmediatePropagation,
+    							preventDefault: preventDefault,
+    						})
+    					);
+    				}
+    			};
+    			default_1.prototype.compute = function (
+    				computeFunctionCreatorList,
+
+    				callback
+    			) {
+    				var e_1, _a;
+    				try {
+    					for (
+    						var computeFunctionCreatorList_1 = __values(
+    								computeFunctionCreatorList
+    							),
+    							computeFunctionCreatorList_1_1 =
+    								computeFunctionCreatorList_1.next();
+    						!computeFunctionCreatorList_1_1.done;
+    						computeFunctionCreatorList_1_1 = computeFunctionCreatorList_1.next()
+    					) {
+    						var computeFunctionCreator = computeFunctionCreatorList_1_1.value;
+    						if (
+    							!this.__computeFunctionCreatorList.includes(
+    								computeFunctionCreator
+    							)
+    						) {
+    							this.__computeFunctionCreatorList.push(computeFunctionCreator);
+
+    							this.__computeFunctionList.push(computeFunctionCreator());
+    						}
+    					}
+    				} catch (e_1_1) {
+    					e_1 = { error: e_1_1 };
+    				} finally {
+    					try {
+    						if (
+    							computeFunctionCreatorList_1_1 &&
+    							!computeFunctionCreatorList_1_1.done &&
+    							(_a = computeFunctionCreatorList_1.return)
+    						)
+    							_a.call(computeFunctionCreatorList_1);
+    					} finally {
+    						if (e_1) throw e_1.error;
+    					}
+    				}
+
+    				this.on(TYPE_COMPUTED, callback);
+    			};
+
+    			default_1.prototype.beforeEach = function (interceptor) {
+    				var _this = this;
+
+    				_super.prototype.beforeEach.call(this, function (type, next) {
+    					var _a;
+    					if ((_a = _this.c) === null || _a === void 0 ? void 0 : _a.name) {
+    						interceptor(type, next);
+    					} else {
+    						next();
+    					}
+    				});
+    			};
+
+    			default_1.prototype.get = function (name) {
+    				return this.__pluginContexts.find(function (pluginContext) {
+    					return name === pluginContext.name;
+    				});
+    			};
+
+    			default_1.prototype.set = function (newOptions) {
+    				this.__options = __assign(__assign({}, this.__options), newOptions);
+    			};
+
+    			default_1.prototype.emit2 = function (type, payload, pluginContext) {
+    				var _this = this;
+    				this.c = pluginContext;
+
+    				this.emit(
+    					type,
+    					__assign(__assign({}, payload), { type: type }),
+    					function () {
+    						_this.emit(
+    							TYPE_AT_AFTER,
+    							__assign(__assign({}, payload), { name: type, __type: type })
+    						);
+    					}
+    				);
+    			};
+    			default_1.prototype.destroy = function () {
+    				this.emit(TYPE_UNBIND);
+    				_super.prototype.destroy.call(this);
+    			};
+    			return default_1;
+    		})(AnyEvent);
+
+    		var getVLength = function (v) {
+    			return Math.sqrt(v.x * v.x + v.y * v.y);
+    		};
+
+    		var getDotProduct = function (v1, v2) {
+    			return v1.x * v2.x + v1.y * v2.y;
+    		};
+
+    		var getRadian = function (v1, v2) {
+    			var mr = getVLength(v1) * getVLength(v2);
+    			if (mr === 0) return 0;
+    			var r = getDotProduct(v1, v2) / mr;
+    			if (r > 1) r = 1;
+    			return Math.acos(r);
+    		};
+
+    		var getCross = function (v1, v2) {
+    			return v1.x * v2.y - v2.x * v1.y;
+    		};
+
+    		var radianToAngle = function (radian) {
+    			return (radian / Math.PI) * 180;
+    		};
+
+    		var getAngle = function (v1, v2) {
+    			var angle = getRadian(v1, v2);
+    			if (getCross(v1, v2) > 0) {
+    				angle *= -1;
+    			}
+    			return radianToAngle(angle);
+    		};
+
+    		var getDirection = function (x, y) {
+    			if (0 === x && 0 === y) {
+    				return;
+    			}
+    			if (Math.abs(x) >= Math.abs(y)) {
+    				return 0 < x ? DIRECTION_RIGHT : DIRECTION_LEFT;
+    			} else {
+    				return 0 < y ? DIRECTION_DOWN : DIRECTION_UP;
+    			}
+    		};
+
+    		function ComputeAngle() {
+    			var angle = 0;
+    			var deltaAngle = 0;
+
+    			return function (input, computed) {
+    				var prevVecotr = computed.prevVecotr,
+    					startVecotr = computed.startVecotr,
+    					activeVecotr = computed.activeVecotr;
+    				if (activeVecotr) {
+    					deltaAngle = Math.round(getAngle(activeVecotr, prevVecotr));
+    					angle = Math.round(getAngle(activeVecotr, startVecotr));
+    				}
+    				return { angle: angle, deltaAngle: deltaAngle };
+    			};
+    		}
+
+    		function ComputeDeltaXY() {
+    			return function (input) {
+    				var prevInput = input.prevInput;
+    				var deltaX = 0;
+    				var deltaY = 0;
+    				var deltaXYAngle = 0;
+    				if (void 0 !== prevInput) {
+    					deltaX = input.x - prevInput.x;
+    					deltaY = input.y - prevInput.y;
+    					if (0 !== deltaX || 0 !== deltaY) {
+    						var deltaXY = Math.sqrt(Math.pow(deltaX, 2) + Math.pow(deltaY, 2));
+    						deltaXYAngle = Math.round(
+    							radianToAngle(Math.acos(Math.abs(deltaX) / deltaXY))
+    						);
+    					}
+    				}
+    				return {
+    					deltaX: deltaX,
+    					deltaY: deltaY,
+    					deltaXYAngle: deltaXYAngle,
+    				};
+    			};
+    		}
+
+    		function ComputeDistance() {
+    			var displacementX = 0;
+    			var displacementY = 0;
+    			var distanceX = 0;
+    			var distanceY = 0;
+    			var distance = 0;
+
+    			var overallDirection;
+
+    			return function (input) {
+    				var phase = input.phase,
+    					startInput = input.startInput;
+    				if (TYPE_START === phase) {
+    					displacementX = 0;
+    					displacementY = 0;
+    					distanceX = 0;
+    					distanceY = 0;
+    					distance = 0;
+    				} else if (TYPE_MOVE === phase) {
+    					displacementX = Math.round(
+    						input.points[0][CLIENT_X] - startInput.points[0][CLIENT_X]
+    					);
+    					displacementY = Math.round(
+    						input.points[0][CLIENT_Y] - startInput.points[0][CLIENT_Y]
+    					);
+    					distanceX = Math.abs(displacementX);
+    					distanceY = Math.abs(displacementY);
+    					distance = Math.round(getVLength({ x: distanceX, y: distanceY }));
+    					overallDirection = getDirection(displacementX, displacementY);
+    				}
+    				return {
+    					displacementX: displacementX,
+    					displacementY: displacementY,
+    					distanceX: distanceX,
+    					distanceY: distanceY,
+    					distance: distance,
+
+    					overallDirection: overallDirection,
+    				};
+    			};
+    		}
+
+    		function ComputeScale() {
+    			var scale = 1;
+
+    			return function (input, computed) {
+    				var deltaScale = 1;
+    				var prevVecotr = computed.prevVecotr,
+    					startVecotr = computed.startVecotr,
+    					activeVecotr = computed.activeVecotr;
+    				if (activeVecotr) {
+    					deltaScale = round2(
+    						getVLength(activeVecotr) / getVLength(prevVecotr)
+    					);
+    					scale = round2(getVLength(activeVecotr) / getVLength(startVecotr));
+    				}
+    				return { scale: scale, deltaScale: deltaScale };
+    			};
+    		}
+
+    		function ComputeVAndDir() {
+    			var velocityX = 0;
+    			var velocityY = 0;
+    			var speedX = 0;
+    			var speedY = 0;
+
+    			var direction;
+
+    			var lastValidInput;
+
+    			return function (input) {
+    				if (void 0 !== input) {
+    					lastValidInput = lastValidInput || input.startInput;
+    					var deltaTime = input.timestamp - lastValidInput.timestamp;
+    					if (COMPUTE_INTERVAL < deltaTime) {
+    						var deltaX = input.x - lastValidInput.x;
+    						var deltaY = input.y - lastValidInput.y;
+    						speedX = Math.round((deltaX / deltaTime) * 100) / 100;
+    						speedY = Math.round((deltaY / deltaTime) * 100) / 100;
+    						velocityX = Math.abs(speedX);
+    						velocityY = Math.abs(speedY);
+    						direction = getDirection(deltaX, deltaY);
+    						lastValidInput = input;
+    					}
+    				}
+    				return {
+    					velocityX: velocityX,
+    					velocityY: velocityY,
+    					speedX: speedX,
+    					speedY: speedY,
+
+    					direction: direction,
+    				};
+    			};
+    		}
+
+    		function ComputeMaxLength() {
+    			var maxPointLength = 0;
+
+    			return function (input) {
+    				var phase = input.phase;
+    				if (TYPE_START === phase) {
+    					maxPointLength = input.pointLength;
+    				}
+    				return { maxPointLength: maxPointLength };
+    			};
+    		}
+
+    		function computeVector(input) {
+    			return {
+    				x: input.points[1][CLIENT_X] - input.points[0][CLIENT_X],
+    				y: input.points[1][CLIENT_Y] - input.points[0][CLIENT_Y],
+    			};
+    		}
+    		function ComputeVectorForMutli() {
+    			var startVecotr;
+
+    			var prevVecotr;
+    			var activeVecotr;
+
+    			return function (input) {
+    				var prevInput = input.prevInput,
+    					startMultiInput = input.startMultiInput;
+    				if (
+    					void 0 !== startMultiInput &&
+    					void 0 !== prevInput &&
+    					input.id !== startMultiInput.id &&
+    					1 < prevInput.pointLength &&
+    					1 < input.pointLength
+    				) {
+    					startVecotr = computeVector(startMultiInput);
+    					prevVecotr = computeVector(prevInput);
+    					activeVecotr = computeVector(input);
+    				} else {
+    					activeVecotr = void 0;
+    				}
+    				return {
+    					startVecotr: startVecotr,
+
+    					prevVecotr: prevVecotr,
+    					activeVecotr: activeVecotr,
+    				};
+    			};
+    		}
+
+    		var DEFAULT_OPTIONS$5 = {
+    			name: "tap",
+    			pointLength: 1,
+    			tapTimes: 1,
+    			waitNextTapTime: 300,
+    			maxDistance: 2,
+    			maxDistanceFromPrevTap: 9,
+    			maxPressTime: 250,
+    		};
+
+    		function tap(at, options) {
+    			var context = createPluginContext(DEFAULT_OPTIONS$5, options);
+    			var tapCount = 0;
+
+    			var prevTapPoint;
+
+    			var prevTapTime;
+
+    			var countDownToFailTimer;
+    			function reset() {
+    				tapCount = 0;
+    				prevTapPoint = void 0;
+    				prevTapTime = void 0;
+    			}
+    			function countDownToFail() {
+    				countDownToFailTimer = setTimeout(function () {
+    					context.state = 2;
+    					reset();
+    				}, context.waitNextTapTime);
+    			}
+
+    			function isValidDistanceFromPrevTap(center, options) {
+    				if (void 0 !== prevTapPoint) {
+    					var distanceFromPreviousTap = getVLength({
+    						x: center.x - prevTapPoint.x,
+
+    						y: center.y - prevTapPoint.y,
+    					});
+    					prevTapPoint = center;
+    					return options.maxDistanceFromPrevTap >= distanceFromPreviousTap;
+    				} else {
+    					prevTapPoint = center;
+    					return true;
+    				}
+    			}
+
+    			function isValidInterval(waitNextTapTime) {
+    				var now = performance.now();
+
+    				if (void 0 === prevTapTime) {
+    					prevTapTime = now;
+    					return true;
+    				} else {
+    					var interval = now - prevTapTime;
+    					prevTapTime = now;
+    					return interval < waitNextTapTime;
+    				}
+    			}
+
+    			at.compute([ComputeDistance, ComputeMaxLength], function (computed) {
+    				if (isDisabled(context)) return;
+    				var phase = computed.phase,
+    					x = computed.x,
+    					y = computed.y;
+    				if (TYPE_END !== phase) return;
+    				context.state = 0;
+    				if (test()) {
+    					clearTimeout(countDownToFailTimer);
+    					if (
+    						isValidDistanceFromPrevTap({ x: x, y: y }, context) &&
+    						isValidInterval(context.waitNextTapTime)
+    					) {
+    						tapCount++;
+    					} else {
+    						tapCount = 1;
+    					}
+    					if (0 === tapCount % context.tapTimes) {
+    						context.state = 1;
+    						at.emit2(context.name, computed, context);
+    						reset();
+    					} else {
+    						countDownToFail();
+    					}
+    				} else {
+    					reset();
+    					context.state = 2;
+    				}
+    				function test() {
+    					var startInput = computed.startInput,
+    						pointLength = computed.pointLength,
+    						timestamp = computed.timestamp;
+    					var deltaTime = timestamp - startInput.timestamp;
+    					var distance = computed.distance,
+    						maxPointLength = computed.maxPointLength;
+    					return (
+    						maxPointLength === context.pointLength &&
+    						0 === pointLength &&
+    						context.maxDistance >= distance &&
+    						context.maxPressTime > deltaTime
+    					);
+    				}
+    			});
+    			return context;
+    		}
+
+    		var DEFAULT_OPTIONS$4 = { name: "pan", threshold: 10, pointLength: 1 };
+
+    		function pan(at, options) {
+    			var context = createPluginContext(DEFAULT_OPTIONS$4, options);
+    			at.compute(
+    				[ComputeVAndDir, ComputeDistance, ComputeDeltaXY],
+
+    				function (computed) {
+    					resetState(context);
+    					if (isDisabled(context)) return;
+    					var isValid = test();
+    					context.state = flow(isValid, context.state, computed.phase);
+    					if (isValid || isMoveOrEndOrCancel(context.state)) {
+    						var name_1 = context.name;
+    						at.emit2(name_1, computed, context);
+    						at.emit2(name_1 + getStatusName(context.state), computed, context);
+    						if (
+    							![TYPE_END, TYPE_CANCEL].includes(computed.phase) &&
+    							computed.direction
+    						) {
+    							at.emit2(name_1 + computed.direction, computed, context);
+    						}
+    					}
+    					function test() {
+    						var pointLength = computed.pointLength,
+    							distance = computed.distance;
+    						return (
+    							context.pointLength === pointLength &&
+    							context.threshold <= distance
+    						);
+    					}
+    				}
+    			);
+    			return context;
+    		}
+
+    		var DEFAULT_OPTIONS$3 = {
+    			name: "swipe",
+    			threshold: 10,
+    			velocity: 0.3,
+    			pointLength: 1,
+    		};
+
+    		function swipe(at, options) {
+    			var context = createPluginContext(DEFAULT_OPTIONS$3, options);
+    			at.compute(
+    				[ComputeDistance, ComputeVAndDir, ComputeMaxLength],
+
+    				function (computed) {
+    					context.state = 0;
+    					if (context.disabled) return;
+    					if (test()) {
+    						var name_1 = context.name;
+    						context.state = 1;
+    						at.emit2(name_1, computed, context);
+    						at.emit2(name_1 + computed.direction, computed, context);
+    					}
+    					function test() {
+    						if (TYPE_END !== computed.phase) return false;
+    						var velocityX = computed.velocityX,
+    							velocityY = computed.velocityY,
+    							distance = computed.distance,
+    							maxPointLength = computed.maxPointLength;
+    						return (
+    							maxPointLength === context.pointLength &&
+    							0 === computed.points.length &&
+    							context.threshold < distance &&
+    							context.velocity < Math.max(velocityX, velocityY)
+    						);
+    					}
+    				}
+    			);
+    			return context;
+    		}
+
+    		var DEFAULT_OPTIONS$2 = {
+    			name: "press",
+    			pointLength: 1,
+    			maxDistance: 9,
+    			minPressTime: 251,
+    		};
+
+    		function press(at, options) {
+    			var context = createPluginContext(DEFAULT_OPTIONS$2, options);
+    			var timeoutId = 0;
+
+    			at.compute([ComputeDistance], function (computed) {
+    				if (isDisabled(context)) return;
+    				var phase = computed.phase,
+    					startInput = computed.startInput,
+    					pointLength = computed.pointLength;
+    				if (TYPE_START === phase && context.pointLength === pointLength) {
+    					resetState(context);
+    					clearTimeout(timeoutId);
+    					timeoutId = setTimeout(function () {
+    						context.state = 1;
+    						at.emit2(context.name, computed, context);
+    					}, context.minPressTime);
+    				} else if (TYPE_END === phase && 1 === context.state) {
+    					at.emit2(
+    						"".concat(context.name).concat(DIRECTION_UP),
+    						computed,
+    						context
+    					);
+    				} else if (1 !== context.state) {
+    					var deltaTime = computed.timestamp - startInput.timestamp;
+    					if (
+    						!test() ||
+    						(context.minPressTime > deltaTime &&
+    							[TYPE_END, TYPE_CANCEL].includes(phase))
+    					) {
+    						clearTimeout(timeoutId);
+    						context.state = 2;
+    					}
+    				}
+    				function test() {
+    					var distance = computed.distance;
+    					return distance && context.maxDistance > distance;
+    				}
+    			});
+    			return context;
+    		}
+
+    		var DEFAULT_OPTIONS$1 = {
+    			name: "pinch",
+    			threshold: 0,
+    			pointLength: 2,
+    		};
+
+    		function pinch(at, options) {
+    			var context = createPluginContext(DEFAULT_OPTIONS$1, options);
+    			at.compute(
+    				[ComputeVectorForMutli, ComputeScale],
+
+    				function (computed) {
+    					resetState(context);
+    					if (isDisabled(context)) return;
+    					var isValid = test();
+    					context.state = flow(isValid, context.state, computed.phase);
+    					var name = context.name;
+    					if (isValid || isMoveOrEndOrCancel(context.state)) {
+    						at.emit2(name, computed, context);
+    						var deltaScale = computed.deltaScale;
+    						if (1 !== deltaScale) {
+    							at.emit2(
+    								name + (1 < deltaScale ? "in" : "out"),
+    								computed,
+    								context
+    							);
+    						}
+    					}
+    					var stateName = getStatusName(context.state);
+    					if (stateName) {
+    						at.emit2(name + stateName, computed, context);
+    					}
+    					function test() {
+    						var pointLength = computed.pointLength,
+    							scale = computed.scale;
+    						computed.deltaScale;
+    						computed.phase;
+    						return (
+    							context.pointLength === pointLength &&
+    							context.threshold < Math.abs(scale - 1)
+    						);
+    					}
+    				}
+    			);
+    			return context;
+    		}
+
+    		var DEFAULT_OPTIONS = {
+    			name: "rotate",
+    			threshold: 0,
+    			pointLength: 2,
+    		};
+
+    		function rotate(at, options) {
+    			var context = createPluginContext(DEFAULT_OPTIONS, options);
+    			at.compute(
+    				[ComputeVectorForMutli, ComputeAngle],
+
+    				function (computed) {
+    					if (isDisabled(context)) return;
+    					resetState(context);
+    					var isValid = test();
+    					context.state = flow(isValid, context.state, computed.phase);
+    					var name = context.name;
+    					if (isValid || isMoveOrEndOrCancel(context.state)) {
+    						at.emit2(name, computed, context);
+    					}
+    					var stateName = getStatusName(context.state);
+    					if (stateName) {
+    						at.emit2(name + stateName, computed, context);
+    					}
+    					function test() {
+    						var pointLength = computed.pointLength,
+    							angle = computed.angle;
+    						return (
+    							context.pointLength === pointLength &&
+    							context.threshold < Math.abs(angle)
+    						);
+    					}
+    				}
+    			);
+    			return context;
+    		}
+
+    		function doubletap(at) {
+    			at.use(tap, { name: "doubletap", tapTimes: 2 });
+    			var doubleTapContext = at.get("doubletap");
+
+    			var timeID;
+
+    			at.beforeEach(function (type, next) {
+    				if ("tap" === type) {
+    					clearTimeout(timeID);
+    					timeID = setTimeout(function () {
+    						if ([0, 2].includes(doubleTapContext.state)) {
+    							next();
+    						}
+    					}, 300);
+    				} else {
+    					next();
+    				}
+    			});
+    			return doubleTapContext;
+    		}
+
+    		var default_1 = (function (_super) {
+    			__extends(default_1, _super);
+
+    			function default_1(el, options) {
+    				var _this = _super.call(this, el, options) || this;
+    				_this.use(tap);
+    				_this.use(pan);
+    				_this.use(swipe);
+    				_this.use(press);
+    				_this.use(pinch);
+    				_this.use(rotate);
+    				return _this;
+    			}
+    			default_1.STATE_POSSIBLE = 0;
+    			default_1.STATE_START = 4;
+    			default_1.STATE_MOVE = 5;
+    			default_1.STATE_END = 1;
+    			default_1.STATE_CANCELLED = 3;
+    			default_1.STATE_FAILED = 2;
+    			default_1.STATE_RECOGNIZED = 1;
+    			default_1.tap = tap;
+    			default_1.pan = pan;
+    			default_1.swipe = swipe;
+    			default_1.press = press;
+    			default_1.rotate = rotate;
+    			default_1.pinch = pinch;
+    			default_1.doubletap = doubletap;
+    			return default_1;
+    		})(default_1$1);
+
+    		return default_1;
+    	});
+    };
+
+    class PopsUtils {
+        /**
+         * 判断是否是window，例如window、self、globalThis
+         * @param target
+         */
+        isWin(target) {
+            if (typeof target !== "object") {
+                return false;
+            }
+            if (target instanceof Node) {
+                return false;
+            }
+            if (target === globalThis) {
+                return true;
+            }
+            if (target === window) {
+                return true;
+            }
+            if (target === self) {
+                return true;
+            }
+            if (target === PopsCore.globalThis) {
+                return true;
+            }
+            if (target === PopsCore.window) {
+                return true;
+            }
+            if (target === PopsCore.self) {
+                return true;
+            }
+            if (typeof unsafeWindow !== "undefined" &&
+                target === unsafeWindow) {
+                return true;
+            }
+            if (target?.Math?.toString() !== "[object Math]") {
+                return false;
+            }
+            return true;
+        }
+        isDOM(target) {
+            return target instanceof Node;
+        }
+        /**
+         * 删除对象上的属性
+         * @param target
+         * @param propName
+         */
+        delete(target, propName) {
+            if (typeof Reflect === "object" && Reflect.deleteProperty) {
+                Reflect.deleteProperty(target, propName);
+            }
+            else {
+                delete target[propName];
+            }
+        }
+        assign(target = {}, source = {}, isAdd = false) {
+            let UtilsContext = this;
+            if (Array.isArray(source)) {
+                let canTraverse = source.filter((item) => {
+                    return typeof item === "object";
+                });
+                if (!canTraverse.length) {
+                    return source;
+                }
+            }
+            if (isAdd) {
+                for (const sourceKeyName in source) {
+                    const targetKeyName = sourceKeyName;
+                    let targetValue = target[targetKeyName];
+                    let sourceValue = source[sourceKeyName];
+                    if (sourceKeyName in target &&
+                        typeof sourceValue === "object" &&
+                        !UtilsContext.isDOM(sourceValue)) {
+                        /* 源端的值是object类型，且不是元素节点 */
+                        target[sourceKeyName] = UtilsContext.assign(targetValue, sourceValue, isAdd);
+                        continue;
+                    }
+                    target[sourceKeyName] = sourceValue;
+                }
+            }
+            else {
+                for (const targetKeyName in target) {
+                    if (targetKeyName in source) {
+                        let targetValue = target[targetKeyName];
+                        let sourceValue = source[targetKeyName];
+                        if (typeof sourceValue === "object" &&
+                            !UtilsContext.isDOM(sourceValue) &&
+                            Object.keys(sourceValue).length) {
+                            /* 源端的值是object类型，且不是元素节点 */
+                            target[targetKeyName] = UtilsContext.assign(targetValue, sourceValue, isAdd);
+                            continue;
+                        }
+                        /* 直接赋值 */
+                        target[targetKeyName] = sourceValue;
+                    }
+                }
+            }
+            return target;
+        }
+        /**
+         * 生成uuid
+         */
+        getRandomGUID() {
+            if (typeof PopsCore.globalThis?.crypto?.randomUUID === "function") {
+                return PopsCore.globalThis.crypto.randomUUID();
+            }
+            else {
+                return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (charStr) {
+                    var randomValue = (Math.random() * 16) | 0, randomCharValue = charStr === "x" ? randomValue : (randomValue & 0x3) | 0x8;
+                    return randomCharValue.toString(16);
+                });
+            }
+        }
+        /**
+         * 字符串转HTMLElement
+         * @param elementString
+         * @returns
+         */
+        parseTextToDOM(elementString) {
+            /* 去除前后的换行和空格 */
+            elementString = elementString
+                .replace(/^[\n|\s]*/g, "")
+                .replace(/[\n|\s]*$/g, "");
+            let targetElement = popsDOMUtils.createElement("div", {
+                innerHTML: elementString,
+            });
+            return targetElement.firstChild;
+        }
+        contains(target, context = PopsCore
+            .document.body || PopsCore.document.documentElement) {
+            if (typeof target[Symbol.iterator] === "function") {
+                // 可遍历的数组
+                let flag = true;
+                for (const targetNode of target) {
+                    if (!context.contains(targetNode)) {
+                        flag = false;
+                        break;
+                    }
+                }
+                return flag;
+            }
+            else {
+                return context.contains(target);
+            }
+        }
+        formatTime(text = new Date(), formatType = "yyyy-MM-dd HH:mm:ss") {
+            let time = text == null ? new Date() : new Date(text);
+            /**
+             * 校验时间补0
+             * @param timeNum
+             * @returns
+             */
+            function checkTime(timeNum) {
+                if (timeNum < 10)
+                    return "0" + timeNum;
+                return timeNum;
+            }
+            /**
+             * 时间制修改 24小时制转12小时制
+             * @param hourNum 小时
+             * @returns
+             */
+            function timeSystemChange(hourNum) {
+                return hourNum > 12 ? hourNum - 12 : hourNum;
+            }
+            let timeRegexp = {
+                yyyy: time.getFullYear(),
+                /* 年 */
+                MM: checkTime(time.getMonth() + 1),
+                /* 月 */
+                dd: checkTime(time.getDate()),
+                /* 日 */
+                HH: checkTime(time.getHours()),
+                /* 时 (24小时制) */
+                hh: checkTime(timeSystemChange(time.getHours())),
+                /* 时 (12小时制) */
+                mm: checkTime(time.getMinutes()),
+                /* 分 */
+                ss: checkTime(time.getSeconds()),
+                /* 秒 */
+            };
+            Object.keys(timeRegexp).forEach(function (key) {
+                let replaecRegexp = new RegExp(key, "g");
+                formatType = formatType.replace(replaecRegexp, timeRegexp[key]);
+            });
+            return formatType;
+        }
+        formatByteToSize(byteSize, addType = true) {
+            byteSize = parseInt(byteSize.toString());
+            if (isNaN(byteSize)) {
+                throw new Error("Utils.formatByteToSize 参数 byteSize 格式不正确");
+            }
+            let result = 0;
+            let resultType = "KB";
+            let sizeData = {};
+            sizeData.B = 1;
+            sizeData.KB = 1024;
+            sizeData.MB = sizeData.KB * sizeData.KB;
+            sizeData.GB = sizeData.MB * sizeData.KB;
+            sizeData.TB = sizeData.GB * sizeData.KB;
+            sizeData.PB = sizeData.TB * sizeData.KB;
+            sizeData.EB = sizeData.PB * sizeData.KB;
+            sizeData.ZB = sizeData.EB * sizeData.KB;
+            sizeData.YB = sizeData.ZB * sizeData.KB;
+            sizeData.BB = sizeData.YB * sizeData.KB;
+            sizeData.NB = sizeData.BB * sizeData.KB;
+            sizeData.DB = sizeData.NB * sizeData.KB;
+            for (let key in sizeData) {
+                result = byteSize / sizeData[key];
+                resultType = key;
+                if (sizeData.KB >= result) {
+                    break;
+                }
+            }
+            result = result.toFixed(2);
+            result = addType
+                ? result + resultType.toString()
+                : parseFloat(result.toString());
+            return result;
+        }
+        AnyTouch = AnyTouch;
+    }
+    const popsUtils = new PopsUtils();
+
+    class PopsDOMUtilsEvent {
+        on(element, eventType, selector, callback, option) {
+            /**
+             * 获取option配置
+             * @param args
+             * @param startIndex
+             * @param option
+             */
+            function getOption(args, startIndex, option) {
+                if (typeof args[startIndex] === "boolean") {
+                    option.capture = args[startIndex];
+                    if (typeof args[startIndex + 1] === "boolean") {
+                        option.once = args[startIndex + 1];
+                    }
+                    if (typeof args[startIndex + 2] === "boolean") {
+                        option.passive = args[startIndex + 2];
+                    }
+                }
+                else if (typeof args[startIndex] === "object" &&
+                    ("capture" in args[startIndex] ||
+                        "once" in args[startIndex] ||
+                        "passive" in args[startIndex])) {
+                    option.capture = args[startIndex].capture;
+                    option.once = args[startIndex].once;
+                    option.passive = args[startIndex].passive;
+                }
+                return option;
+            }
+            let DOMUtilsContext = this;
+            let args = arguments;
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelectorAll(element);
+            }
+            if (element == null) {
+                return;
+            }
+            let elementList = [];
+            if (element instanceof NodeList || Array.isArray(element)) {
+                element = element;
+                elementList = [...element];
+            }
+            else {
+                elementList.push(element);
+            }
+            let eventTypeList = [];
+            if (Array.isArray(eventType)) {
+                eventTypeList = eventTypeList.concat(eventType);
+            }
+            else if (typeof eventType === "string") {
+                eventTypeList = eventTypeList.concat(eventType.split(" "));
+            }
+            let _selector_ = selector;
+            let _callback_ = callback;
+            let _option_ = {
+                capture: false,
+                once: false,
+                passive: false,
+            };
+            if (typeof selector === "function") {
+                /* 这是为没有selector的情况 */
+                _selector_ = void 0;
+                _callback_ = selector;
+                _option_ = getOption(args, 3, _option_);
+            }
+            else {
+                /* 这是存在selector的情况 */
+                _option_ = getOption(args, 4, _option_);
+            }
+            /**
+             * 如果是once，那么删除该监听和元素上的事件和监听
+             */
+            function checkOptionOnceToRemoveEventListener() {
+                if (_option_.once) {
+                    DOMUtilsContext.off(element, eventType, selector, callback, option);
+                }
+            }
+            elementList.forEach((elementItem) => {
+                function ownCallBack(event) {
+                    let target = event.target;
+                    if (_selector_) {
+                        /* 存在自定义子元素选择器 */
+                        let totalParent = popsUtils.isWin(elementItem)
+                            ? PopsCore.document.documentElement
+                            : elementItem;
+                        if (target.matches(_selector_)) {
+                            /* 当前目标可以被selector所匹配到 */
+                            _callback_.call(target, event);
+                            checkOptionOnceToRemoveEventListener();
+                        }
+                        else if (target.closest(_selector_) &&
+                            totalParent.contains(target.closest(_selector_))) {
+                            /* 在上层与主元素之间寻找可以被selector所匹配到的 */
+                            let closestElement = target.closest(_selector_);
+                            /* event的target值不能直接修改 */
+                            OriginPrototype$1.Object.defineProperty(event, "target", {
+                                get() {
+                                    return closestElement;
+                                },
+                            });
+                            _callback_.call(closestElement, event);
+                            checkOptionOnceToRemoveEventListener();
+                        }
+                    }
+                    else {
+                        _callback_.call(elementItem, event);
+                        checkOptionOnceToRemoveEventListener();
+                    }
+                }
+                /* 遍历事件名设置元素事件 */
+                eventTypeList.forEach((eventName) => {
+                    elementItem.addEventListener(eventName, ownCallBack, _option_);
+                    if (_callback_ && _callback_.delegate) {
+                        elementItem.setAttribute("data-delegate", _selector_);
+                    }
+                    /* 获取对象上的事件 */
+                    let elementEvents = elementItem[SymbolEvents] || {};
+                    /* 初始化对象上的xx事件 */
+                    elementEvents[eventName] = elementEvents[eventName] || [];
+                    elementEvents[eventName].push({
+                        selector: _selector_,
+                        option: _option_,
+                        callback: ownCallBack,
+                        originCallBack: _callback_,
+                    });
+                    /* 覆盖事件 */
+                    elementItem[SymbolEvents] = elementEvents;
+                });
+            });
+        }
+        off(element, eventType, selector, callback, option, filter) {
+            /**
+             * 获取option配置
+             * @param args1
+             * @param startIndex
+             * @param option
+             */
+            function getOption(args1, startIndex, option) {
+                if (typeof args1[startIndex] === "boolean") {
+                    option.capture = args1[startIndex];
+                }
+                else if (typeof args1[startIndex] === "object" &&
+                    "capture" in args1[startIndex]) {
+                    option.capture = args1[startIndex].capture;
+                }
+                return option;
+            }
+            let args = arguments;
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelectorAll(element);
+            }
+            if (element == null) {
+                return;
+            }
+            let elementList = [];
+            if (element instanceof NodeList || Array.isArray(element)) {
+                element = element;
+                elementList = [...element];
+            }
+            else {
+                elementList.push(element);
+            }
+            let eventTypeList = [];
+            if (Array.isArray(eventType)) {
+                eventTypeList = eventTypeList.concat(eventType);
+            }
+            else if (typeof eventType === "string") {
+                eventTypeList = eventTypeList.concat(eventType.split(" "));
+            }
+            /**
+             * 子元素选择器
+             */
+            let _selector_ = selector;
+            /**
+             * 事件的回调函数
+             */
+            let _callback_ = callback;
+            /**
+             * 事件的配置
+             */
+            let _option_ = {
+                capture: false,
+            };
+            if (typeof selector === "function") {
+                /* 这是为没有selector的情况 */
+                _selector_ = void 0;
+                _callback_ = selector;
+                _option_ = getOption(args, 3, _option_);
+            }
+            else {
+                _option_ = getOption(args, 4, _option_);
+            }
+            elementList.forEach((elementItem) => {
+                /* 获取对象上的事件 */
+                let elementEvents = elementItem[SymbolEvents] || {};
+                eventTypeList.forEach((eventName) => {
+                    let handlers = elementEvents[eventName] || [];
+                    if (typeof filter === "function") {
+                        handlers = handlers.filter(filter);
+                    }
+                    for (let index = 0; index < handlers.length; index++) {
+                        let handler = handlers[index];
+                        let flag = false;
+                        if (!_selector_ || handler.selector === _selector_) {
+                            /* selector不为空，进行selector判断 */
+                            flag = true;
+                        }
+                        if (!_callback_ ||
+                            handler.callback === _callback_ ||
+                            handler.originCallBack === _callback_) {
+                            /* callback不为空，进行callback判断 */
+                            flag = true;
+                        }
+                        if (flag) {
+                            elementItem.removeEventListener(eventName, handler.callback, _option_);
+                            handlers.splice(index--, 1);
+                        }
+                    }
+                    if (handlers.length === 0) {
+                        /* 如果没有任意的handler，那么删除该属性 */
+                        popsUtils.delete(elementEvents, eventType);
+                    }
+                });
+                elementItem[SymbolEvents] = elementEvents;
+            });
+        }
+        /**
+         * 取消绑定所有的事件
+         * @param element 需要取消绑定的元素|元素数组
+         * @param eventType （可选）需要取消监听的事件
+         */
+        offAll(element, eventType) {
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelectorAll(element);
+            }
+            if (element == null) {
+                return;
+            }
+            let elementList = [];
+            if (element instanceof NodeList || Array.isArray(element)) {
+                elementList = [...element];
+            }
+            else {
+                elementList.push(element);
+            }
+            let eventTypeList = [];
+            if (Array.isArray(eventType)) {
+                eventTypeList = eventTypeList.concat(eventType);
+            }
+            else if (typeof eventType === "string") {
+                eventTypeList = eventTypeList.concat(eventType.split(" "));
+            }
+            elementList.forEach((elementItem) => {
+                Object.getOwnPropertySymbols(elementItem).forEach((__symbolEvents) => {
+                    if (!__symbolEvents.toString().startsWith("Symbol(events_")) {
+                        return;
+                    }
+                    let elementEvents = elementItem[__symbolEvents] || {};
+                    let iterEventNameList = eventTypeList.length
+                        ? eventTypeList
+                        : Object.keys(elementEvents);
+                    iterEventNameList.forEach((eventName) => {
+                        let handlers = elementEvents[eventName];
+                        if (!handlers) {
+                            return;
+                        }
+                        for (const handler of handlers) {
+                            elementItem.removeEventListener(eventName, handler.callback, {
+                                capture: handler["option"]["capture"],
+                            });
+                        }
+                        popsUtils.delete(elementItem[__symbolEvents], eventName);
+                    });
+                });
+            });
+        }
+        /**
+         * 等待文档加载完成后执行指定的函数
+         * @param callback 需要执行的函数
+         * @example
+         * DOMUtils.ready(function(){
+         *   console.log("文档加载完毕")
+         * })
+         */
+        ready(callback) {
+            if (typeof callback !== "function") {
+                return;
+            }
+            /**
+             * 检测文档是否加载完毕
+             */
+            function checkDOMReadyState() {
+                try {
+                    if (document.readyState === "complete" ||
+                        (document.readyState !== "loading" &&
+                            !document.documentElement.doScroll)) {
+                        return true;
+                    }
+                    else {
+                        return false;
+                    }
+                }
+                catch (error) {
+                    return false;
+                }
+            }
+            /**
+             * 成功加载完毕后触发的回调函数
+             */
+            function completed() {
+                removeDomReadyListener();
+                callback();
+            }
+            let targetList = [
+                {
+                    target: PopsCore.document,
+                    eventType: "DOMContentLoaded",
+                    callback: completed,
+                },
+                {
+                    target: PopsCore.window,
+                    eventType: "load",
+                    callback: completed,
+                },
+            ];
+            /**
+             * 添加监听
+             */
+            function addDomReadyListener() {
+                for (let index = 0; index < targetList.length; index++) {
+                    let item = targetList[index];
+                    item.target.addEventListener(item.eventType, item.callback);
+                }
+            }
+            /**
+             * 移除监听
+             */
+            function removeDomReadyListener() {
+                for (let index = 0; index < targetList.length; index++) {
+                    let item = targetList[index];
+                    item.target.removeEventListener(item.eventType, item.callback);
+                }
+            }
+            if (checkDOMReadyState()) {
+                /* 检查document状态 */
+                setTimeout(callback);
+            }
+            else {
+                /* 添加监听 */
+                addDomReadyListener();
+            }
+        }
+        /**
+         * 主动触发事件
+         * @param element 需要触发的元素|元素数组|window
+         * @param eventType 需要触发的事件
+         * @param details 赋予触发的Event的额外属性，如果是Event类型，那么将自动代替默认new的Event对象
+         * @param useDispatchToTriggerEvent 是否使用dispatchEvent来触发事件,默认true
+         * @example
+         * // 触发元素a.xx的click事件
+         * DOMUtils.trigger(document.querySelector("a.xx"),"click")
+         * DOMUtils.trigger("a.xx","click")
+         * // 触发元素a.xx的click、tap、hover事件
+         * DOMUtils.trigger(document.querySelector("a.xx"),"click tap hover")
+         * DOMUtils.trigger("a.xx",["click","tap","hover"])
+         */
+        trigger(element, eventType, details, useDispatchToTriggerEvent = true) {
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelector(element);
+            }
+            if (element == null) {
+                return;
+            }
+            let elementList = [];
+            if (element instanceof NodeList || Array.isArray(element)) {
+                element = element;
+                elementList = [...element];
+            }
+            else {
+                elementList = [element];
+            }
+            let eventTypeList = [];
+            if (Array.isArray(eventType)) {
+                eventTypeList = eventType;
+            }
+            else if (typeof eventType === "string") {
+                eventTypeList = eventType.split(" ");
+            }
+            elementList.forEach((elementItem) => {
+                /* 获取对象上的事件 */
+                let events = elementItem[SymbolEvents] || {};
+                eventTypeList.forEach((_eventType_) => {
+                    let event = null;
+                    if (details && details instanceof Event) {
+                        event = details;
+                    }
+                    else {
+                        event = new Event(_eventType_);
+                        if (details) {
+                            Object.keys(details).forEach((keyName) => {
+                                event[keyName] = details[keyName];
+                            });
+                        }
+                    }
+                    if (useDispatchToTriggerEvent == false && _eventType_ in events) {
+                        events[_eventType_].forEach((eventsItem) => {
+                            eventsItem.callback(event);
+                        });
+                    }
+                    else {
+                        elementItem.dispatchEvent(event);
+                    }
+                });
+            });
+        }
+        /**
+         * 绑定或触发元素的click事件
+         * @param element 目标元素
+         * @param handler （可选）事件处理函数
+         * @param details （可选）赋予触发的Event的额外属性
+         * @param useDispatchToTriggerEvent （可选）是否使用dispatchEvent来触发事件,默认true
+         * @example
+         * // 触发元素a.xx的click事件
+         * DOMUtils.click(document.querySelector("a.xx"))
+         * DOMUtils.click("a.xx")
+         * DOMUtils.click("a.xx"，function(){
+         *  console.log("触发click事件成功")
+         * })
+         * */
+        click(element, handler, details, useDispatchToTriggerEvent) {
+            let DOMUtilsContext = this;
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelector(element);
+            }
+            if (element == null) {
+                return;
+            }
+            if (handler == null) {
+                DOMUtilsContext.trigger(element, "click", details, useDispatchToTriggerEvent);
+            }
+            else {
+                DOMUtilsContext.on(element, "click", null, handler);
+            }
+        }
+        /**
+         * 绑定或触发元素的blur事件
+         * @param element 目标元素
+         * @param handler （可选）事件处理函数
+         * @param details （可选）赋予触发的Event的额外属性
+         * @param useDispatchToTriggerEvent （可选）是否使用dispatchEvent来触发事件,默认true
+         * @example
+         * // 触发元素a.xx的blur事件
+         * DOMUtils.blur(document.querySelector("a.xx"))
+         * DOMUtils.blur("a.xx")
+         * DOMUtils.blur("a.xx"，function(){
+         *  console.log("触发blur事件成功")
+         * })
+         * */
+        blur(element, handler, details, useDispatchToTriggerEvent) {
+            let DOMUtilsContext = this;
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelector(element);
+            }
+            if (element == null) {
+                return;
+            }
+            if (handler === null) {
+                DOMUtilsContext.trigger(element, "blur", details, useDispatchToTriggerEvent);
+            }
+            else {
+                DOMUtilsContext.on(element, "blur", null, handler);
+            }
+        }
+        /**
+         * 绑定或触发元素的focus事件
+         * @param element 目标元素
+         * @param handler （可选）事件处理函数
+         * @param details （可选）赋予触发的Event的额外属性
+         * @param useDispatchToTriggerEvent （可选）是否使用dispatchEvent来触发事件,默认true
+         * @example
+         * // 触发元素a.xx的focus事件
+         * DOMUtils.focus(document.querySelector("a.xx"))
+         * DOMUtils.focus("a.xx")
+         * DOMUtils.focus("a.xx"，function(){
+         *  console.log("触发focus事件成功")
+         * })
+         * */
+        focus(element, handler, details, useDispatchToTriggerEvent) {
+            let DOMUtilsContext = this;
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelector(element);
+            }
+            if (element == null) {
+                return;
+            }
+            if (handler == null) {
+                DOMUtilsContext.trigger(element, "focus", details, useDispatchToTriggerEvent);
+            }
+            else {
+                DOMUtilsContext.on(element, "focus", null, handler);
+            }
+        }
+        /**
+         * 当鼠标移入或移出元素时触发事件
+         * @param element 当前元素
+         * @param handler 事件处理函数
+         * @param option 配置
+         * @example
+         * // 监听a.xx元素的移入或移出
+         * DOMUtils.hover(document.querySelector("a.xx"),()=>{
+         *   console.log("移入/移除");
+         * })
+         * DOMUtils.hover("a.xx",()=>{
+         *   console.log("移入/移除");
+         * })
+         */
+        hover(element, handler, option) {
+            let DOMUtilsContext = this;
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelector(element);
+            }
+            if (element == null) {
+                return;
+            }
+            DOMUtilsContext.on(element, "mouseenter", null, handler, option);
+            DOMUtilsContext.on(element, "mouseleave", null, handler, option);
+        }
+        /**
+         * 当按键松开时触发事件
+         * keydown - > keypress - > keyup
+         * @param target 当前元素
+         * @param handler 事件处理函数
+         * @param option 配置
+         * @example
+         * // 监听a.xx元素的按键松开
+         * DOMUtils.keyup(document.querySelector("a.xx"),()=>{
+         *   console.log("按键松开");
+         * })
+         * DOMUtils.keyup("a.xx",()=>{
+         *   console.log("按键松开");
+         * })
+         */
+        keyup(target, handler, option) {
+            let DOMUtilsContext = this;
+            if (target == null) {
+                return;
+            }
+            if (typeof target === "string") {
+                target = PopsCore.document.querySelector(target);
+            }
+            DOMUtilsContext.on(target, "keyup", null, handler, option);
+        }
+        /**
+         * 当按键按下时触发事件
+         * keydown - > keypress - > keyup
+         * @param target 目标
+         * @param handler 事件处理函数
+         * @param option 配置
+         * @example
+         * // 监听a.xx元素的按键按下
+         * DOMUtils.keydown(document.querySelector("a.xx"),()=>{
+         *   console.log("按键按下");
+         * })
+         * DOMUtils.keydown("a.xx",()=>{
+         *   console.log("按键按下");
+         * })
+         */
+        keydown(target, handler, option) {
+            let DOMUtilsContext = this;
+            if (target == null) {
+                return;
+            }
+            if (typeof target === "string") {
+                target = PopsCore.document.querySelector(target);
+            }
+            DOMUtilsContext.on(target, "keydown", null, handler, option);
+        }
+        /**
+         * 当按键按下时触发事件
+         * keydown - > keypress - > keyup
+         * @param target 目标
+         * @param handler 事件处理函数
+         * @param option 配置
+         * @example
+         * // 监听a.xx元素的按键按下
+         * DOMUtils.keypress(document.querySelector("a.xx"),()=>{
+         *   console.log("按键按下");
+         * })
+         * DOMUtils.keypress("a.xx",()=>{
+         *   console.log("按键按下");
+         * })
+         */
+        keypress(target, handler, option) {
+            let DOMUtilsContext = this;
+            if (target == null) {
+                return;
+            }
+            if (typeof target === "string") {
+                target = PopsCore.document.querySelector(target);
+            }
+            DOMUtilsContext.on(target, "keypress", null, handler, option);
+        }
+        preventEvent(element, eventNameList = [], capture) {
+            function stopEvent(event) {
+                /* 阻止事件的默认行为发生。例如，当点击一个链接时，浏览器会默认打开链接的URL */
+                event?.preventDefault();
+                /* 停止事件的传播，阻止它继续向更上层的元素冒泡，事件将不会再传播给其他的元素 */
+                event?.stopPropagation();
+                /* 阻止事件传播，并且还能阻止元素上的其他事件处理程序被触发 */
+                event?.stopImmediatePropagation();
+                return false;
+            }
+            if (arguments.length === 1) {
+                /* 直接阻止事件 */
+                return stopEvent(arguments[0]);
+            }
+            else {
+                /* 添加对应的事件来阻止触发 */
+                if (typeof eventNameList === "string") {
+                    eventNameList = [eventNameList];
+                }
+                eventNameList.forEach((eventName) => {
+                    element.addEventListener(eventName, stopEvent, {
+                        capture: Boolean(capture),
+                    });
+                });
+            }
+        }
+    }
+
+    class PopsDOMUtils extends PopsDOMUtilsEvent {
+        /** 获取 animationend 在各个浏览器的兼容名 */
+        getAnimationEndNameList() {
+            return [
+                "webkitAnimationEnd",
+                "mozAnimationEnd",
+                "MSAnimationEnd",
+                "oanimationend",
+                "animationend",
+            ];
+        }
+        /** 获取 transitionend 在各个浏览器的兼容名 */
+        getTransitionEndNameList() {
+            return [
+                "webkitTransitionEnd",
+                "mozTransitionEnd",
+                "MSTransitionEnd",
+                "otransitionend",
+                "transitionend",
+            ];
+        }
+        /**
+         * 实现jQuery中的$().offset();
+         * @param {HTMLElement} element
+         * @returns
+         */
+        offset(element) {
+            let rect = element.getBoundingClientRect();
+            let win = element.ownerDocument.defaultView;
+            let resultRect = new DOMRect(parseFloat((rect.left + (win?.pageXOffset || 0)).toString()), parseFloat((rect.top + (win?.pageYOffset || 0)).toString()), rect.width, rect.height);
+            return resultRect;
+        }
+        width(element, isShow = false) {
+            let DOMUtilsContext = this;
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelector(element);
+            }
+            if (element == null) {
+                return;
+            }
+            if (popsUtils.isWin(element)) {
+                return PopsCore.window.document.documentElement.clientWidth;
+            }
+            if (element.nodeType === 9) {
+                /* Document文档节点 */
+                element = element;
+                return Math.max(element.body.scrollWidth, element.documentElement.scrollWidth, element.body.offsetWidth, element.documentElement.offsetWidth, element.documentElement.clientWidth);
+            }
+            if (isShow || (!isShow && popsDOMUtils.isShow(element))) {
+                /* 已显示 */
+                /* 不从style中获取对应的宽度，因为可能使用了class定义了width !important */
+                element = element;
+                /* 如果element.style.width为空  则从css里面获取是否定义了width信息如果定义了 则读取css里面定义的宽度width */
+                if (parseFloat(popsDOMUtils.getStyleValue(element, "width").toString()) > 0) {
+                    return parseFloat(popsDOMUtils.getStyleValue(element, "width").toString());
+                }
+                /* 如果从css里获取到的值不是大于0  可能是auto 则通过offsetWidth来进行计算 */
+                if (element.offsetWidth > 0) {
+                    let borderLeftWidth = popsDOMUtils.getStyleValue(element, "borderLeftWidth");
+                    let borderRightWidth = popsDOMUtils.getStyleValue(element, "borderRightWidth");
+                    let paddingLeft = popsDOMUtils.getStyleValue(element, "paddingLeft");
+                    let paddingRight = popsDOMUtils.getStyleValue(element, "paddingRight");
+                    let backHeight = parseFloat(element.offsetWidth.toString()) -
+                        parseFloat(borderLeftWidth.toString()) -
+                        parseFloat(borderRightWidth.toString()) -
+                        parseFloat(paddingLeft.toString()) -
+                        parseFloat(paddingRight.toString());
+                    return parseFloat(backHeight.toString());
+                }
+                return 0;
+            }
+            else {
+                /* 未显示 */
+                element = element;
+                let { recovery } = popsDOMUtils.showElement(element);
+                let width = DOMUtilsContext.width(element, true);
+                recovery();
+                return width;
+            }
+        }
+        height(element, isShow = false) {
+            let DOMUtilsContext = this;
+            if (popsUtils.isWin(element)) {
+                return PopsCore.window.document.documentElement.clientHeight;
+            }
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelector(element);
+            }
+            if (element == null) {
+                return;
+            }
+            if (element.nodeType === 9) {
+                element = element;
+                /* Document文档节点 */
+                return Math.max(element.body.scrollHeight, element.documentElement.scrollHeight, element.body.offsetHeight, element.documentElement.offsetHeight, element.documentElement.clientHeight);
+            }
+            if (isShow || (!isShow && popsDOMUtils.isShow(element))) {
+                element = element;
+                /* 已显示 */
+                /* 从style中获取对应的高度，因为可能使用了class定义了width !important */
+                /* 如果element.style.height为空  则从css里面获取是否定义了height信息如果定义了 则读取css里面定义的高度height */
+                if (parseFloat(popsDOMUtils.getStyleValue(element, "height").toString()) > 0) {
+                    return parseFloat(popsDOMUtils.getStyleValue(element, "height").toString());
+                }
+                /* 如果从css里获取到的值不是大于0  可能是auto 则通过offsetHeight来进行计算 */
+                if (element.offsetHeight > 0) {
+                    let borderTopWidth = popsDOMUtils.getStyleValue(element, "borderTopWidth");
+                    let borderBottomWidth = popsDOMUtils.getStyleValue(element, "borderBottomWidth");
+                    let paddingTop = popsDOMUtils.getStyleValue(element, "paddingTop");
+                    let paddingBottom = popsDOMUtils.getStyleValue(element, "paddingBottom");
+                    let backHeight = parseFloat(element.offsetHeight.toString()) -
+                        parseFloat(borderTopWidth.toString()) -
+                        parseFloat(borderBottomWidth.toString()) -
+                        parseFloat(paddingTop.toString()) -
+                        parseFloat(paddingBottom.toString());
+                    return parseFloat(backHeight.toString());
+                }
+                return 0;
+            }
+            else {
+                /* 未显示 */
+                element = element;
+                let { recovery } = popsDOMUtils.showElement(element);
+                let height = DOMUtilsContext.height(element, true);
+                recovery();
+                return height;
+            }
+        }
+        outerWidth(element, isShow = false) {
+            let DOMUtilsContext = this;
+            if (popsUtils.isWin(element)) {
+                return PopsCore.window.innerWidth;
+            }
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelector(element);
+            }
+            if (element == null) {
+                return;
+            }
+            element = element;
+            if (isShow || (!isShow && popsDOMUtils.isShow(element))) {
+                let style = getComputedStyle(element, null);
+                let marginLeft = popsDOMUtils.getStyleValue(style, "marginLeft");
+                let marginRight = popsDOMUtils.getStyleValue(style, "marginRight");
+                return element.offsetWidth + marginLeft + marginRight;
+            }
+            else {
+                let { recovery } = popsDOMUtils.showElement(element);
+                let outerWidth = DOMUtilsContext.outerWidth(element, true);
+                recovery();
+                return outerWidth;
+            }
+        }
+        outerHeight(element, isShow = false) {
+            let DOMUtilsContext = this;
+            if (popsUtils.isWin(element)) {
+                return PopsCore.window.innerHeight;
+            }
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelector(element);
+            }
+            if (element == null) {
+                // @ts-ignore
+                return;
+            }
+            element = element;
+            if (isShow || (!isShow && popsDOMUtils.isShow(element))) {
+                let style = getComputedStyle(element, null);
+                let marginTop = popsDOMUtils.getStyleValue(style, "marginTop");
+                let marginBottom = popsDOMUtils.getStyleValue(style, "marginBottom");
+                return element.offsetHeight + marginTop + marginBottom;
+            }
+            else {
+                let { recovery } = popsDOMUtils.showElement(element);
+                let outerHeight = DOMUtilsContext.outerHeight(element, true);
+                recovery();
+                return outerHeight;
+            }
+        }
+        /**
+         * 添加className
+         * @param element 目标元素
+         * @param className className属性
+         */
+        addClassName(element, className) {
+            if (typeof className !== "string") {
+                return;
+            }
+            if (className.trim() === "") {
+                return;
+            }
+            element.classList.add(className);
+        }
+        /**
+         * 删除className
+         * @param element 目标元素
+         * @param className className属性
+         */
+        removeClassName(element, className) {
+            if (typeof className !== "string") {
+                return;
+            }
+            if (className.trim() === "") {
+                return;
+            }
+            element.classList.remove(className);
+        }
+        /**
+         * 判断元素是否包含某个className
+         * @param element 目标元素
+         * @param className className属性
+         */
+        containsClassName(element, className) {
+            if (typeof className !== "string") {
+                return false;
+            }
+            if (className.trim() === "") {
+                return false;
+            }
+            return element.classList.contains(className);
+        }
+        css(element, property, value) {
+            /**
+             * 把纯数字没有px的加上
+             */
+            function handlePixe(propertyName, propertyValue) {
+                let allowAddPixe = [
+                    "width",
+                    "height",
+                    "top",
+                    "left",
+                    "right",
+                    "bottom",
+                    "font-size",
+                ];
+                if (typeof propertyValue === "number") {
+                    propertyValue = propertyValue.toString();
+                }
+                if (typeof propertyValue === "string" &&
+                    allowAddPixe.includes(propertyName) &&
+                    propertyValue.match(/[0-9]$/gi)) {
+                    propertyValue = propertyValue + "px";
+                }
+                return propertyValue;
+            }
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelector(element);
+            }
+            if (element == null) {
+                return;
+            }
+            if (typeof property === "string") {
+                if (value == null) {
+                    return getComputedStyle(element).getPropertyValue(property);
+                }
+                else {
+                    if (value === "string" && value.includes("!important")) {
+                        element.style.setProperty(property, value, "important");
+                    }
+                    else {
+                        value = handlePixe(property, value);
+                        element.style.setProperty(property, value);
+                    }
+                }
+            }
+            else if (typeof property === "object") {
+                for (let prop in property) {
+                    if (typeof property[prop] === "string" &&
+                        property[prop].includes("!important")) {
+                        element.style.setProperty(prop, property[prop], "important");
+                    }
+                    else {
+                        property[prop] = handlePixe(prop, property[prop]);
+                        element.style.setProperty(prop, property[prop]);
+                    }
+                }
+            }
+        }
+        /**
+         * 创建元素
+         * @param tagName 标签名
+         * @param property 属性
+         * @param attributes 元素上的自定义属性
+         * @example
+         * // 创建一个DIV元素，且属性class为xxx
+         * DOMUtils.createElement("div",undefined,{ class:"xxx" });
+         * > <div class="xxx"></div>
+         * @example
+         * // 创建一个DIV元素
+         * DOMUtils.createElement("div");
+         * > <div></div>
+         * @example
+         * // 创建一个DIV元素
+         * DOMUtils.createElement("div","测试");
+         * > <div>测试</div>
+         */
+        createElement(
+        /** 元素名 */
+        tagName, 
+        /** 属性 */
+        property, 
+        /** 自定义属性 */
+        attributes) {
+            let tempElement = PopsCore.document.createElement(tagName);
+            if (typeof property === "string") {
+                tempElement.innerHTML = property;
+                return tempElement;
+            }
+            if (property == null) {
+                property = {};
+            }
+            if (attributes == null) {
+                attributes = {};
+            }
+            Object.keys(property).forEach((key) => {
+                let value = property[key];
+                tempElement[key] = value;
+            });
+            Object.keys(attributes).forEach((key) => {
+                let value = attributes[key];
+                if (typeof value === "object") {
+                    /* object转字符串 */
+                    value = JSON.stringify(value);
+                }
+                else if (typeof value === "function") {
+                    /* function转字符串 */
+                    value = value.toString();
+                }
+                tempElement.setAttribute(key, value);
+            });
+            return tempElement;
+        }
+        /**
+         * 获取文字的位置信息
+         * @param input 输入框
+         * @param selectionStart 起始位置
+         * @param selectionEnd 结束位置
+         * @param debug 是否是调试模式
+         * + true 不删除临时节点元素
+         * + false 删除临时节点元素
+         */
+        getTextBoundingRect(input, selectionStart, selectionEnd, debug) {
+            // Basic parameter validation
+            if (!input || !("value" in input))
+                return input;
+            if (typeof selectionStart == "string")
+                selectionStart = parseFloat(selectionStart);
+            if (typeof selectionStart != "number" || isNaN(selectionStart)) {
+                selectionStart = 0;
+            }
+            if (selectionStart < 0)
+                selectionStart = 0;
+            else
+                selectionStart = Math.min(input.value.length, selectionStart);
+            if (typeof selectionEnd == "string")
+                selectionEnd = parseFloat(selectionEnd);
+            if (typeof selectionEnd != "number" ||
+                isNaN(selectionEnd) ||
+                selectionEnd < selectionStart) {
+                selectionEnd = selectionStart;
+            }
+            if (selectionEnd < 0)
+                selectionEnd = 0;
+            else
+                selectionEnd = Math.min(input.value.length, selectionEnd);
+            // If available (thus IE), use the createTextRange method
+            if (typeof input.createTextRange == "function") {
+                var range = input.createTextRange();
+                range.collapse(true);
+                range.moveStart("character", selectionStart);
+                range.moveEnd("character", selectionEnd - selectionStart);
+                return range.getBoundingClientRect();
+            }
+            // createTextRange is not supported, create a fake text range
+            var offset = getInputOffset(), topPos = offset.top, leftPos = offset.left, width = getInputCSS("width", true), height = getInputCSS("height", true);
+            // Styles to simulate a node in an input field
+            var cssDefaultStyles = "white-space:pre;padding:0;margin:0;", listOfModifiers = [
+                "direction",
+                "font-family",
+                "font-size",
+                "font-size-adjust",
+                "font-variant",
+                "font-weight",
+                "font-style",
+                "letter-spacing",
+                "line-height",
+                "text-align",
+                "text-indent",
+                "text-transform",
+                "word-wrap",
+                "word-spacing",
+            ];
+            // @ts-ignore
+            topPos += getInputCSS("padding-top", true);
+            // @ts-ignore
+            topPos += getInputCSS("border-top-width", true);
+            // @ts-ignore
+            leftPos += getInputCSS("padding-left", true);
+            // @ts-ignore
+            leftPos += getInputCSS("border-left-width", true);
+            leftPos += 1; //Seems to be necessary
+            for (var i = 0; i < listOfModifiers.length; i++) {
+                var property = listOfModifiers[i];
+                // @ts-ignore
+                cssDefaultStyles += property + ":" + getInputCSS(property) + ";";
+            }
+            // End of CSS variable checks
+            // 不能为空，不然获取不到高度
+            var text = input.value || "G", textLen = text.length, fakeClone = document.createElement("div");
+            if (selectionStart > 0)
+                appendPart(0, selectionStart);
+            var fakeRange = appendPart(selectionStart, selectionEnd);
+            if (textLen > selectionEnd)
+                appendPart(selectionEnd, textLen);
+            // Styles to inherit the font styles of the element
+            fakeClone.style.cssText = cssDefaultStyles;
+            // Styles to position the text node at the desired position
+            fakeClone.style.position = "absolute";
+            fakeClone.style.top = topPos + "px";
+            fakeClone.style.left = leftPos + "px";
+            fakeClone.style.width = width + "px";
+            fakeClone.style.height = height + "px";
+            PopsCore.document.body.appendChild(fakeClone);
+            var returnValue = fakeRange.getBoundingClientRect(); //Get rect
+            if (!debug)
+                fakeClone.parentNode.removeChild(fakeClone); //Remove temp
+            return returnValue;
+            // Local functions for readability of the previous code
+            /**
+             *
+             * @param start
+             * @param end
+             */
+            function appendPart(start, end) {
+                var span = document.createElement("span");
+                span.style.cssText = cssDefaultStyles; //Force styles to prevent unexpected results
+                span.textContent = text.substring(start, end);
+                fakeClone.appendChild(span);
+                return span;
+            }
+            // Computing offset position
+            function getInputOffset() {
+                var body = document.body, win = document.defaultView, docElem = document.documentElement, box = document.createElement("div");
+                box.style.paddingLeft = box.style.width = "1px";
+                body.appendChild(box);
+                var isBoxModel = box.offsetWidth == 2;
+                body.removeChild(box);
+                // @ts-ignore
+                box = input.getBoundingClientRect();
+                var clientTop = docElem.clientTop || body.clientTop || 0, clientLeft = docElem.clientLeft || body.clientLeft || 0, scrollTop = 
+                // @ts-ignore
+                win.pageYOffset ||
+                    (isBoxModel && docElem.scrollTop) ||
+                    body.scrollTop, scrollLeft = 
+                // @ts-ignore
+                win.pageXOffset ||
+                    (isBoxModel && docElem.scrollLeft) ||
+                    body.scrollLeft;
+                return {
+                    // @ts-ignore
+                    top: box.top + scrollTop - clientTop,
+                    // @ts-ignore
+                    left: box.left + scrollLeft - clientLeft,
+                };
+            }
+            /**
+             *
+             * @param prop
+             * @param isnumber
+             * @returns
+             */
+            function getInputCSS(prop, isnumber) {
+                var val = PopsCore.document
+                    .defaultView.getComputedStyle(input, null)
+                    .getPropertyValue(prop);
+                // @ts-ignore
+                return isnumber ? parseFloat(val) : val;
+            }
+        }
+        /**
+         * 使用className来隐藏元素
+         * @param ele
+         * @param isImportant 是否使用!important
+         */
+        cssHide(ele, isImportant = false) {
+            if (ele == null) {
+                return;
+            }
+            if (isImportant) {
+                ele.classList.add("pops-hide-important");
+            }
+            else {
+                ele.classList.add("pops-hide");
+            }
+        }
+        /**
+         * cssHide的反向使用
+         * @param ele
+         */
+        cssShow(ele) {
+            if (ele == null) {
+                return;
+            }
+            ele.classList.remove("pops-hide-important");
+            ele.classList.remove("pops-hide");
+        }
+        parseHTML(html, useParser = false, isComplete = false) {
+            function parseHTMLByDOMParser() {
+                let parser = new DOMParser();
+                if (isComplete) {
+                    return parser.parseFromString(html, "text/html");
+                }
+                else {
+                    return parser.parseFromString(html, "text/html").body.firstChild;
+                }
+            }
+            function parseHTMLByCreateDom() {
+                let tempDIV = PopsCore.document.createElement("div");
+                tempDIV.innerHTML = html;
+                if (isComplete) {
+                    return tempDIV;
+                }
+                else {
+                    return tempDIV.firstChild;
+                }
+            }
+            if (useParser) {
+                return parseHTMLByDOMParser();
+            }
+            else {
+                return parseHTMLByCreateDom();
+            }
+        }
+        /**
+         * 函数在元素内部末尾添加子元素或HTML字符串
+         * @param element 目标元素
+         * @param content 子元素或HTML字符串
+         * @example
+         * // 元素a.xx的内部末尾添加一个元素
+         * DOMUtils.append(document.querySelector("a.xx"),document.querySelector("b.xx"))
+         * DOMUtils.append("a.xx","'<b class="xx"></b>")
+         * */
+        append(element, content) {
+            if (typeof element === "string") {
+                element = PopsCore.document.querySelector(element);
+            }
+            if (element == null) {
+                return;
+            }
+            function elementAppendChild(ele, text) {
+                if (typeof content === "string") {
+                    ele.insertAdjacentHTML("beforeend", text);
+                }
+                else {
+                    ele.appendChild(text);
+                }
+            }
+            if (Array.isArray(content) || content instanceof NodeList) {
+                /* 数组 */
+                let fragment = PopsCore.document.createDocumentFragment();
+                content.forEach((ele) => {
+                    if (typeof ele === "string") {
+                        ele = this.parseHTML(ele, true, false);
+                    }
+                    fragment.appendChild(ele);
+                });
+                element.appendChild(fragment);
+            }
+            else {
+                elementAppendChild(element, content);
+            }
+        }
+        /**
+         * 把元素标签添加到head内
+         */
+        appendHead($ele) {
+            if (PopsCore.document.head) {
+                PopsCore.document.head.appendChild($ele);
+            }
+            else {
+                PopsCore.document.documentElement.appendChild($ele);
+            }
+        }
+        /**
+         * 把元素添加进body内
+         * @param $ele
+         */
+        appendBody($ele) {
+            if (PopsCore.document.body) {
+                PopsCore.document.body.appendChild($ele);
+            }
+            else {
+                PopsCore.document.documentElement.appendChild($ele);
+            }
+        }
+        /**
+         * 判断元素是否已显示或已连接
+         * @param element
+         */
+        isShow(element) {
+            return Boolean(element.getClientRects().length);
+        }
+        /**
+         * 用于显示元素并获取它的高度宽度等其它属性
+         * @param element
+         */
+        showElement(element) {
+            let dupNode = element.cloneNode(true);
+            dupNode.setAttribute("style", "visibility: hidden !important;display:block !important;");
+            PopsCore.document.documentElement.appendChild(dupNode);
+            return {
+                /**
+                 * 恢复修改的style
+                 */
+                recovery() {
+                    dupNode.remove();
+                },
+            };
+        }
+        /**
+         * 获取元素上的Float格式的属性px
+         * @param element
+         * @param styleName style名
+         */
+        getStyleValue(element, styleName) {
+            let view = null;
+            let styles = null;
+            if (element instanceof CSSStyleDeclaration) {
+                /* 直接就获取了style属性 */
+                styles = element;
+            }
+            else {
+                view = element.ownerDocument.defaultView;
+                if (!view || !view.opener) {
+                    view = window;
+                }
+                styles = view.getComputedStyle(element);
+            }
+            let value = parseFloat(styles[styleName]);
+            if (isNaN(value)) {
+                return 0;
+            }
+            else {
+                return value;
+            }
+        }
+    }
+    const popsDOMUtils = new PopsDOMUtils();
+
+    const PopsUIUtils = {
+        /**
+         * 获取所有弹窗中的最大的z-index
+         * @param defaultValue
+         */
+        getPopsMaxZIndex(defaultValue) {
+            let maxZIndex = 0;
+            let maxZIndexElement = null;
+            Object.keys(pops.config.layer).forEach((layerName) => {
+                let layerList = pops.config.layer[layerName];
+                layerList.forEach((layer) => {
+                    let itemZIndex = parseInt(getComputedStyle(layer.animElement).zIndex);
+                    maxZIndexElement =
+                        itemZIndex > maxZIndex ? layer.animElement : maxZIndexElement;
+                    maxZIndex = itemZIndex > maxZIndex ? itemZIndex : maxZIndex;
+                });
+            });
+            maxZIndex = maxZIndex === 0 ? defaultValue : maxZIndex;
+            return { zIndex: maxZIndex, animElement: maxZIndexElement };
+        },
+        /**
+         * 获取CSS Rule
+         * @param sheet
+         * @returns
+         */
+        getKeyFrames(sheet) {
+            let result = {};
+            Object.keys(sheet.cssRules).forEach((key) => {
+                if (sheet.cssRules[key].type === 7 &&
+                    sheet.cssRules[key].name.startsWith("pops-anim-")) {
+                    result[sheet.cssRules[key].name] = sheet.cssRules[key];
+                }
+            });
+            return result;
+        },
+        /**
+         * 删除配置中对应的对象
+         * @param moreLayerConfigList 配置实例列表
+         * @param  guid 唯一标识
+         * @param removeAll 是否全部删除
+         */
+        configRemove(moreLayerConfigList, guid, removeAll = false) {
+            /** @param item */
+            function removeItem(item) {
+                item?.animElement?.remove();
+                item?.popsElement?.remove();
+                item?.maskElement?.remove();
+                item?.$shadowContainer?.remove();
+            }
+            // [ layer[], layer[],...]
+            moreLayerConfigList.forEach((layerConfigList) => {
+                //  layer[]
+                layerConfigList.forEach((layerConfigItem, index) => {
+                    if (removeAll || layerConfigItem["guid"] === guid) {
+                        if (pops.config.animation.hasOwnProperty(layerConfigItem.animElement.getAttribute("anim"))) {
+                            layerConfigItem.animElement.style.width = "100%";
+                            layerConfigItem.animElement.style.height = "100%";
+                            layerConfigItem.animElement.style["animation-name"] =
+                                layerConfigItem.animElement.getAttribute("anim") + "-reverse";
+                            if (pops.config.animation.hasOwnProperty(layerConfigItem.animElement.style["animation-name"])) {
+                                popsDOMUtils.on(layerConfigItem.animElement, popsDOMUtils.getAnimationEndNameList(), function () {
+                                    removeItem(layerConfigItem);
+                                }, {
+                                    capture: true,
+                                });
+                            }
+                            else {
+                                removeItem(layerConfigItem);
+                            }
+                        }
+                        else {
+                            removeItem(layerConfigItem);
+                        }
+                        layerConfigList.splice(index, 1);
+                    }
+                });
+            });
+            return moreLayerConfigList;
+        },
+        /**
+         * 隐藏
+         * @param popsType
+         * @param layerConfigList
+         * @param guid
+         * @param config
+         * @param animElement
+         * @param maskElement
+         */
+        hide(popsType, layerConfigList, guid, config, animElement, maskElement) {
+            let popsElement = animElement.querySelector(".pops[type-value]");
+            if (popsType === "drawer") {
+                let drawerConfig = config;
+                setTimeout(() => {
+                    maskElement.style.setProperty("display", "none");
+                    if (["top", "bottom"].includes(drawerConfig.direction)) {
+                        popsElement.style.setProperty("height", "0");
+                    }
+                    else if (["left", "right"].includes(drawerConfig.direction)) {
+                        popsElement.style.setProperty("width", "0");
+                    }
+                    else {
+                        console.error("未知direction：", drawerConfig.direction);
+                    }
+                }, drawerConfig.closeDelay);
+            }
+            else {
+                layerConfigList.forEach((layerConfigItem) => {
+                    if (layerConfigItem.guid === guid) {
+                        /* 存在动画 */
+                        layerConfigItem.animElement.style.width = "100%";
+                        layerConfigItem.animElement.style.height = "100%";
+                        layerConfigItem.animElement.style["animation-name"] =
+                            layerConfigItem.animElement.getAttribute("anim") + "-reverse";
+                        if (pops.config.animation.hasOwnProperty(layerConfigItem.animElement.style["animation-name"])) {
+                            function animationendCallBack() {
+                                layerConfigItem.animElement.style.display = "none";
+                                if (layerConfigItem.maskElement) {
+                                    layerConfigItem.maskElement.style.display = "none";
+                                }
+                                popsDOMUtils.off(layerConfigItem.animElement, popsDOMUtils.getAnimationEndNameList(), animationendCallBack, {
+                                    capture: true,
+                                });
+                            }
+                            popsDOMUtils.on(layerConfigItem.animElement, popsDOMUtils.getAnimationEndNameList(), animationendCallBack, {
+                                capture: true,
+                            });
+                        }
+                        else {
+                            layerConfigItem.animElement.style.display = "none";
+                            if (layerConfigItem.maskElement) {
+                                layerConfigItem.maskElement.style.display = "none";
+                            }
+                        }
+                        return;
+                    }
+                });
+            }
+        },
+        /**
+         * 显示
+         * @param popsType
+         * @param layerConfigList
+         * @param guid
+         * @param config
+         * @param animElement
+         * @param maskElement
+         */
+        show(popsType, layerConfigList, guid, config, animElement, maskElement) {
+            let popsElement = animElement.querySelector(".pops[type-value]");
+            if (popsType === "drawer") {
+                let drawerConfig = config;
+                setTimeout(() => {
+                    maskElement.style.setProperty("display", "");
+                    let direction = drawerConfig.direction;
+                    let size = drawerConfig.size.toString();
+                    if (["top", "bottom"].includes(direction)) {
+                        popsElement.style.setProperty("height", size);
+                    }
+                    else if (["left", "right"].includes(direction)) {
+                        popsElement.style.setProperty("width", size);
+                    }
+                    else {
+                        console.error("未知direction：", direction);
+                    }
+                }, drawerConfig.openDelay);
+            }
+            else {
+                layerConfigList.forEach((layerConfigItem) => {
+                    if (layerConfigItem.guid === guid) {
+                        layerConfigItem.animElement.style.width = "";
+                        layerConfigItem.animElement.style.height = "";
+                        layerConfigItem.animElement.style["animation-name"] =
+                            layerConfigItem
+                                .animElement.getAttribute("anim")
+                                .replace("-reverse", "");
+                        if (pops.config.animation.hasOwnProperty(layerConfigItem.animElement.style["animation-name"])) {
+                            layerConfigItem.animElement.style.display = "";
+                            if (layerConfigItem.maskElement) {
+                                layerConfigItem.maskElement.style.display = "";
+                            }
+                            function animationendCallBack() {
+                                popsDOMUtils.off(layerConfigItem.animElement, popsDOMUtils.getAnimationEndNameList(), animationendCallBack, {
+                                    capture: true,
+                                });
+                            }
+                            popsDOMUtils.on(layerConfigItem.animElement, popsDOMUtils.getAnimationEndNameList(), animationendCallBack, {
+                                capture: true,
+                            });
+                        }
+                        else {
+                            layerConfigItem.animElement.style.display = "";
+                            if (layerConfigItem.maskElement) {
+                                layerConfigItem.maskElement.style.display = "";
+                            }
+                        }
+                    }
+                    return;
+                });
+            }
+        },
+        /**
+         * 关闭
+         * @param popsType
+         * @param layerConfigList
+         * @param guid
+         * @param config
+         * @param animElement
+         */
+        close(popsType, layerConfigList, guid, config, animElement) {
+            let popsElement = animElement.querySelector(".pops[type-value]");
+            let drawerConfig = config;
+            /**
+             * 动画结束事件
+             */
+            function transitionendEvent() {
+                function closeCallBack(event) {
+                    if (event.propertyName !== "transform") {
+                        return;
+                    }
+                    popsDOMUtils.off(popsElement, popsDOMUtils.getTransitionEndNameList(), void 0, closeCallBack);
+                    PopsUIUtils.configRemove([layerConfigList], guid);
+                }
+                /* 监听过渡结束 */
+                popsDOMUtils.on(popsElement, popsDOMUtils.getTransitionEndNameList(), closeCallBack);
+                let popsTransForm = getComputedStyle(popsElement).transform;
+                if (popsTransForm !== "none") {
+                    popsDOMUtils.trigger(popsElement, popsDOMUtils.getTransitionEndNameList(), void 0, true);
+                    return;
+                }
+                if (["top"].includes(drawerConfig.direction)) {
+                    popsElement.style.setProperty("transform", "translateY(-100%)");
+                }
+                else if (["bottom"].includes(drawerConfig.direction)) {
+                    popsElement.style.setProperty("transform", "translateY(100%)");
+                }
+                else if (["left"].includes(drawerConfig.direction)) {
+                    popsElement.style.setProperty("transform", "translateX(-100%)");
+                }
+                else if (["right"].includes(drawerConfig.direction)) {
+                    popsElement.style.setProperty("transform", "translateX(100%)");
+                }
+                else {
+                    console.error("未知direction：", drawerConfig.direction);
+                }
+            }
+            if (popsType === "drawer") {
+                setTimeout(() => {
+                    transitionendEvent();
+                }, drawerConfig.closeDelay);
+            }
+            else {
+                PopsUIUtils.configRemove([layerConfigList], guid);
+            }
+        },
+        /**
+         * 拖拽元素
+         * 说明：
+         * + 元素的position为absolute或者fixed
+         * + 会为元素的
+         * @param moveElement 需要拖拽的元素
+         * @param options 配置
+         */
+        drag(moveElement, options) {
+            options = Object.assign({
+                limit: true,
+                extraDistance: 3,
+                container: PopsCore.globalThis,
+            }, options);
+            let isMove = false;
+            /* 点击元素，left偏移 */
+            let clickElementLeftOffset = 0;
+            /* 点击元素，top偏移 */
+            let clickElementTopOffset = 0;
+            let AnyTouch = popsUtils.AnyTouch();
+            let anyTouchElement = new AnyTouch(options.dragElement, {
+                preventEvent(event) {
+                    if (typeof options.preventEvent === "function") {
+                        return options.preventEvent(event);
+                    }
+                    else {
+                        return false;
+                    }
+                },
+            });
+            popsDOMUtils.css(options.dragElement, {
+                cursor: "move",
+            });
+            /**
+             * 获取移动元素的transform偏移
+             */
+            function getTransform(element) {
+                let transform_left = 0;
+                let transform_top = 0;
+                let elementTransform = PopsCore.globalThis.getComputedStyle(element).transform;
+                if (elementTransform !== "none" &&
+                    elementTransform != null &&
+                    elementTransform !== "") {
+                    let elementTransformSplit = elementTransform
+                        .match(/\((.+)\)/)?.[1]
+                        .split(",");
+                    transform_left = Math.abs(parseInt(elementTransformSplit[4]));
+                    transform_top = Math.abs(parseInt(elementTransformSplit[5]));
+                }
+                return {
+                    transformLeft: transform_left,
+                    transformTop: transform_top,
+                };
+            }
+            /**
+             * 修改移动的元素的style
+             */
+            function changeMoveElementStyle(element) {
+                let old_transitionDuration = element.style.transitionDuration;
+                if (globalThis.getComputedStyle(element).transitionDuration !== "0s") {
+                    element.style.transitionDuration = "0s";
+                }
+                return () => {
+                    element.style.transitionDuration = old_transitionDuration;
+                };
+            }
+            /**
+             * 获取容器的高度、宽度，一般是window为容器
+             */
+            function getContainerWidthOrHeight(container) {
+                container = container ?? globalThis;
+                return {
+                    width: popsDOMUtils.width(container),
+                    height: popsDOMUtils.height(container),
+                };
+            }
+            /**
+             * 获取容器的最小left、top偏移
+             */
+            function getContainerTopOrLeft(container) {
+                container = container ?? globalThis;
+                if (popsUtils.isWin(container)) {
+                    return {
+                        left: 0,
+                        top: 0,
+                    };
+                }
+                else {
+                    let rect = container.getBoundingClientRect();
+                    return {
+                        left: rect.left,
+                        top: rect.top,
+                    };
+                }
+            }
+            let transformInfo = getTransform(moveElement);
+            let transformLeft = transformInfo.transformLeft;
+            let transformTop = transformInfo.transformTop;
+            let resumeMoveElementStyle = null;
+            anyTouchElement.on("pan", function (event) {
+                if (!isMove) {
+                    isMove = true;
+                    let rect = options.dragElement.getBoundingClientRect();
+                    clickElementLeftOffset = event.x - rect.left;
+                    clickElementTopOffset = event.y - rect.top;
+                    transformInfo = getTransform(moveElement);
+                    transformLeft = transformInfo.transformLeft;
+                    transformTop = transformInfo.transformTop;
+                    //if (event.nativeEvent.offsetX) {
+                    //  clickElementLeftOffset = parseInt(event.nativeEvent.offsetX);
+                    //} else {
+                    //  clickElementLeftOffset = parseInt(event.getOffset().x);
+                    //}
+                    //if (event.nativeEvent.offsetY) {
+                    //  clickElementTopOffset = parseInt(event.nativeEvent.offsetY);
+                    //} else {
+                    //  clickElementTopOffset = parseInt(event.getOffset().y);
+                    //}
+                    resumeMoveElementStyle = changeMoveElementStyle(moveElement);
+                }
+                /** 当前移动的left偏移 */
+                let currentMoveLeftOffset = event.x - clickElementLeftOffset + transformLeft;
+                /** 当前移动的top偏移 */
+                let currentMoveTopOffset = event.y - clickElementTopOffset + transformTop;
+                /* 拖拽移动 */
+                if (event.phase === "move") {
+                    if (options.limit) {
+                        /* 限制在容器内移动 */
+                        /* left偏移最大值 */
+                        let maxLeftOffset = getContainerWidthOrHeight(options.container).width -
+                            popsDOMUtils.width(moveElement) +
+                            transformLeft;
+                        let { left: minLeftOffset, top: minTopOffset } = getContainerTopOrLeft(options.container);
+                        /* top偏移的最大值 */
+                        let maxTopOffset = getContainerWidthOrHeight(options.container).height -
+                            popsDOMUtils.height(moveElement) +
+                            transformTop;
+                        if (currentMoveLeftOffset > maxLeftOffset) {
+                            /* 不允许超过容器的最大宽度 */
+                            currentMoveLeftOffset = maxLeftOffset;
+                        }
+                        if (currentMoveTopOffset > maxTopOffset) {
+                            /* 不允许超过容器的最大高度 */
+                            currentMoveTopOffset = maxTopOffset;
+                        }
+                        if (currentMoveLeftOffset - options.extraDistance * 2 <
+                            minLeftOffset + transformLeft) {
+                            /* 不允许left偏移小于容器最小值 */
+                            currentMoveLeftOffset = minLeftOffset + transformLeft;
+                            /* 最左边 +额外距离 */
+                            currentMoveLeftOffset += options.extraDistance;
+                        }
+                        else {
+                            /* 最右边 -额外距离 */
+                            currentMoveLeftOffset -= options.extraDistance;
+                        }
+                        if (currentMoveTopOffset - options.extraDistance * 2 <
+                            minTopOffset + transformTop) {
+                            /* 不允许top偏移小于容器最小值 */
+                            currentMoveTopOffset = minTopOffset + transformTop;
+                            /* 最上面 +额外距离 */
+                            currentMoveTopOffset += options.extraDistance;
+                        }
+                        else {
+                            /* 最下面 -额外距离 */
+                            currentMoveTopOffset -= options.extraDistance;
+                        }
+                    }
+                    if (typeof options.moveCallBack === "function") {
+                        options.moveCallBack(moveElement, currentMoveLeftOffset, currentMoveTopOffset);
+                    }
+                    popsDOMUtils.css(moveElement, {
+                        left: currentMoveLeftOffset + "px",
+                        top: currentMoveTopOffset + "px",
+                    });
+                }
+                /* 停止拖拽 */
+                if (event.phase === "end") {
+                    isMove = false;
+                    if (typeof resumeMoveElementStyle === "function") {
+                        resumeMoveElementStyle();
+                        resumeMoveElementStyle = null;
+                    }
+                    if (typeof options.endCallBack === "function") {
+                        options.endCallBack(moveElement, currentMoveLeftOffset, currentMoveTopOffset);
+                    }
+                }
+            });
+            /* 因为会覆盖上面的点击事件，主动触发一下 */
+            anyTouchElement.on(["click", "tap"], function (event) {
+                event.changedPoints.forEach((item) => {
+                    popsDOMUtils.trigger(item.target, "click", void 0, true);
+                });
+            });
+        },
+        /**
+         * 排序数组
+         * @param getBeforeValueFun
+         * @param getAfterValueFun
+         * @param sortByDesc 排序是否降序，默认降序
+         */
+        sortElementListByProperty(getBeforeValueFun, getAfterValueFun, sortByDesc = true) {
+            if (typeof sortByDesc !== "boolean") {
+                throw "参数 sortByDesc 必须为boolean类型";
+            }
+            if (getBeforeValueFun == null || getAfterValueFun == null) {
+                throw "获取前面的值或后面的值的方法不能为空";
+            }
+            return function (after_obj, before_obj) {
+                var beforeValue = getBeforeValueFun(before_obj); /*  前 */
+                var afterValue = getAfterValueFun(after_obj); /* 后 */
+                if (sortByDesc) {
+                    if (afterValue > beforeValue) {
+                        return -1;
+                    }
+                    else if (afterValue < beforeValue) {
+                        return 1;
+                    }
+                    else {
+                        return 0;
+                    }
+                }
+                else {
+                    if (afterValue < beforeValue) {
+                        return -1;
+                    }
+                    else if (afterValue > beforeValue) {
+                        return 1;
+                    }
+                    else {
+                        return 0;
+                    }
+                }
+            };
+        },
+    };
+
+    var indexCSS = "@charset \"utf-8\";\r\n* {\r\n\t-webkit-box-sizing: border-box;\r\n\tbox-sizing: border-box;\r\n\tmargin: 0;\r\n\tpadding: 0;\r\n\t-webkit-tap-highlight-color: transparent;\r\n\t/* 代替::-webkit-scrollbar */\r\n\tscrollbar-width: thin;\r\n}\r\n.pops {\r\n\t--pops-bg-opacity: 1;\r\n\t--pops-bd-opacity: 1;\r\n\t--pops-font-size: 16px;\r\n}\r\n.pops-mask {\r\n\t--pops-mask-bg-opacity: 0.4;\r\n}\r\n.pops {\r\n\tbackground-color: rgb(255, 255, 255, var(--pops-bg-opacity));\r\n\tborder-radius: 4px;\r\n\tborder: 1px solid rgb(235, 238, 245, var(--pops-bd-opacity));\r\n\tfont-size: var(--pops-font-size);\r\n\tbox-shadow: 0 0 12px rgba(0, 0, 0, 0.12);\r\n\tbox-sizing: border-box;\r\n\toverflow: hidden;\r\n\ttransition: all 0.35s;\r\n}\r\n.pops-anim {\r\n\tposition: fixed;\r\n\ttop: 0;\r\n\tright: 0;\r\n\tbottom: 0;\r\n\tleft: 0;\r\n\twidth: 100%;\r\n\theight: 100%;\r\n}\r\n.pops-anim[anim=\"\"] {\r\n\ttop: unset;\r\n\tright: unset;\r\n\tbottom: unset;\r\n\tleft: unset;\r\n\twidth: unset;\r\n\theight: unset;\r\n\ttransition: none;\r\n}\r\n/* 底部图标动画和样式 */\r\n.pops i.pops-bottom-icon[is-loading=\"true\"] {\r\n\tanimation: rotating 2s linear infinite;\r\n}\r\n.pops i.pops-bottom-icon {\r\n\theight: 1em;\r\n\twidth: 1em;\r\n\tline-height: 1em;\r\n\tdisplay: inline-flex;\r\n\tjustify-content: center;\r\n\talign-items: center;\r\n\tposition: relative;\r\n\tfill: currentColor;\r\n\tcolor: inherit;\r\n\tfont-size: inherit;\r\n}\r\n\r\n/* 遮罩层样式 */\r\n.pops-mask {\r\n\tposition: fixed;\r\n\ttop: 0;\r\n\tright: 0;\r\n\tbottom: 0;\r\n\tleft: 0;\r\n\twidth: 100%;\r\n\theight: 100%;\r\n\tborder: 0;\r\n\tborder-radius: 0;\r\n\tbackground-color: rgba(0, 0, 0, var(--pops-mask-bg-opacity));\r\n\tbox-shadow: none;\r\n\ttransition: none;\r\n}\r\n\r\n.pops-header-controls button.pops-header-control[type][data-header] {\r\n\tfloat: right;\r\n\tmargin: 0 0;\r\n\toutline: 0;\r\n\tborder: 0;\r\n\tborder-color: rgb(136, 136, 136, var(--pops-bd-opacity));\r\n\tbackground-color: transparent;\r\n\tcolor: #888;\r\n\tcursor: pointer;\r\n}\r\n.pops-header-controls button.pops-header-control[type=\"max\"],\r\n.pops-header-controls button.pops-header-control[type=\"mise\"],\r\n.pops-header-controls button.pops-header-control[type=\"min\"] {\r\n\tposition: relative;\r\n\tfloat: right;\r\n\tmargin: 0 2px;\r\n\toutline: 0 !important;\r\n\tborder: 0;\r\n\tborder-color: rgb(136, 136, 136, var(--pops-bd-opacity));\r\n\tbackground-color: transparent;\r\n\tcolor: rgb(136, 136, 136);\r\n\tcursor: pointer;\r\n\ttransition: all 0.3s ease-in-out;\r\n}\r\nbutton.pops-header-control i {\r\n\tcolor: rgb(144, 147, 153);\r\n\tfont-size: inherit;\r\n\tdisplay: inline-flex;\r\n\tjustify-content: center;\r\n\talign-items: center;\r\n\tposition: relative;\r\n\tfill: currentColor;\r\n}\r\nbutton.pops-header-control svg {\r\n\theight: 1.25em;\r\n\twidth: 1.25em;\r\n}\r\nbutton.pops-header-control {\r\n\tright: 15px;\r\n\tpadding: 0;\r\n\tborder: none;\r\n\toutline: 0;\r\n\tbackground: 0 0;\r\n\tcursor: pointer;\r\n\tposition: unset;\r\n\tline-height: 1.15;\r\n}\r\nbutton.pops-header-control i:hover {\r\n\tcolor: rgb(64, 158, 255);\r\n}\r\n.pops-header-controls[data-margin] button.pops-header-control {\r\n\tmargin: 0 6px;\r\n}\r\n.pops[type-value] .pops-header-controls {\r\n\tdisplay: flex;\r\n}\r\n";
+
+    var ninePalaceGridPositionCSS = ".pops[position=\"top_left\"] {\r\n\tposition: fixed;\r\n\ttop: 0;\r\n\tleft: 0;\r\n}\r\n.pops[position=\"top\"] {\r\n\tposition: fixed;\r\n\ttop: 0;\r\n\tleft: 50%;\r\n\ttransform: translateX(-50%);\r\n}\r\n.pops[position=\"top_right\"] {\r\n\tposition: fixed;\r\n\ttop: 0;\r\n\tright: 0;\r\n}\r\n.pops[position=\"center_left\"] {\r\n\tposition: fixed;\r\n\ttop: 50%;\r\n\tleft: 0;\r\n\ttransform: translateY(-50%);\r\n}\r\n.pops[position=\"center\"] {\r\n\tposition: fixed;\r\n\ttop: 50%;\r\n\tleft: 50%;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n.pops[position=\"center_right\"] {\r\n\tposition: fixed;\r\n\ttop: 50%;\r\n\tright: 0;\r\n\ttransform: translateY(-50%);\r\n}\r\n.pops[position=\"bottom_left\"] {\r\n\tposition: fixed;\r\n\tbottom: 0;\r\n\tleft: 0;\r\n}\r\n.pops[position=\"bottom\"] {\r\n\tposition: fixed;\r\n\tbottom: 0;\r\n\tleft: 50%;\r\n\ttransform: translate(-50%, 0);\r\n}\r\n.pops[position=\"bottom_right\"] {\r\n\tposition: fixed;\r\n\tright: 0;\r\n\tbottom: 0;\r\n}\r\n";
+
+    var scrollbarCSS = "/* firefox上暂不支持::-webkit-scrollbar */\r\n.pops ::-webkit-scrollbar {\r\n\twidth: 6px;\r\n\theight: 0;\r\n}\r\n\r\n.pops ::-webkit-scrollbar-track {\r\n\twidth: 0;\r\n}\r\n.pops ::-webkit-scrollbar-thumb:hover {\r\n\tbackground: rgb(178, 178, 178, var(--pops-bg-opacity));\r\n}\r\n.pops ::-webkit-scrollbar-thumb {\r\n\tmin-height: 28px;\r\n\tborder-radius: 2em;\r\n\tbackground: rgb(204, 204, 204, var(--pops-bg-opacity));\r\n\tbackground-clip: padding-box;\r\n}\r\n";
+
+    var buttonCSS = ".pops {\r\n\t--button-font-size: 14px;\r\n\t--button-height: 32px;\r\n\t--button-color: rgb(51, 51, 51);\r\n\t--button-bd-color: rgb(220, 223, 230, var(--pops-bd-opacity));\r\n\t--button-bg-color: rgb(220, 223, 230, var(--pops-bg-opacity));\r\n\t--button-margin-top: 0px;\r\n\t--button-margin-bottom: 0px;\r\n\t--button-margin-left: 5px;\r\n\t--button-margin-right: 5px;\r\n\t--button-padding-top: 6px;\r\n\t--button-padding-bottom: 6px;\r\n\t--button-padding-left: 12px;\r\n\t--button-padding-right: 12px;\r\n\t--button-radius: 4px;\r\n\r\n\t--container-title-height: 55px;\r\n\t--container-bottom-btn-height: 55px;\r\n}\r\n.pops[data-bottom-btn=\"false\"] {\r\n\t--container-bottom-btn-height: 0px;\r\n}\r\n.pops button {\r\n\twhite-space: nowrap;\r\n\tfloat: right;\r\n\tdisplay: inline-block;\r\n\tmargin: var(--button-margin-top) var(--button-margin-right)\r\n\t\tvar(--button-margin-bottom) var(--button-margin-left);\r\n\tpadding: var(--button-padding-top) var(--button-padding-right)\r\n\t\tvar(--button-padding-bottom) var(--button-padding-left);\r\n\toutline: 0;\r\n}\r\n.pops button[data-has-icon=\"false\"] .pops-bottom-icon {\r\n\tdisplay: none;\r\n}\r\n.pops button {\r\n\tborder-radius: var(--button-radius);\r\n\tbox-shadow: none;\r\n\tfont-weight: 400;\r\n\tfont-size: var(--button-font-size);\r\n\tcursor: pointer;\r\n\ttransition: all 0.3s ease-in-out;\r\n}\r\n.pops button {\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n\theight: var(--button-height);\r\n\tline-height: 1;\r\n\tbox-sizing: border-box;\r\n\tuser-select: none;\r\n\t-webkit-user-select: none;\r\n\t-moz-user-select: none;\r\n\t-ms-user-select: none;\r\n\tborder: 1px solid var(--button-bd-color);\r\n}\r\n.pops button {\r\n\tcolor: var(--button-color);\r\n\tborder-color: var(--button-bd-color);\r\n\tbackground-color: var(--button-bg-color);\r\n}\r\n.pops button:active {\r\n\tcolor: var(--button-color);\r\n\tborder-color: var(--button-bd-color);\r\n\tbackground-color: var(--button-bg-color);\r\n\toutline: 0;\r\n}\r\n.pops button:hover {\r\n\tcolor: var(--button-color);\r\n\tborder-color: var(--button-bd-color);\r\n\tbackground-color: var(--button-bg-color);\r\n}\r\n.pops button:focus-visible {\r\n\tcolor: var(--button-color);\r\n\tborder-color: var(--button-bd-color);\r\n\tbackground-color: var(--button-bg-color);\r\n}\r\n.pops button:disabled {\r\n\tcursor: not-allowed;\r\n\tcolor: var(--button-color);\r\n\tborder-color: var(--button-bd-color);\r\n\tbackground-color: var(--button-bg-color);\r\n}\r\n.pops button.pops-button-large {\r\n\t--button-height: 32px;\r\n\t--button-padding-top: 12px;\r\n\t--button-padding-bottom: 12px;\r\n\t--button-padding-left: 19px;\r\n\t--button-padding-right: 19px;\r\n\t--button-font-size: 14px;\r\n\t--button-border-radius: 4px;\r\n}\r\n\r\n.pops button.pops-button-small {\r\n\t--button-height: 24px;\r\n\t--button-padding-top: 5px;\r\n\t--button-padding-bottom: 5px;\r\n\t--button-padding-left: 11px;\r\n\t--button-padding-right: 11px;\r\n\t--button-font-size: 12px;\r\n\t--button-border-radius: 4px;\r\n}\r\n.pops-panel-button-no-icon .pops-panel-button_inner i {\r\n\tdisplay: none;\r\n}\r\n.pops-panel-button-right-icon {\r\n}\r\n.pops-panel-button-right-icon .pops-panel-button_inner {\r\n\tflex-direction: row-reverse;\r\n}\r\n.pops-panel-button-right-icon .pops-panel-button_inner i {\r\n}\r\n.pops-panel-button .pops-panel-button_inner i:has(svg),\r\n.pops-panel-button-right-icon .pops-panel-button-text {\r\n\tmargin-right: 6px;\r\n}\r\n\r\n.pops button[type=\"default\"] {\r\n\t--button-color: #333333;\r\n\t--button-bd-color: #dcdfe6;\r\n\t--button-bg-color: #ffffff;\r\n}\r\n.pops button[type=\"default\"]:active {\r\n\t--button-color: #409eff;\r\n\t--button-bd-color: #409eff;\r\n\t--button-bg-color: #ecf5ff;\r\n}\r\n.pops button[type=\"default\"]:hover {\r\n\t--button-color: #409eff;\r\n\t--button-bd-color: #c6e2ff;\r\n\t--button-bg-color: #ecf5ff;\r\n}\r\n.pops button[type=\"default\"]:focus-visible {\r\n\toutline: 2px solid #a0cfff;\r\n\toutline-offset: 1px;\r\n}\r\n.pops button[type=\"default\"]:disabled {\r\n\t--button-color: #a8abb2;\r\n\t--button-bd-color: #fff;\r\n\t--button-bg-color: #e4e7ed;\r\n}\r\n\r\n.pops button[type=\"primary\"] {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #409eff;\r\n\t--button-bg-color: #409eff;\r\n}\r\n.pops button[type=\"primary\"]:active {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #337ecc;\r\n\t--button-bg-color: #337ecc;\r\n}\r\n.pops button[type=\"primary\"]:hover {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #79bbff;\r\n\t--button-bg-color: #79bbff;\r\n}\r\n.pops button[type=\"primary\"]:focus-visible {\r\n\toutline: 2px solid #a0cfff;\r\n\toutline-offset: 1px;\r\n}\r\n.pops button[type=\"primary\"]:disabled {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #a0cfff;\r\n\t--button-bg-color: #a0cfff;\r\n}\r\n\r\n.pops button[type=\"success\"] {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #4cae4c;\r\n\t--button-bg-color: #5cb85c;\r\n}\r\n.pops button[type=\"success\"]:active {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #529b2e;\r\n\t--button-bg-color: #529b2e;\r\n}\r\n.pops button[type=\"success\"]:hover {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #95d475;\r\n\t--button-bg-color: #95d475;\r\n}\r\n.pops button[type=\"success\"]:focus-visible {\r\n\toutline: 2px solid #b3e19d;\r\n\toutline-offset: 1px;\r\n}\r\n.pops button[type=\"success\"]:disabled {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #b3e19d;\r\n\t--button-bg-color: #b3e19d;\r\n}\r\n\r\n.pops button[type=\"info\"] {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #909399;\r\n\t--button-bg-color: #909399;\r\n}\r\n.pops button[type=\"info\"]:active {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #73767a;\r\n\t--button-bg-color: #73767a;\r\n}\r\n.pops button[type=\"info\"]:hover {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #b1b3b8;\r\n\t--button-bg-color: #b1b3b8;\r\n}\r\n.pops button[type=\"info\"]:focus-visible {\r\n\toutline: 2px solid #c8c9cc;\r\n\toutline-offset: 1px;\r\n}\r\n.pops button[type=\"info\"]:disabled {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #c8c9cc;\r\n\t--button-bg-color: #c8c9cc;\r\n}\r\n\r\n.pops button[type=\"warning\"] {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #e6a23c;\r\n\t--button-bg-color: #e6a23c;\r\n}\r\n.pops button[type=\"warning\"]:active {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #b88230;\r\n\t--button-bg-color: #b88230;\r\n}\r\n.pops button[type=\"warning\"]:hover {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #eebe77;\r\n\t--button-bg-color: #eebe77;\r\n}\r\n.pops button[type=\"warning\"]:focus-visible {\r\n\toutline: 2px solid #f3d19e;\r\n\toutline-offset: 1px;\r\n}\r\n.pops button[type=\"warning\"]:disabled {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #f3d19e;\r\n\t--button-bg-color: #f3d19e;\r\n}\r\n\r\n.pops button[type=\"danger\"] {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #f56c6c;\r\n\t--button-bg-color: #f56c6c;\r\n}\r\n.pops button[type=\"danger\"]:active {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #c45656;\r\n\t--button-bg-color: #c45656;\r\n}\r\n.pops button[type=\"danger\"]:hover {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #f89898;\r\n\t--button-bg-color: #f89898;\r\n}\r\n.pops button[type=\"danger\"]:focus-visible {\r\n\toutline: 2px solid #fab6b6;\r\n\toutline-offset: 1px;\r\n}\r\n.pops button[type=\"danger\"]:disabled {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #fab6b6;\r\n\t--button-bg-color: #fab6b6;\r\n}\r\n\r\n.pops button[type=\"xiaomi-primary\"] {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #ff5c00;\r\n\t--button-bg-color: #ff5c00;\r\n}\r\n.pops button[type=\"xiaomi-primary\"]:active {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #da4f00;\r\n\t--button-bg-color: #da4f00;\r\n}\r\n.pops button[type=\"xiaomi-primary\"]:hover {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #ff7e29;\r\n\t--button-bg-color: #ff7e29;\r\n}\r\n.pops button[type=\"xiaomi-primary\"]:focus-visible {\r\n\toutline: 2px solid #fab6b6;\r\n\toutline-offset: 1px;\r\n}\r\n.pops button[type=\"xiaomi-primary\"]:disabled {\r\n\t--button-color: #ffffff;\r\n\t--button-bd-color: #fad5b6;\r\n\t--button-bg-color: #fad5b6;\r\n}\r\n";
+
+    var commonCSS = ".pops-flex-items-center {\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n}\r\n.pops-flex-y-center {\r\n\tdisplay: flex;\r\n\tjustify-content: space-between;\r\n}\r\n.pops-flex-x-center {\r\n\tdisplay: flex;\r\n\talign-content: center;\r\n}\r\n.pops-hide {\r\n\tdisplay: none;\r\n}\r\n.pops-hide-important {\r\n\tdisplay: none !important;\r\n}\r\n.pops-no-border {\r\n\tborder: 0;\r\n}\r\n.pops-no-border-important {\r\n\tborder: 0;\r\n}\r\n";
+
+    var animCSS = "@keyframes rotating {\r\n\t0% {\r\n\t\ttransform: rotate(0);\r\n\t}\r\n\tto {\r\n\t\ttransform: rotate(360deg);\r\n\t}\r\n}\r\n@keyframes iframeLoadingChange_85 {\r\n\t0% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #fff, rgb(202 224 246));\r\n\t}\r\n\t20% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #ead0d0, rgb(123 185 246));\r\n\t}\r\n\t40% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #f4b7b7, rgb(112 178 244));\r\n\t}\r\n\t60% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #ec9393, rgb(80 163 246));\r\n\t}\r\n\t80% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #e87f7f, rgb(25 139 253));\r\n\t}\r\n\t100% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #ee2c2c, rgb(0 124 247));\r\n\t}\r\n\tfrom {\r\n\t\twidth: 75%;\r\n\t}\r\n\tto {\r\n\t\twidth: 100%;\r\n\t}\r\n}\r\n@keyframes iframeLoadingChange {\r\n\t0% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #fff, rgb(202 224 246));\r\n\t}\r\n\t20% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #ead0d0, rgb(123 185 246));\r\n\t}\r\n\t40% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #f4b7b7, rgb(112 178 244));\r\n\t}\r\n\t60% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #ec9393, rgb(80 163 246));\r\n\t}\r\n\t80% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #e87f7f, rgb(25 139 253));\r\n\t}\r\n\t100% {\r\n\t\tbackground: linear-gradient(to right, #4995dd, #ee2c2c, rgb(0 124 247));\r\n\t}\r\n\tfrom {\r\n\t\twidth: 0;\r\n\t}\r\n\tto {\r\n\t\twidth: 75%;\r\n\t}\r\n}\r\n@keyframes pops-anim-wait-rotate {\r\n\tform {\r\n\t\ttransform: rotate(0);\r\n\t}\r\n\tto {\r\n\t\ttransform: rotate(360deg);\r\n\t}\r\n}\r\n@keyframes pops-anim-spread {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: scaleX(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: scaleX(1);\r\n\t}\r\n}\r\n@keyframes pops-anim-shake {\r\n\t0%,\r\n\t100% {\r\n\t\ttransform: translateX(0);\r\n\t}\r\n\t10%,\r\n\t30%,\r\n\t50%,\r\n\t70%,\r\n\t90% {\r\n\t\ttransform: translateX(-10px);\r\n\t}\r\n\t20%,\r\n\t40%,\r\n\t60%,\r\n\t80% {\r\n\t\ttransform: translateX(10px);\r\n\t}\r\n}\r\n@keyframes pops-anim-rolling-left {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateX(-100%) rotate(-120deg);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateX(0) rotate(0);\r\n\t}\r\n}\r\n@keyframes pops-anim-rolling-right {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateX(100%) rotate(120deg);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateX(0) rotate(0);\r\n\t}\r\n}\r\n@keyframes pops-anim-slide-top {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateY(-200%);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateY(0);\r\n\t}\r\n}\r\n@keyframes pops-anim-slide-bottom {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateY(200%);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateY(0);\r\n\t}\r\n}\r\n@keyframes pops-anim-slide-left {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateX(-200%);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateX(0);\r\n\t}\r\n}\r\n@keyframes pops-anim-slide-right {\r\n\t0% {\r\n\t\ttransform: translateX(200%);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateX(0);\r\n\t}\r\n}\r\n@keyframes pops-anim-fadein {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t}\r\n}\r\n@keyframes pops-anim-fadein-zoom {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: scale(0.5);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: scale(1);\r\n\t}\r\n}\r\n@keyframes pops-anim-fadein-alert {\r\n\t0% {\r\n\t\ttransform: scale(0.5);\r\n\t}\r\n\t45% {\r\n\t\ttransform: scale(1.05);\r\n\t}\r\n\t80% {\r\n\t\ttransform: scale(0.95);\r\n\t}\r\n\t100% {\r\n\t\ttransform: scale(1);\r\n\t}\r\n}\r\n@keyframes pops-anim-don {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t2.08333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.75266,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.76342,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t4.16667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.81071,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.84545,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t6.25% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.86808,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.9286,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t8.33333% {\r\n\t\ttransform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t10.4167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.96482,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.05202,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t12.5% {\r\n\t\ttransform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t14.5833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.02563,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.09149,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t16.6667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.04227,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.08453,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t18.75% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.05102,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.06666,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t20.8333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.05334,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.04355,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t22.9167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.05078,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.02012,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t25% {\r\n\t\ttransform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t27.0833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.03699,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.98534,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t29.1667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.02831,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.97688,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t31.25% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.01973,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.97422,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t33.3333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.01191,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.97618,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t35.4167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00526,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.98122,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t37.5% {\r\n\t\ttransform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t39.5833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99617,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99433,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t41.6667% {\r\n\t\ttransform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t43.75% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99237,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00413,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t45.8333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99202,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00651,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t47.9167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99241,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00726,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t50% {\r\n\t\topacity: 1;\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99329,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00671,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t52.0833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99447,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00529,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t54.1667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99577,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00346,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t56.25% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99705,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.0016,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t58.3333% {\r\n\t\ttransform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t60.4167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99921,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99884,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t62.5% {\r\n\t\ttransform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t64.5833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00057,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99795,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t66.6667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00095,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99811,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t68.75% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00114,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99851,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t70.8333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00119,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99903,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t72.9167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00114,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99955,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t75% {\r\n\t\ttransform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t77.0833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00083,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00033,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t79.1667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00063,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00052,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t81.25% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00044,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00058,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t83.3333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00027,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00053,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t85.4167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00012,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00042,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t87.5% {\r\n\t\ttransform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t89.5833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99991,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00013,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t91.6667% {\r\n\t\ttransform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t93.75% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99983,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99991,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t95.8333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99982,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99985,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t97.9167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99983,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99984,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n}\r\n@keyframes pops-anim-roll {\r\n\t0% {\r\n\t\ttransform: perspective(1000px) rotate3d(1, 0, 0, 90deg);\r\n\t}\r\n\t100% {\r\n\t\ttransform: perspective(1000px) rotate3d(1, 0, 0, 0deg);\r\n\t}\r\n}\r\n@keyframes pops-anim-sandra {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: scale3d(1.1, 1.1, 1);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: scale3d(1, 1, 1);\r\n\t}\r\n}\r\n@keyframes pops-anim-gather {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: scale(5, 0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: scale(1, 1);\r\n\t}\r\n}\r\n@keyframes pops-anim-spread-reverse {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\ttransform: scaleX(1);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\ttransform: scaleX(0);\r\n\t}\r\n}\r\n@keyframes pops-anim-shake-reverse {\r\n\t0%,\r\n\t100% {\r\n\t\ttransform: translateX(10px);\r\n\t}\r\n\t10%,\r\n\t30%,\r\n\t50%,\r\n\t70%,\r\n\t90% {\r\n\t\ttransform: translateX(-10px);\r\n\t}\r\n\t20%,\r\n\t40%,\r\n\t60%,\r\n\t80% {\r\n\t\ttransform: translateX(0);\r\n\t}\r\n}\r\n@keyframes pops-anim-rolling-left-reverse {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateX(0) rotate(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateX(-100%) rotate(-120deg);\r\n\t}\r\n}\r\n@keyframes pops-anim-rolling-right-reverse {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateX(0) rotate(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateX(100%) rotate(120deg);\r\n\t}\r\n}\r\n@keyframes pops-anim-slide-top-reverse {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateY(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateY(-200%);\r\n\t}\r\n}\r\n@keyframes pops-anim-slide-bottom-reverse {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateY(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateY(200%);\r\n\t}\r\n}\r\n@keyframes pops-anim-slide-left-reverse {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateX(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateX(-200%);\r\n\t}\r\n}\r\n@keyframes pops-anim-slide-right-reverse {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateX(0);\r\n\t}\r\n\t100% {\r\n\t\ttransform: translateX(200%);\r\n\t}\r\n}\r\n@keyframes pops-anim-fadein-reverse {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t}\r\n}\r\n@keyframes pops-anim-fadein-zoom-reverse {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\ttransform: scale(1);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\ttransform: scale(0.5);\r\n\t}\r\n}\r\n@keyframes pops-anim-fadein-alert-reverse {\r\n\t0% {\r\n\t\ttransform: scale(1);\r\n\t}\r\n\t45% {\r\n\t\ttransform: scale(0.95);\r\n\t}\r\n\t80% {\r\n\t\ttransform: scale(1.05);\r\n\t}\r\n\t100% {\r\n\t\ttransform: scale(0.5);\r\n\t}\r\n}\r\n@keyframes pops-anim-don-reverse {\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\ttransform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t97.9167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.75266,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.76342,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t95.8333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.81071,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.84545,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t93.75% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.86808,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.9286,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t91.6667% {\r\n\t\ttransform: matrix3d(0.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t89.5833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.96482,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.05202,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t87.5% {\r\n\t\ttransform: matrix3d(1, 0, 0, 0, 0, 1.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t85.4167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.02563,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.09149,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t83.3333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.04227,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.08453,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t81.25% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.05102,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.06666,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t79.1667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.05334,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.04355,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t77.0833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.05078,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.02012,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t75% {\r\n\t\ttransform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t72.9167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.03699,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.98534,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t70.8333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.02831,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.97688,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t68.75% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.01973,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.97422,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t66.6667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.01191,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.97618,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t64.5833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00526,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.98122,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t62.5% {\r\n\t\ttransform: matrix3d(1, 0, 0, 0, 0, 0.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t60.4167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99617,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99433,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t58.3333% {\r\n\t\ttransform: matrix3d(0.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t56.25% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99237,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00413,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t54.1667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99202,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00651,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t52.0833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99241,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00726,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t50% {\r\n\t\topacity: 1;\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99329,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00671,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t47.9167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99447,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00529,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t45.8333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99577,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00346,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t43.75% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99705,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.0016,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t41.6667% {\r\n\t\ttransform: matrix3d(0.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t39.5833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99921,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99884,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t37.5% {\r\n\t\ttransform: matrix3d(1, 0, 0, 0, 0, 0.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t35.4167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00057,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99795,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t33.3333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00095,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99811,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t31.25% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00114,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99851,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t29.1667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00119,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99903,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t27.0833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00114,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99955,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t25% {\r\n\t\ttransform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t22.9167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00083,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00033,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t20.8333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00063,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00052,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t18.75% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00044,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00058,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t16.6667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00027,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00053,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t14.5833% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t1.00012,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00042,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t12.5% {\r\n\t\ttransform: matrix3d(1, 0, 0, 0, 0, 1.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t10.4167% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99991,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1.00013,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t8.33333% {\r\n\t\ttransform: matrix3d(0.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);\r\n\t}\r\n\t6.25% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99983,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99991,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t4.16667% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99982,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99985,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t2.08333% {\r\n\t\ttransform: matrix3d(\r\n\t\t\t0.99983,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0.99984,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\ttransform: matrix3d(\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t1,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0,\r\n\t\t\t0type=close,\r\n\t\t\t1\r\n\t\t);\r\n\t}\r\n}\r\n@keyframes pops-anim-roll-reverse {\r\n\t0% {\r\n\t\ttransform: perspective(1000px) rotate3d(1, 0, 0, 0deg);\r\n\t}\r\n\t100% {\r\n\t\ttransform: perspective(1000px) rotate3d(1, 0, 0, 90deg);\r\n\t}\r\n}\r\n@keyframes pops-anim-sandra-reverse {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\ttransform: scale3d(1, 1, 1);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\ttransform: scale3d(1.1, 1.1, 1);\r\n\t}\r\n}\r\n@keyframes pops-anim-gather-reverse {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: scale(5, 0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\ttransform: scale(5, 0);\r\n\t}\r\n}\r\n\r\n@-webkit-keyframes pops-motion-fadeInTop {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateY(-30px);\r\n\t\ttransform: translateY(-30px);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateX(0);\r\n\t\ttransform: translateX(0);\r\n\t}\r\n}\r\n@keyframes pops-motion-fadeInTop {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateY(-30px);\r\n\t\t-ms-transform: translateY(-30px);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateX(0);\r\n\t\t-ms-transform: translateX(0);\r\n\t}\r\n}\r\n@-webkit-keyframes pops-motion-fadeOutTop {\r\n\t0% {\r\n\t\topacity: 10;\r\n\t\t-webkit-transform: translateY(0);\r\n\t\ttransform: translateY(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateY(-30px);\r\n\t\ttransform: translateY(-30px);\r\n\t}\r\n}\r\n@keyframes pops-motion-fadeOutTop {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\ttransform: translateY(0);\r\n\t\t-ms-transform: translateY(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\ttransform: translateY(-30px);\r\n\t\t-ms-transform: translateY(-30px);\r\n\t}\r\n}\r\n@-webkit-keyframes pops-motion-fadeInBottom {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateY(20px);\r\n\t\ttransform: translateY(20px);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateY(0);\r\n\t\ttransform: translateY(0);\r\n\t}\r\n}\r\n@keyframes pops-motion-fadeInBottom {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateY(20px);\r\n\t\ttransform: translateY(20px);\r\n\t\t-ms-transform: translateY(20px);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateY(0);\r\n\t\ttransform: translateY(0);\r\n\t\t-ms-transform: translateY(0);\r\n\t}\r\n}\r\n@-webkit-keyframes pops-motion-fadeOutBottom {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateY(0);\r\n\t\ttransform: translateY(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateY(20px);\r\n\t\ttransform: translateY(20px);\r\n\t}\r\n}\r\n@keyframes pops-motion-fadeOutBottom {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateY(0);\r\n\t\ttransform: translateY(0);\r\n\t\t-ms-transform: translateY(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateY(20px);\r\n\t\ttransform: translateY(20px);\r\n\t\t-ms-transform: translateY(20px);\r\n\t}\r\n}\r\n@-webkit-keyframes pops-motion-fadeInLeft {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateX(-20px);\r\n\t\ttransform: translateX(-20px);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateX(0);\r\n\t\ttransform: translateX(0);\r\n\t}\r\n}\r\n@keyframes pops-motion-fadeInLeft {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateX(-30px);\r\n\t\ttransform: translateX(-30px);\r\n\t\t-ms-transform: translateX(-30px);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateX(0);\r\n\t\ttransform: translateX(0);\r\n\t\t-ms-transform: translateX(0);\r\n\t}\r\n}\r\n@-webkit-keyframes pops-motion-fadeOutLeft {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateX(0);\r\n\t\ttransform: translateX(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateX(-30px);\r\n\t\ttransform: translateX(-30px);\r\n\t}\r\n}\r\n@keyframes pops-motion-fadeOutLeft {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateX(0);\r\n\t\ttransform: translateX(0);\r\n\t\t-ms-transform: translateX(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateX(-20px);\r\n\t\ttransform: translateX(-20px);\r\n\t\t-ms-transform: translateX(-20px);\r\n\t}\r\n}\r\n@-webkit-keyframes pops-motion-fadeInRight {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateX(20px);\r\n\t\ttransform: translateX(20px);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateX(0);\r\n\t\ttransform: translateX(0);\r\n\t}\r\n}\r\n@keyframes pops-motion-fadeInRight {\r\n\t0% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateX(20px);\r\n\t\ttransform: translateX(20px);\r\n\t\t-ms-transform: translateX(20px);\r\n\t}\r\n\t100% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateX(0);\r\n\t\ttransform: translateX(0);\r\n\t\t-ms-transform: translateX(0);\r\n\t}\r\n}\r\n@-webkit-keyframes pops-motion-fadeOutRight {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateX(0);\r\n\t\ttransform: translateX(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateX(20px);\r\n\t\ttransform: translateX(20px);\r\n\t}\r\n}\r\n@keyframes pops-motion-fadeOutRight {\r\n\t0% {\r\n\t\topacity: 1;\r\n\t\t-webkit-transform: translateX(0);\r\n\t\ttransform: translateX(0);\r\n\t\t-ms-transform: translateX(0);\r\n\t}\r\n\t100% {\r\n\t\topacity: 0;\r\n\t\t-webkit-transform: translateX(20px);\r\n\t\ttransform: translateX(20px);\r\n\t\t-ms-transform: translateX(20px);\r\n\t}\r\n}\r\n\r\n/* 动画 */\r\n.pops-anim[anim=\"pops-anim-spread\"] {\r\n\tanimation: pops-anim-spread 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-shake\"] {\r\n\tanimation: pops-anim-shake 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-rolling-left\"] {\r\n\tanimation: pops-anim-rolling-left 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-rolling-right\"] {\r\n\tanimation: pops-anim-rolling-right 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-slide-top\"] {\r\n\tanimation: pops-anim-slide-top 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-slide-bottom\"] {\r\n\tanimation: pops-anim-slide-bottom 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-slide-left\"] {\r\n\tanimation: pops-anim-slide-left 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-slide-right\"] {\r\n\tanimation: pops-anim-slide-right 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-fadein\"] {\r\n\tanimation: pops-anim-fadein 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-fadein-zoom\"] {\r\n\tanimation: pops-anim-fadein-zoom 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-fadein-alert\"] {\r\n\tanimation: pops-anim-fadein-alert 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-don\"] {\r\n\tanimation: pops-anim-don 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-roll\"] {\r\n\tanimation: pops-anim-roll 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-sandra\"] {\r\n\tanimation: pops-anim-sandra 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-gather\"] {\r\n\tanimation: pops-anim-gather 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-spread-reverse\"] {\r\n\tanimation: pops-anim-spread-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-shake-reverse\"] {\r\n\tanimation: pops-anim-shake-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-rolling-left-reverse\"] {\r\n\tanimation: pops-anim-rolling-left-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-rolling-right-reverse\"] {\r\n\tanimation: pops-anim-rolling-right-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-slide-top-reverse\"] {\r\n\tanimation: pops-anim-slide-top-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-slide-bottom-reverse\"] {\r\n\tanimation: pops-anim-slide-bottom-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-slide-left-reverse\"] {\r\n\tanimation: pops-anim-slide-left-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-slide-right-reverse\"] {\r\n\tanimation: pops-anim-slide-right-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-fadein-reverse\"] {\r\n\tanimation: pops-anim-fadein-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-fadein-zoom-reverse\"] {\r\n\tanimation: pops-anim-fadein-zoom-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-fadein-alert-reverse\"] {\r\n\tanimation: pops-anim-fadein-alert-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-don-reverse\"] {\r\n\tanimation: pops-anim-don-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-roll-reverse\"] {\r\n\tanimation: pops-anim-roll-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-sandra-reverse\"] {\r\n\tanimation: pops-anim-sandra-reverse 0.3s;\r\n}\r\n.pops-anim[anim=\"pops-anim-gather-reverse\"] {\r\n\tanimation: pops-anim-gather-reverse 0.3s;\r\n}\r\n";
+
+    var alertCSS = ".pops[type-value] .pops-alert-title {\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n\tjustify-content: space-between;\r\n}\r\n.pops[type-value=\"alert\"] .pops-alert-title {\r\n\twidth: 100%;\r\n\theight: var(--container-title-height);\r\n\tborder-bottom: 1px solid rgb(229, 229, 229, var(--pops-bd-opacity));\r\n}\r\n.pops[type-value=\"alert\"] .pops-alert-title p[pops] {\r\n\twidth: 100%;\r\n\toverflow: hidden;\r\n\tcolor: rgb(51, 51, 51);\r\n\ttext-indent: 15px;\r\n\ttext-overflow: ellipsis;\r\n\twhite-space: nowrap;\r\n\tfont-weight: 500;\r\n\tline-height: var(--container-title-height);\r\n}\r\n.pops[type-value=\"alert\"] .pops-alert-content p[pops] {\r\n\tpadding: 5px 10px;\r\n\tcolor: rgb(51, 51, 51);\r\n\ttext-indent: 15px;\r\n}\r\n.pops[type-value=\"alert\"] .pops-alert-content {\r\n\twidth: 100%;\r\n\theight: calc(\r\n\t\t100% - var(--container-title-height) - var(--container-bottom-btn-height)\r\n\t);\r\n\toverflow: auto;\r\n\tword-break: break-word;\r\n}\r\n.pops[type-value=\"alert\"] .pops-alert-btn {\r\n\tposition: absolute;\r\n\tbottom: 0;\r\n\tdisplay: flex;\r\n\tpadding: 10px 10px 10px 10px;\r\n\twidth: 100%;\r\n\theight: var(--container-bottom-btn-height);\r\n\tborder-top: 1px solid rgb(229, 229, 229, var(--pops-bd-opacity));\r\n\ttext-align: right;\r\n\tline-height: var(--container-bottom-btn-height);\r\n\talign-items: center;\r\n}\r\n";
+
+    var confirmCSS = ".pops[type-value] .pops-confirm-title {\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n\tjustify-content: space-between;\r\n}\r\n.pops[type-value=\"confirm\"] .pops-confirm-title {\r\n\twidth: 100%;\r\n\theight: var(--container-title-height);\r\n\tborder-bottom: 1px solid rgb(229, 229, 229, var(--pops-bd-opacity));\r\n}\r\n.pops[type-value=\"confirm\"] .pops-confirm-title p[pops] {\r\n\twidth: 100%;\r\n\toverflow: hidden;\r\n\tcolor: rgb(51, 51, 51);\r\n\ttext-indent: 15px;\r\n\ttext-overflow: ellipsis;\r\n\twhite-space: nowrap;\r\n\tfont-weight: 500;\r\n\tline-height: var(--container-title-height);\r\n}\r\n.pops[type-value=\"confirm\"] .pops-confirm-content p[pops] {\r\n\tpadding: 5px 10px;\r\n\tcolor: rgb(51, 51, 51);\r\n\ttext-indent: 15px;\r\n}\r\n.pops[type-value=\"confirm\"] .pops-confirm-content {\r\n\twidth: 100%;\r\n\theight: calc(\r\n\t\t100% - var(--container-title-height) - var(--container-bottom-btn-height)\r\n\t);\r\n\toverflow: auto;\r\n\tword-break: break-word;\r\n}\r\n.pops[type-value=\"confirm\"] .pops-confirm-btn {\r\n\tposition: absolute;\r\n\tbottom: 0;\r\n\tdisplay: flex;\r\n\tpadding: 10px 10px 10px 10px;\r\n\twidth: 100%;\r\n\theight: var(--container-bottom-btn-height);\r\n\tborder-top: 1px solid rgb(229, 229, 229, var(--pops-bd-opacity));\r\n\ttext-align: right;\r\n\tline-height: var(--container-bottom-btn-height);\r\n\talign-items: center;\r\n}\r\n";
+
+    var SVG_min = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M128 544h768a32 32 0 1 0 0-64H128a32 32 0 0 0 0 64z\"></path>\r\n</svg>\r\n";
+
+    var SVG_mise = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M885.333333 85.333333H330.410667a53.333333 53.333333 0 0 0-53.333334 53.333334v106.666666H138.666667A53.333333 53.333333 0 0 0 85.333333 298.666667v586.666666a53.333333 53.333333 0 0 0 53.333334 53.333334H725.333333a53.333333 53.333333 0 0 0 53.333334-53.333334V746.154667h106.666666c29.44 0 53.333333-23.893333 53.333334-53.333334V138.666667A53.333333 53.333333 0 0 0 885.333333 85.333333zM725.333333 692.821333v192.512H138.666667V298.666667H725.333333v394.154666z m157.866667 0H778.666667V298.666667a53.333333 53.333333 0 0 0-53.333334-53.333334H330.410667v-106.666666h554.922666l-2.133333 554.154666z\"></path>\r\n</svg>\r\n";
+
+    var SVG_max = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"m160 96.064 192 .192a32 32 0 0 1 0 64l-192-.192V352a32 32 0 0 1-64 0V96h64v.064zm0 831.872V928H96V672a32 32 0 1 1 64 0v191.936l192-.192a32 32 0 1 1 0 64l-192 .192zM864 96.064V96h64v256a32 32 0 1 1-64 0V160.064l-192 .192a32 32 0 1 1 0-64l192-.192zm0 831.872-192-.192a32 32 0 0 1 0-64l192 .192V672a32 32 0 1 1 64 0v256h-64v-.064z\"></path>\r\n</svg>\r\n";
+
+    var SVG_close = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M764.288 214.592 512 466.88 259.712 214.592a31.936 31.936 0 0 0-45.12 45.12L466.752 512 214.528 764.224a31.936 31.936 0 1 0 45.12 45.184L512 557.184l252.288 252.288a31.936 31.936 0 0 0 45.12-45.12L557.12 512.064l252.288-252.352a31.936 31.936 0 1 0-45.12-45.184z\"></path>\r\n</svg>\r\n";
+
+    var SVG_edit = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M832 512a32 32 0 1 1 64 0v352a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h352a32 32 0 0 1 0 64H192v640h640V512z\"></path>\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"m469.952 554.24 52.8-7.552L847.104 222.4a32 32 0 1 0-45.248-45.248L477.44 501.44l-7.552 52.8zm422.4-422.4a96 96 0 0 1 0 135.808l-331.84 331.84a32 32 0 0 1-18.112 9.088L436.8 623.68a32 32 0 0 1-36.224-36.224l15.104-105.6a32 32 0 0 1 9.024-18.112l331.904-331.84a96 96 0 0 1 135.744 0z\"></path>\r\n</svg>\r\n";
+
+    var SVG_share = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"m679.872 348.8-301.76 188.608a127.808 127.808 0 0 1 5.12 52.16l279.936 104.96a128 128 0 1 1-22.464 59.904l-279.872-104.96a128 128 0 1 1-16.64-166.272l301.696-188.608a128 128 0 1 1 33.92 54.272z\"></path>\r\n</svg>\r\n";
+
+    var SVG_delete = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M160 256H96a32 32 0 0 1 0-64h256V95.936a32 32 0 0 1 32-32h256a32 32 0 0 1 32 32V192h256a32 32 0 1 1 0 64h-64v672a32 32 0 0 1-32 32H192a32 32 0 0 1-32-32V256zm448-64v-64H416v64h192zM224 896h576V256H224v640zm192-128a32 32 0 0 1-32-32V416a32 32 0 0 1 64 0v320a32 32 0 0 1-32 32zm192 0a32 32 0 0 1-32-32V416a32 32 0 0 1 64 0v320a32 32 0 0 1-32 32z\"></path>\r\n</svg>\r\n";
+
+    var SVG_search = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"m795.904 750.72 124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704 352 352 0 0 0 0 704z\"></path>\r\n</svg>\r\n";
+
+    var SVG_upload = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M160 832h704a32 32 0 1 1 0 64H160a32 32 0 1 1 0-64zm384-578.304V704h-64V247.296L237.248 490.048 192 444.8 508.8 128l316.8 316.8-45.312 45.248L544 253.696z\"></path>\r\n</svg>\r\n";
+
+    var SVG_loading = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M512 64a32 32 0 0 1 32 32v192a32 32 0 0 1-64 0V96a32 32 0 0 1 32-32zm0 640a32 32 0 0 1 32 32v192a32 32 0 1 1-64 0V736a32 32 0 0 1 32-32zm448-192a32 32 0 0 1-32 32H736a32 32 0 1 1 0-64h192a32 32 0 0 1 32 32zm-640 0a32 32 0 0 1-32 32H96a32 32 0 0 1 0-64h192a32 32 0 0 1 32 32zM195.2 195.2a32 32 0 0 1 45.248 0L376.32 331.008a32 32 0 0 1-45.248 45.248L195.2 240.448a32 32 0 0 1 0-45.248zm452.544 452.544a32 32 0 0 1 45.248 0L828.8 783.552a32 32 0 0 1-45.248 45.248L647.744 692.992a32 32 0 0 1 0-45.248zM828.8 195.264a32 32 0 0 1 0 45.184L692.992 376.32a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0zm-452.544 452.48a32 32 0 0 1 0 45.248L240.448 828.8a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0z\"></path>\r\n</svg>\r\n";
+
+    var SVG_next = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z\"></path>\r\n</svg>\r\n";
+
+    var SVG_prev = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z\"></path>\r\n</svg>\r\n";
+
+    var SVG_eleme = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M300.032 188.8c174.72-113.28 408-63.36 522.24 109.44 5.76 10.56 11.52 20.16 17.28 30.72v.96a22.4 22.4 0 0 1-7.68 26.88l-352.32 228.48c-9.6 6.72-22.08 3.84-28.8-5.76l-18.24-27.84a54.336 54.336 0 0 1 16.32-74.88l225.6-146.88c9.6-6.72 12.48-19.2 5.76-28.8-.96-1.92-1.92-3.84-3.84-4.8a267.84 267.84 0 0 0-315.84-17.28c-123.84 81.6-159.36 247.68-78.72 371.52a268.096 268.096 0 0 0 370.56 78.72 54.336 54.336 0 0 1 74.88 16.32l17.28 26.88c5.76 9.6 3.84 21.12-4.8 27.84-8.64 7.68-18.24 14.4-28.8 21.12a377.92 377.92 0 0 1-522.24-110.4c-113.28-174.72-63.36-408 111.36-522.24zm526.08 305.28a22.336 22.336 0 0 1 28.8 5.76l23.04 35.52a63.232 63.232 0 0 1-18.24 87.36l-35.52 23.04c-9.6 6.72-22.08 3.84-28.8-5.76l-46.08-71.04c-6.72-9.6-3.84-22.08 5.76-28.8l71.04-46.08z\"></path>\r\n</svg>\r\n";
+
+    var SVG_elemePlus = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\td=\"M839.7 734.7c0 33.3-17.9 41-17.9 41S519.7 949.8 499.2 960c-10.2 5.1-20.5 5.1-30.7 0 0 0-314.9-184.3-325.1-192-5.1-5.1-10.2-12.8-12.8-20.5V368.6c0-17.9 20.5-28.2 20.5-28.2L466 158.6c12.8-5.1 25.6-5.1 38.4 0 0 0 279 161.3 309.8 179.2 17.9 7.7 28.2 25.6 25.6 46.1-.1-5-.1 317.5-.1 350.8zM714.2 371.2c-64-35.8-217.6-125.4-217.6-125.4-7.7-5.1-20.5-5.1-30.7 0L217.6 389.1s-17.9 10.2-17.9 23v297c0 5.1 5.1 12.8 7.7 17.9 7.7 5.1 256 148.5 256 148.5 7.7 5.1 17.9 5.1 25.6 0 15.4-7.7 250.9-145.9 250.9-145.9s12.8-5.1 12.8-30.7v-74.2l-276.5 169v-64c0-17.9 7.7-30.7 20.5-46.1L745 535c5.1-7.7 10.2-20.5 10.2-30.7v-66.6l-279 169v-69.1c0-15.4 5.1-30.7 17.9-38.4l220.1-128zM919 135.7c0-5.1-5.1-7.7-7.7-7.7h-58.9V66.6c0-5.1-5.1-5.1-10.2-5.1l-30.7 5.1c-5.1 0-5.1 2.6-5.1 5.1V128h-56.3c-5.1 0-5.1 5.1-7.7 5.1v38.4h69.1v64c0 5.1 5.1 5.1 10.2 5.1l30.7-5.1c5.1 0 5.1-2.6 5.1-5.1v-56.3h64l-2.5-38.4z\"\r\n\t\tfill=\"currentColor\"></path>\r\n</svg>\r\n";
+
+    var SVG_chromeFilled = "<svg\r\n\txmlns=\"http://www.w3.org/2000/svg\"\r\n\tviewBox=\"0 0 1024 1024\"\r\n\txml:space=\"preserve\">\r\n\t<path\r\n\t\td=\"M938.67 512.01c0-44.59-6.82-87.6-19.54-128H682.67a212.372 212.372 0 0 1 42.67 128c.06 38.71-10.45 76.7-30.42 109.87l-182.91 316.8c235.65-.01 426.66-191.02 426.66-426.67z\"\r\n\t\tfill=\"currentColor\"></path>\r\n\t<path\r\n\t\td=\"M576.79 401.63a127.92 127.92 0 0 0-63.56-17.6c-22.36-.22-44.39 5.43-63.89 16.38s-35.79 26.82-47.25 46.02a128.005 128.005 0 0 0-2.16 127.44l1.24 2.13a127.906 127.906 0 0 0 46.36 46.61 127.907 127.907 0 0 0 63.38 17.44c22.29.2 44.24-5.43 63.68-16.33a127.94 127.94 0 0 0 47.16-45.79v-.01l1.11-1.92a127.984 127.984 0 0 0 .29-127.46 127.957 127.957 0 0 0-46.36-46.91z\"\r\n\t\tfill=\"currentColor\"></path>\r\n\t<path\r\n\t\td=\"M394.45 333.96A213.336 213.336 0 0 1 512 298.67h369.58A426.503 426.503 0 0 0 512 85.34a425.598 425.598 0 0 0-171.74 35.98 425.644 425.644 0 0 0-142.62 102.22l118.14 204.63a213.397 213.397 0 0 1 78.67-94.21zM512.01 938.68H512zM414.76 701.95a213.284 213.284 0 0 1-89.54-86.81L142.48 298.6c-36.35 62.81-57.13 135.68-57.13 213.42 0 203.81 142.93 374.22 333.95 416.55h.04l118.19-204.71a213.315 213.315 0 0 1-122.77-21.91z\"\r\n\t\tfill=\"currentColor\"></path>\r\n</svg>\r\n";
+
+    var SVG_cpu = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M320 256a64 64 0 0 0-64 64v384a64 64 0 0 0 64 64h384a64 64 0 0 0 64-64V320a64 64 0 0 0-64-64H320zm0-64h384a128 128 0 0 1 128 128v384a128 128 0 0 1-128 128H320a128 128 0 0 1-128-128V320a128 128 0 0 1 128-128z\"></path>\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M512 64a32 32 0 0 1 32 32v128h-64V96a32 32 0 0 1 32-32zm160 0a32 32 0 0 1 32 32v128h-64V96a32 32 0 0 1 32-32zm-320 0a32 32 0 0 1 32 32v128h-64V96a32 32 0 0 1 32-32zm160 896a32 32 0 0 1-32-32V800h64v128a32 32 0 0 1-32 32zm160 0a32 32 0 0 1-32-32V800h64v128a32 32 0 0 1-32 32zm-320 0a32 32 0 0 1-32-32V800h64v128a32 32 0 0 1-32 32zM64 512a32 32 0 0 1 32-32h128v64H96a32 32 0 0 1-32-32zm0-160a32 32 0 0 1 32-32h128v64H96a32 32 0 0 1-32-32zm0 320a32 32 0 0 1 32-32h128v64H96a32 32 0 0 1-32-32zm896-160a32 32 0 0 1-32 32H800v-64h128a32 32 0 0 1 32 32zm0-160a32 32 0 0 1-32 32H800v-64h128a32 32 0 0 1 32 32zm0 320a32 32 0 0 1-32 32H800v-64h128a32 32 0 0 1 32 32z\"></path>\r\n</svg>\r\n";
+
+    var SVG_videoPlay = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 832a384 384 0 0 0 0-768 384 384 0 0 0 0 768zm-48-247.616L668.608 512 464 375.616v272.768zm10.624-342.656 249.472 166.336a48 48 0 0 1 0 79.872L474.624 718.272A48 48 0 0 1 400 678.336V345.6a48 48 0 0 1 74.624-39.936z\"></path>\r\n</svg>\r\n";
+
+    var SVG_videoPause = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 832a384 384 0 0 0 0-768 384 384 0 0 0 0 768zm-96-544q32 0 32 32v256q0 32-32 32t-32-32V384q0-32 32-32zm192 0q32 0 32 32v256q0 32-32 32t-32-32V384q0-32 32-32z\"></path>\r\n</svg>\r\n";
+
+    var SVG_headset = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M896 529.152V512a384 384 0 1 0-768 0v17.152A128 128 0 0 1 320 640v128a128 128 0 1 1-256 0V512a448 448 0 1 1 896 0v256a128 128 0 1 1-256 0V640a128 128 0 0 1 192-110.848zM896 640a64 64 0 0 0-128 0v128a64 64 0 0 0 128 0V640zm-768 0v128a64 64 0 0 0 128 0V640a64 64 0 1 0-128 0z\"></path>\r\n</svg>\r\n";
+
+    var SVG_monitor = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M544 768v128h192a32 32 0 1 1 0 64H288a32 32 0 1 1 0-64h192V768H192A128 128 0 0 1 64 640V256a128 128 0 0 1 128-128h640a128 128 0 0 1 128 128v384a128 128 0 0 1-128 128H544zM192 192a64 64 0 0 0-64 64v384a64 64 0 0 0 64 64h640a64 64 0 0 0 64-64V256a64 64 0 0 0-64-64H192z\"></path>\r\n</svg>\r\n";
+
+    var SVG_documentCopy = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M128 320v576h576V320H128zm-32-64h640a32 32 0 0 1 32 32v640a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V288a32 32 0 0 1 32-32zM960 96v704a32 32 0 0 1-32 32h-96v-64h64V128H384v64h-64V96a32 32 0 0 1 32-32h576a32 32 0 0 1 32 32zM256 672h320v64H256v-64zm0-192h320v64H256v-64z\"></path>\r\n</svg>\r\n";
+
+    var SVG_picture = "<svg viewBox=\"0 0 1024 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M160 160v704h704V160H160zm-32-64h768a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H128a32 32 0 0 1-32-32V128a32 32 0 0 1 32-32z\"></path>\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M384 288q64 0 64 64t-64 64q-64 0-64-64t64-64zM185.408 876.992l-50.816-38.912L350.72 556.032a96 96 0 0 1 134.592-17.856l1.856 1.472 122.88 99.136a32 32 0 0 0 44.992-4.864l216-269.888 49.92 39.936-215.808 269.824-.256.32a96 96 0 0 1-135.04 14.464l-122.88-99.072-.64-.512a32 32 0 0 0-44.8 5.952L185.408 876.992z\"></path>\r\n</svg>\r\n";
+
+    var SVG_circleClose = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 1024 1024\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z\"></path>\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896\"></path>\r\n</svg>\r\n";
+
+    var SVG_view = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 1024 1024\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M512 160c320 0 512 352 512 352S832 864 512 864 0 512 0 512s192-352 512-352m0 64c-225.28 0-384.128 208.064-436.8 288 52.608 79.872 211.456 288 436.8 288 225.28 0 384.128-208.064 436.8-288-52.608-79.872-211.456-288-436.8-288zm0 64a224 224 0 1 1 0 448 224 224 0 0 1 0-448m0 64a160.192 160.192 0 0 0-160 160c0 88.192 71.744 160 160 160s160-71.808 160-160-71.744-160-160-160\"></path>\r\n</svg>\r\n";
+
+    var SVG_hide = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 1024 1024\">\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M876.8 156.8c0-9.6-3.2-16-9.6-22.4-6.4-6.4-12.8-9.6-22.4-9.6-9.6 0-16 3.2-22.4 9.6L736 220.8c-64-32-137.6-51.2-224-60.8-160 16-288 73.6-377.6 176C44.8 438.4 0 496 0 512s48 73.6 134.4 176c22.4 25.6 44.8 48 73.6 67.2l-86.4 89.6c-6.4 6.4-9.6 12.8-9.6 22.4 0 9.6 3.2 16 9.6 22.4 6.4 6.4 12.8 9.6 22.4 9.6 9.6 0 16-3.2 22.4-9.6l704-710.4c3.2-6.4 6.4-12.8 6.4-22.4Zm-646.4 528c-76.8-70.4-128-128-153.6-172.8 28.8-48 80-105.6 153.6-172.8C304 272 400 230.4 512 224c64 3.2 124.8 19.2 176 44.8l-54.4 54.4C598.4 300.8 560 288 512 288c-64 0-115.2 22.4-160 64s-64 96-64 160c0 48 12.8 89.6 35.2 124.8L256 707.2c-9.6-6.4-19.2-16-25.6-22.4Zm140.8-96c-12.8-22.4-19.2-48-19.2-76.8 0-44.8 16-83.2 48-112 32-28.8 67.2-48 112-48 28.8 0 54.4 6.4 73.6 19.2zM889.599 336c-12.8-16-28.8-28.8-41.6-41.6l-48 48c73.6 67.2 124.8 124.8 150.4 169.6-28.8 48-80 105.6-153.6 172.8-73.6 67.2-172.8 108.8-284.8 115.2-51.2-3.2-99.2-12.8-140.8-28.8l-48 48c57.6 22.4 118.4 38.4 188.8 44.8 160-16 288-73.6 377.6-176C979.199 585.6 1024 528 1024 512s-48.001-73.6-134.401-176Z\"></path>\r\n\t<path\r\n\t\tfill=\"currentColor\"\r\n\t\td=\"M511.998 672c-12.8 0-25.6-3.2-38.4-6.4l-51.2 51.2c28.8 12.8 57.6 19.2 89.6 19.2 64 0 115.2-22.4 160-64 41.6-41.6 64-96 64-160 0-32-6.4-64-19.2-89.6l-51.2 51.2c3.2 12.8 6.4 25.6 6.4 38.4 0 44.8-16 83.2-48 112-32 28.8-67.2 48-112 48Z\"></path>\r\n</svg>\r\n";
+
+    var SVG_keyboard = "<svg viewBox=\"0 0 1123 1024\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t<path\r\n\t\td=\"M1014.122186 1024H109.753483A109.753483 109.753483 0 0 1 0 914.246517V392.917471a109.753483 109.753483 0 0 1 109.753483-109.753484h904.368703a109.753483 109.753483 0 0 1 109.753484 109.753484v521.329046a109.753483 109.753483 0 0 1-109.753484 109.753483zM109.753483 370.966774a21.950697 21.950697 0 0 0-21.950696 21.950697v521.329046a21.950697 21.950697 0 0 0 21.950696 21.950696h904.368703a21.950697 21.950697 0 0 0 21.950697-21.950696V392.917471a21.950697 21.950697 0 0 0-21.950697-21.950697z\"></path>\r\n\t<path\r\n\t\td=\"M687.056806 891.198285H307.309753a43.901393 43.901393 0 0 1 0-87.802787h379.747053a43.901393 43.901393 0 0 1 0 87.802787zM175.605573 803.395498a43.901393 43.901393 0 1 0 43.901394 43.901394 43.901393 43.901393 0 0 0-43.901394-43.901394zM432.428725 414.868167a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM561.937835 414.868167a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM690.349411 414.868167a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM818.760986 414.868167a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM947.172562 414.868167a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM175.605573 546.572347a43.901393 43.901393 0 1 0 43.901394 43.901394 43.901393 43.901393 0 0 0-43.901394-43.901394zM304.017149 546.572347a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM432.428725 546.572347a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM561.937835 546.572347a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM690.349411 546.572347a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM818.760986 546.572347a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM818.760986 803.395498a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM175.605573 678.276527a43.901393 43.901393 0 1 0 43.901394 43.901394 43.901393 43.901393 0 0 0-43.901394-43.901394zM304.017149 678.276527a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM432.428725 678.276527a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM561.937835 678.276527a43.901393 43.901393 0 1 0 43.901393 43.901394 43.901393 43.901393 0 0 0-43.901393-43.901394zM948.270096 803.395498a43.901393 43.901393 0 1 0 43.901394 43.901394 43.901393 43.901393 0 0 0-43.901394-43.901394z\"></path>\r\n\t<path\r\n\t\td=\"M881.320472 766.079314H689.251876a43.901393 43.901393 0 0 1 0-87.802787h192.068596a21.950697 21.950697 0 0 0 21.950696-21.950696v-65.85209a43.901393 43.901393 0 0 1 87.802787 0v65.85209a109.753483 109.753483 0 0 1-109.753483 109.753483zM305.114684 502.670954H175.605573a43.901393 43.901393 0 0 1 0-87.802787h129.509111a43.901393 43.901393 0 0 1 0 87.802787zM563.03537 365.4791a43.901393 43.901393 0 0 1-43.901394-43.901394v-105.363344A109.753483 109.753483 0 0 1 628.88746 106.460879h61.461951a21.950697 21.950697 0 0 0 21.950696-21.950697V43.901393a43.901393 43.901393 0 0 1 87.802787 0v40.608789a109.753483 109.753483 0 0 1-109.753483 109.753484h-61.461951a21.950697 21.950697 0 0 0-21.950697 21.950696v105.363344a43.901393 43.901393 0 0 1-43.901393 43.901394z\"></path>\r\n</svg>\r\n";
+
+    var SVG_arrowRight = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 1024 1024\">\r\n\t<path\r\n\t\td=\"M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z\"></path>\r\n</svg>\r\n";
+
+    var SVG_arrowLeft = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 1024 1024\">\r\n\t<path\r\n\t\td=\"M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z\"></path>\r\n</svg>\r\n";
+
+    const PopsElementHandler = {
+        /**
+         * 获取遮罩层HTML
+         * @param guid
+         * @param zIndex z-index
+         * @param style
+         */
+        getMaskHTML(guid, zIndex = 101, style = "") {
+            zIndex = zIndex - 100;
+            return `<div class="pops-mask" data-guid="${guid}" style="z-index:${zIndex};${style}"></div>`;
+        },
+        /**
+         * 获取动画层HTML
+         * @param guid
+         * @param type
+         * @param config
+         * @param html
+         * @param bottomBtnHTML
+         */
+        getAnimHTML(guid, type, config, html = "", bottomBtnHTML = "") {
+            let __config = config;
+            let popsAnimStyle = "";
+            let popsStyle = "";
+            let popsPosition = __config.position || "";
+            if (config.zIndex != null) {
+                popsAnimStyle += `z-index: ${config.zIndex};`;
+                popsStyle += `z-index: ${config.zIndex};`;
+            }
+            if (__config.width != null) {
+                popsStyle += `width: ${__config.width};`;
+            }
+            if (__config.height != null) {
+                popsStyle += `height: ${__config.height};`;
+            }
+            let hasBottomBtn = bottomBtnHTML.trim() === "" ? false : true;
+            return `<div 
+                    class="pops-anim"
+                    anim="${__config.animation || ""}"
+                    style="${popsAnimStyle};"
+                    data-guid="${guid}">
+            ${config.style != null
+            ? `<style tyle="text/css">${config.style}</style>`
+            : ""}
+                    <div
+                        class="pops ${config.class || ""}"
+                        data-bottom-btn="${hasBottomBtn}"
+                        type-value="${type}"
+                        style="${popsStyle}"
+                        position="${popsPosition}"
+                        data-guid="${guid}">
+                        ${html}
+                    </div>
+                </div>`;
+        },
+        /**
+         * 获取顶部按钮层HTML
+         * @param type
+         * @param config
+         */
+        getHeaderBtnHTML(type, config) {
+            if (!config.btn) {
+                return "";
+            }
+            if (type !== "iframe" && !config.btn?.close?.enable) {
+                return "";
+            }
+            let resultHTML = "";
+            // let btnStyle = "";
+            let closeHTML = "";
+            let __config_iframe = config;
+            if (type === "iframe" && __config_iframe.topRightButton?.trim() !== "") {
+                /* iframe的 */
+                let topRightButtonHTML = "";
+                __config_iframe.topRightButton.split("|").forEach((item) => {
+                    item = item.toLowerCase();
+                    topRightButtonHTML += `
+                <button class="pops-header-control" type="${item}">
+                    <i class="pops-icon">${pops.config.iconSVG[item]}</i>
+                </button>`;
+                });
+                resultHTML = `
+            <div class="pops-header-controls" data-margin>
+                ${topRightButtonHTML}
+            </div>`;
+            }
+            else {
+                if (config.btn?.close?.enable) {
+                    closeHTML = `
+                <div class="pops-header-controls">
+                    <button class="pops-header-control" type="close" data-header>
+                    <i class="pops-icon">${pops.config.iconSVG["close"]}</i>
+                    </button>
+                </div>`;
+                }
+                resultHTML = closeHTML;
+            }
+            return resultHTML;
+        },
+        /**
+         * 获取底部按钮层HTML
+         * @param type
+         * @param config
+         */
+        getBottomBtnHTML(type, config) {
+            if (!config.btn) {
+                // 未设置btn参数
+                return "";
+            }
+            let __config_confirm = config;
+            if (!(config.btn?.ok?.enable ||
+                __config_confirm.btn?.cancel?.enable ||
+                __config_confirm.btn?.other?.enable)) {
+                // 确定、取消、其它按钮都未启用直接返回
+                return "";
+            }
+            let btnStyle = "";
+            let resultHTML = "";
+            let okHTML = "";
+            let cancelHTML = "";
+            let ohterHTML = "";
+            if (config.btn.position) {
+                btnStyle += `justify-content: ${config.btn.position};`;
+            }
+            if (__config_confirm.btn.reverse) {
+                btnStyle += "flex-direction: row-reverse;";
+            }
+            if (config.btn?.ok?.enable) {
+                /* 处理确定按钮的尺寸问题 */
+                let okButtonSizeClassName = "";
+                if (config.btn.ok.size === "large") {
+                    okButtonSizeClassName = "pops-button-" + config.btn.ok.size;
+                }
+                else if (config.btn.ok.size === "small") {
+                    okButtonSizeClassName = "pops-button-" + config.btn.ok.size;
+                }
+                let okIconHTML = "";
+                let okIcon = __config_confirm.btn.ok.icon;
+                if (okIcon !== "") {
+                    // 判断图标是否是svg库内的
+                    let iconHTML = "";
+                    if (okIcon in pops.config.iconSVG) {
+                        iconHTML = pops.config.iconSVG[okIcon];
+                    }
+                    else {
+                        iconHTML = okIcon;
+                    }
+                    iconHTML = iconHTML || "";
+                    okIconHTML = `
+                <i class="pops-bottom-icon" is-loading="${config.btn.ok.iconIsLoading}">
+                    ${iconHTML}
+                </i>`;
+                }
+                okHTML = `
+            <button 
+                    class="pops-${type}-btn-ok ${okButtonSizeClassName}"
+                    type="${__config_confirm.btn.ok?.type}"
+					data-has-icon="${(__config_confirm.btn.ok.icon || "") !== ""}"
+                    data-rightIcon="${__config_confirm.btn.ok?.rightIcon}"
+            >
+            ${okIconHTML}
+                <span>${config.btn.ok.text}</span>
+            </button>`;
+            }
+            if (__config_confirm.btn?.cancel?.enable) {
+                /* 处理取消按钮的尺寸问题 */
+                let cancelButtonSizeClassName = "";
+                if (__config_confirm.btn.cancel.size === "large") {
+                    cancelButtonSizeClassName =
+                        "pops-button-" + __config_confirm.btn.cancel.size;
+                }
+                else if (__config_confirm.btn.cancel.size === "small") {
+                    cancelButtonSizeClassName =
+                        "pops-button-" + __config_confirm.btn.cancel.size;
+                }
+                let cancelIconHTML = "";
+                let cancelIcon = __config_confirm.btn.cancel.icon;
+                if (cancelIcon !== "") {
+                    let iconHTML = "";
+                    // 判断图标是否是svg库内的
+                    if (cancelIcon in pops.config.iconSVG) {
+                        iconHTML = pops.config.iconSVG[cancelIcon];
+                    }
+                    else {
+                        iconHTML = cancelIcon;
+                    }
+                    iconHTML = iconHTML || "";
+                    cancelIconHTML = `
+                <i class="pops-bottom-icon" is-loading="${__config_confirm.btn.cancel.iconIsLoading}">
+                    ${iconHTML}
+                </i>`;
+                }
+                cancelHTML = `
+            <button
+                    class="pops-${type}-btn-cancel ${cancelButtonSizeClassName}"
+                    type="${__config_confirm.btn.cancel.type}"
+					data-has-icon="${(__config_confirm.btn.cancel.icon || "") !== ""}"
+                    data-rightIcon="${__config_confirm.btn.cancel.rightIcon}"
+            >
+            ${cancelIconHTML}
+                <span>${__config_confirm.btn.cancel.text}</span>
+            </button>`;
+            }
+            if (__config_confirm.btn?.other?.enable) {
+                /* 处理其它按钮的尺寸问题 */
+                let otherButtonSizeClassName = "";
+                if (__config_confirm.btn.other.size === "large") {
+                    otherButtonSizeClassName =
+                        "pops-button-" + __config_confirm.btn.other.size;
+                }
+                else if (__config_confirm.btn.other.size === "small") {
+                    otherButtonSizeClassName =
+                        "pops-button-" + __config_confirm.btn.other.size;
+                }
+                let otherIconHTML = "";
+                let otherIcon = __config_confirm.btn.other.icon;
+                if (otherIcon !== "") {
+                    let iconHTML = "";
+                    // 判断图标是否是svg库内的
+                    if (otherIcon in pops.config.iconSVG) {
+                        iconHTML = pops.config.iconSVG[otherIcon];
+                    }
+                    iconHTML = iconHTML || "";
+                    otherIconHTML = `
+                <i class="pops-bottom-icon" is-loading="${__config_confirm.btn.other.iconIsLoading}">
+                    ${iconHTML}
+                </i>`;
+                }
+                ohterHTML = `
+            <button
+                    class="pops-${type}-btn-other ${otherButtonSizeClassName}"
+                    type="${__config_confirm.btn.other.type}"
+					data-has-icon="${(__config_confirm.btn.other.icon || "") !== ""}"
+                    data-rightIcon="${__config_confirm.btn.other.rightIcon}"
+            >
+            ${otherIconHTML}
+                <span>${__config_confirm.btn.other.text}</span>
+            </button>`;
+            }
+            if (__config_confirm.btn.merge) {
+                let flexStyle = "display: flex;";
+                if (__config_confirm.btn.mergeReverse) {
+                    flexStyle += "flex-direction: row-reverse;";
+                }
+                else {
+                    flexStyle += "flex-direction: row;";
+                }
+                resultHTML = `
+            <div class="pops-${type}-btn" style="${btnStyle}">
+                ${ohterHTML}
+                <div 
+                    class="pops-${type}-btn-merge"
+                    style="${flexStyle}">
+                    ${okHTML}
+                    ${cancelHTML}
+                </div>
+            </div>
+            `;
+            }
+            else {
+                resultHTML = `
+            <div class="pops-${type}-btn" style="${btnStyle}">
+                ${okHTML}
+                ${cancelHTML}
+                ${ohterHTML}
+            </div>
+            `;
+            }
+            return resultHTML;
+        },
+        /**
+         * 获取标题style
+         * @param type
+         * @param config
+         */
+        getHeaderStyle(type, config) {
+            return {
+                headerStyle: config?.title?.html ? config?.title?.style || "" : "",
+                headerPStyle: config?.title?.html ? "" : config?.title?.style || "",
+            };
+        },
+        /**
+         * 获取内容style
+         * @param type
+         * @param config
+         */
+        getContentStyle(type, config) {
+            return {
+                contentStyle: config?.content?.html
+                    ? config?.content?.style || ""
+                    : "",
+                contentPStyle: config?.content?.html
+                    ? ""
+                    : config?.content?.style || "",
+            };
+        },
+        /**
+         * 将html转换成元素
+         * @param html
+         */
+        parseElement(html) {
+            return popsUtils.parseTextToDOM(html);
+        },
+    };
+
+    const PopsHandler = {
+        /**
+         * 创建shadow
+         */
+        handlerShadow() {
+            let $shadowContainer = document.createElement("div");
+            $shadowContainer.className = "pops-shadow-container";
+            let $shadowRoot = $shadowContainer.attachShadow({ mode: "open" });
+            return {
+                $shadowContainer,
+                $shadowRoot,
+            };
+        },
+        /**
+         * 处理初始化
+         * @param $shadowRoot 所在的shadowRoot
+         * @param cssText 添加进ShadowRoot的CSS
+         */
+        handleInit($shadowRoot, cssText) {
+            pops.init();
+            if (!arguments.length) {
+                return;
+            }
+            if (Array.isArray(cssText)) {
+                for (let index = 0; index < cssText.length; index++) {
+                    this.handleInit($shadowRoot, cssText[index]);
+                }
+            }
+            else {
+                let $css = popsDOMUtils.createElement("style", {
+                    innerHTML: cssText,
+                }, {
+                    "data-type": "PopsHandler.handleInit",
+                });
+                $shadowRoot.appendChild($css);
+            }
+        },
+        /**
+         * 处理遮罩层
+         * @param details 传递的配置
+         */
+        handleMask(details = {}) {
+            let result = {
+                maskElement: popsUtils.parseTextToDOM(details.maskHTML),
+            };
+            let isMaskClick = false;
+            /**
+             * 点击其它区域的事件
+             * @param event
+             */
+            function clickEvent(event) {
+                popsDOMUtils.preventEvent(event);
+                // 获取该类型实例存储列表
+                let targetLayer = pops.config.layer[details.type];
+                function originalRun() {
+                    if (details.config.mask.clickEvent.toClose) {
+                        /* 关闭 */
+                        PopsUIUtils.close(details.type, targetLayer, details.guid, details.config, details.animElement);
+                    }
+                    else if (details.config.mask.clickEvent.toHide) {
+                        /* 隐藏 */
+                        PopsUIUtils.hide(details.type, targetLayer, details.guid, details.config, details.animElement, result.maskElement);
+                    }
+                }
+                if (typeof details.config.mask.clickCallBack === "function") {
+                    details.config.mask.clickCallBack(originalRun, details.config);
+                }
+                else {
+                    originalRun();
+                }
+                return false;
+            }
+            function isAnimElement(element) {
+                return Boolean(element?.localName?.toLowerCase() === "div" &&
+                    element.className &&
+                    element.className === "pops-anim" &&
+                    element.hasAttribute("anim"));
+            }
+            if (details.config.mask.clickEvent.toClose ||
+                details.config.mask.clickEvent.toHide) {
+                /* 判断按下的元素是否是pops-anim */
+                popsDOMUtils.on(details.animElement, ["touchstart", "mousedown"], void 0, (event) => {
+                    isMaskClick = isAnimElement(event.composedPath()[0]);
+                });
+                /* 如果有动画层，在动画层上监听点击事件 */
+                popsDOMUtils.on(details.animElement, "click", void 0, (event) => {
+                    if (isAnimElement(event.composedPath()[0]) &&
+                        isMaskClick) {
+                        return clickEvent(event);
+                    }
+                });
+                /* 在遮罩层监听点击事件 */
+                /* 如果有动画层，那么该点击事件触发不了 */
+                popsDOMUtils.on(result.maskElement, "click", void 0, (event) => {
+                    isMaskClick = true;
+                    clickEvent(event);
+                });
+            }
+            return result;
+        },
+        /**
+         * 处理获取元素
+         * @param {HTMLDivElement} animElement
+         * @param type
+         */
+        handleQueryElement(animElement, type) {
+            return {
+                /**
+                 * 主元素
+                 */
+                popsElement: animElement.querySelector(".pops[type-value"),
+                /**
+                 * 确认按钮
+                 */
+                btnOkElement: animElement.querySelector(`.pops-${type}-btn-ok`),
+                /**
+                 * 取消按钮
+                 */
+                btnCancelElement: animElement.querySelector(`.pops-${type}-btn-cancel`),
+                /**
+                 * 其它按钮
+                 */
+                btnOtherElement: animElement.querySelector(`.pops-${type}-btn-other`),
+                /**
+                 * 标题元素
+                 */
+                titleElement: animElement.querySelector(`.pops-${type}-title`),
+                /**
+                 * 输入框元素
+                 */
+                inputElement: animElement.querySelector(`.pops-${type}-content textarea[pops]`)
+                    ? animElement.querySelector(`.pops-${type}-content textarea[pops]`)
+                    : animElement.querySelector(`.pops-${type}-content input[pops]`),
+                /**
+                 * 顶部按钮控制层元素
+                 */
+                headerControlsElement: animElement.querySelector(".pops-header-controls"),
+                /**
+                 * iframe元素
+                 */
+                iframeElement: animElement.querySelector("iframe[pops]"),
+                /**
+                 * 加载中元素
+                 */
+                loadingElement: animElement.querySelector(".pops-loading"),
+                /**
+                 * 内容元素
+                 */
+                contentElement: animElement.querySelector(`.pops-${type}-content`),
+                /**
+                 * 内容侧边栏容器元素
+                 */
+                contentAsideElement: animElement.querySelector(`.pops-${type}-content aside.pops-${type}-aside`),
+                /**
+                 * 内容主要区域容器元素
+                 */
+                contentSectionContainerElement: animElement.querySelector(`.pops-${type}-content section.pops-${type}-container`),
+                /**
+                 * 内容加载中元素
+                 */
+                contentLoadingElement: animElement.querySelector(`.pops-${type}-content-global-loading`),
+                /**
+                 * 顶部缩小按钮
+                 */
+                headerMinBtnElement: animElement.querySelector(".pops-header-control[type='min']"),
+                /**
+                 * 顶部放大按钮
+                 */
+                headerMaxBtnElement: animElement.querySelector(".pops-header-control[type='max']"),
+                /**
+                 * 顶部恢复原样按钮
+                 */
+                headerMiseBtnElement: animElement.querySelector(".pops-header-control[type='mise']"),
+                /**
+                 * 顶部关闭按钮
+                 */
+                headerCloseBtnElement: animElement.querySelector(".pops-header-control[type='close']"),
+                /**
+                 * 文件夹列表元素
+                 */
+                folderListElement: animElement.querySelector(".pops-folder-list"),
+                /**
+                 * 文件夹列表顶部元素
+                 */
+                folderListHeaderElement: animElement.querySelector(".pops-folder-list .pops-folder-list-table__header-div"),
+                /**
+                 * 文件夹列表行元素
+                 */
+                folderListHeaderRowElement: animElement.querySelector(".pops-folder-list .pops-folder-list-table__header-div .pops-folder-list-table__header-row"),
+                /**
+                 * 文件夹列表tbody元素
+                 */
+                folderListBodyElement: animElement.querySelector(".pops-folder-list .pops-folder-list-table__body-div tbody"),
+                /**
+                 * 文件夹列表primary元素
+                 */
+                folderFileListBreadcrumbPrimaryElement: animElement.querySelector(".pops-folder-list .pops-folder-file-list-breadcrumb-primary"),
+                /**
+                 * 文件夹排序按钮-文件名
+                 */
+                folderListSortFileNameElement: animElement.querySelector('.pops-folder-list-table__sort[data-sort="fileName"]'),
+                /**
+                 * 文件夹排序按钮-修改时间
+                 */
+                folderListSortLatestTimeElement: animElement.querySelector('.pops-folder-list-table__sort[data-sort="latestTime"]'),
+                /**
+                 * 文件夹排序按钮-文件大小
+                 */
+                folderListSortFileSizeElement: animElement.querySelector('.pops-folder-list-table__sort[data-sort="fileSize"]'),
+            };
+        },
+        /**
+         * 获取事件配置
+         * @param guid
+         * @param $shadowContainer
+         * @param $shadowRoot
+         * @param mode 当前弹窗类型
+         * @param animElement 动画层
+         * @param popsElement 主元素
+         * @param maskElement 遮罩层
+         * @param config 当前配置
+         */
+        handleEventDetails(guid, $shadowContainer, $shadowRoot, mode, animElement, popsElement, maskElement, config) {
+            return {
+                $shadowContainer: $shadowContainer,
+                $shadowRoot: $shadowRoot,
+                element: animElement,
+                animElement: animElement,
+                popsElement: popsElement,
+                maskElement: maskElement,
+                mode: mode,
+                guid: guid,
+                close() {
+                    PopsUIUtils.close(mode, pops.config.layer[mode], guid, config, animElement);
+                },
+                hide() {
+                    PopsUIUtils.hide(mode, pops.config.layer[mode], guid, config, animElement, maskElement);
+                },
+                show() {
+                    PopsUIUtils.show(mode, pops.config.layer[mode], guid, config, animElement, maskElement);
+                },
+            };
+        },
+        /**
+         * 处理返回的配置，针对popsHandler.handleEventDetails
+         */
+        handleResultDetails(details) {
+            let resultDetails = Object.assign({}, details);
+            popsUtils.delete(resultDetails, "type");
+            popsUtils.delete(resultDetails, "function");
+            return resultDetails;
+        },
+        /**
+         * 处理点击事件
+         * @param type 当前按钮类型
+         * @param $btn 按钮元素
+         * @param eventDetails 事件配置，由popsHandler.handleEventDetails创建的
+         * @param callback 点击回调
+         */
+        handleClickEvent(type, $btn, eventDetails, callback) {
+            popsDOMUtils.on($btn, "click", (event) => {
+                let extraParam = {
+                    type: type,
+                };
+                callback(Object.assign(eventDetails, extraParam), event);
+            }, {
+                capture: true,
+            });
+        },
+        /**
+         * 全局监听键盘事件
+         * @param keyName 键名|键值
+         * @param otherKeyList 组合按键，数组类型，包含ctrl、shift、alt和meta（win键或mac的cmd键）
+         * @param callback 回调函数
+         */
+        handleKeyboardEvent(keyName, otherKeyList = [], callback) {
+            let keyboardEvent = function (event) {
+                let _keyName = event.code || event.key;
+                let _keyValue = event.charCode || event.keyCode || event.which;
+                if (otherKeyList.includes("ctrl") && !event.ctrlKey) {
+                    return;
+                }
+                if (otherKeyList.includes("alt") && !event.altKey) {
+                    return;
+                }
+                if (otherKeyList.includes("meta") && !event.metaKey) {
+                    return;
+                }
+                if (otherKeyList.includes("shift") && !event.shiftKey) {
+                    return;
+                }
+                if (typeof keyName === "string" && keyName === _keyName) {
+                    callback && callback(event);
+                }
+                else if (typeof keyName === "number" && keyName === _keyValue) {
+                    callback && callback(event);
+                }
+            };
+            popsDOMUtils.on(PopsCore.globalThis, "keydown", keyboardEvent, {
+                capture: true,
+            });
+            return {
+                removeKeyboardEvent() {
+                    popsDOMUtils.off(globalThis, "keydown", keyboardEvent, {
+                        capture: true,
+                    });
+                },
+            };
+        },
+        /**
+         * 处理prompt的点击事件
+         * @param inputElement 输入框
+         * @param  $btn 按钮元素
+         * @param type 触发事件类型
+         * @param event 事件配置，由popsHandler.handleEventDetails创建的
+         * @param callback 点击回调
+         */
+        handlePromptClickEvent(inputElement, $btn, type, event, callback) {
+            popsDOMUtils.on($btn, "click", () => {
+                // 额外参数
+                let extraParam = {
+                    type: type,
+                    text: inputElement.value,
+                };
+                callback(Object.assign(event, extraParam));
+            }, {
+                capture: true,
+            });
+        },
+        /**
+         * 处理config.only
+         * @param type 当前弹窗类型
+         * @param config 配置
+         */
+        handleOnly(type, config) {
+            if (config.only) {
+                if (type === "loading" ||
+                    type === "tooltip" ||
+                    type === "rightClickMenu") {
+                    PopsUIUtils.configRemove([pops.config.layer[type]], "", true);
+                }
+                else {
+                    PopsUIUtils.configRemove([
+                        pops.config.layer.alert,
+                        pops.config.layer.confirm,
+                        pops.config.layer.prompt,
+                        pops.config.layer.iframe,
+                        pops.config.layer.drawer,
+                        pops.config.layer.folder,
+                        pops.config.layer.panel,
+                    ], "", true);
+                }
+            }
+            else {
+                config.zIndex =
+                    PopsUIUtils.getPopsMaxZIndex(config.zIndex)["zIndex"] * 2;
+            }
+            return config;
+        },
+        /**
+         * 处理把已创建的元素保存到内部环境中
+         * @param type 当前弹窗类型
+         * @param value
+         */
+        handlePush(type, value) {
+            pops.config.layer[type].push(value);
+        },
+    };
+
+    class PopsAlert {
+        constructor(details) {
+            const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow();
+            PopsHandler.handleInit($shadowRoot, [
+                pops.config.cssText.index,
+                pops.config.cssText.ninePalaceGridPosition,
+                pops.config.cssText.scrollbar,
+                pops.config.cssText.button,
+                pops.config.cssText.anim,
+                pops.config.cssText.common,
+                pops.config.cssText.alertCSS,
+            ]);
+            let config = {
+                title: {
+                    text: "默认标题",
+                    position: "left",
+                    html: false,
+                    style: "",
+                },
+                content: {
+                    text: "默认内容",
+                    html: false,
+                    style: "",
+                },
+                btn: {
+                    position: "flex-end",
+                    ok: {
+                        size: void 0,
+                        enable: true,
+                        icon: void 0,
+                        rightIcon: false,
+                        iconIsLoading: false,
+                        text: "确定",
+                        type: "primary",
+                        callback: function (event) {
+                            event.close();
+                        },
+                    },
+                    close: {
+                        enable: true,
+                        callback: function (event) {
+                            event.close();
+                        },
+                    },
+                },
+                class: "",
+                only: false,
+                width: "350px",
+                height: "200px",
+                position: "center",
+                animation: "pops-anim-fadein-zoom",
+                zIndex: 10000,
+                mask: {
+                    enable: false,
+                    clickEvent: {
+                        toClose: false,
+                        toHide: false,
+                    },
+                    clickCallBack: void 0,
+                },
+                drag: false,
+                dragLimit: true,
+                dragExtraDistance: 3,
+                dragMoveCallBack() { },
+                dragEndCallBack() { },
+                forbiddenScroll: false,
+                style: null,
+                beforeAppendToPageCallBack() { },
+            };
+            config = popsUtils.assign(config, details);
+            let guid = popsUtils.getRandomGUID();
+            // 设置当前类型
+            const PopsType = "alert";
+            config = PopsHandler.handleOnly(PopsType, config);
+            let maskHTML = PopsElementHandler.getMaskHTML(guid, config.zIndex);
+            let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(PopsType, config);
+            let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(PopsType, config);
+            let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
+            let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(PopsType, config);
+            let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config, `
+			<div 
+				class="pops-alert-title"
+				style="text-align: ${config.title.position};
+				${headerStyle}">
+				${config.title.html
+            ? config.title.text
+            : `<p pops style="${headerPStyle}">${config.title.text}</p>`}
+				${headerBtnHTML}
+			</div>
+			<div class="pops-alert-content" style="${contentStyle}">
+				${config.content.html
+            ? config.content.text
+            : `<p pops style="${contentPStyle}">${config.content.text}</p>`}
+			</div>
+			${bottomBtnHTML}`, bottomBtnHTML);
+            /**
+             * 弹窗的主元素，包括动画层
+             */
+            let $anim = PopsElementHandler.parseElement(animHTML);
+            let { popsElement: $pops, headerCloseBtnElement: $headerCloseBtn, btnOkElement, titleElement: $title, } = PopsHandler.handleQueryElement($anim, PopsType);
+            /** 遮罩层元素 */
+            let $mask = null;
+            /** 已创建的元素列表 */
+            let elementList = [$anim];
+            /* 遮罩层元素 */
+            if (config.mask.enable) {
+                let _handleMask_ = PopsHandler.handleMask({
+                    type: PopsType,
+                    guid: guid,
+                    config: config,
+                    animElement: $anim,
+                    maskHTML: maskHTML,
+                });
+                $mask = _handleMask_.maskElement;
+                elementList.push($mask);
+            }
+            /* 处理返回的配置 */
+            let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, PopsType, $anim, $pops, $mask, config);
+            /* 为顶部右边的关闭按钮添加点击事件 */
+            PopsHandler.handleClickEvent("close", $headerCloseBtn, eventDetails, config.btn.close.callback);
+            /* 为底部ok按钮添加点击事件 */
+            PopsHandler.handleClickEvent("ok", btnOkElement, eventDetails, config.btn.ok.callback);
+            /* 创建到页面中 */
+            popsDOMUtils.append($shadowRoot, elementList);
+            if (typeof config.beforeAppendToPageCallBack === "function") {
+                config.beforeAppendToPageCallBack($shadowRoot, $shadowContainer);
+            }
+            popsDOMUtils.appendBody($shadowContainer);
+            if ($mask != null) {
+                // 添加遮罩层
+                $anim.after($mask);
+            }
+            /* 保存 */
+            PopsHandler.handlePush(PopsType, {
+                guid: guid,
+                animElement: $anim,
+                popsElement: $pops,
+                maskElement: $mask,
+                $shadowContainer: $shadowContainer,
+                $shadowRoot: $shadowRoot,
+            });
+            /* 拖拽 */
+            if (config.drag) {
+                PopsUIUtils.drag($pops, {
+                    dragElement: $title,
+                    limit: config.dragLimit,
+                    extraDistance: config.dragExtraDistance,
+                    moveCallBack: config.dragMoveCallBack,
+                    endCallBack: config.dragEndCallBack,
+                });
+            }
+            return PopsHandler.handleResultDetails(eventDetails);
+        }
+    }
+
+    class PopsConfirm {
+        constructor(details) {
+            const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow();
+            PopsHandler.handleInit($shadowRoot, [
+                pops.config.cssText.index,
+                pops.config.cssText.ninePalaceGridPosition,
+                pops.config.cssText.scrollbar,
+                pops.config.cssText.button,
+                pops.config.cssText.anim,
+                pops.config.cssText.common,
+                pops.config.cssText.confirmCSS,
+            ]);
+            let config = {
+                title: {
+                    text: "默认标题",
+                    position: "left",
+                    html: false,
+                    style: "",
+                },
+                content: {
+                    text: "默认内容",
+                    html: false,
+                    style: "",
+                },
+                btn: {
+                    merge: false,
+                    mergeReverse: false,
+                    reverse: false,
+                    position: "flex-end",
+                    ok: {
+                        enable: true,
+                        size: void 0,
+                        icon: void 0,
+                        rightIcon: false,
+                        iconIsLoading: false,
+                        text: "确定",
+                        type: "primary",
+                        callback(event) {
+                            event.close();
+                        },
+                    },
+                    cancel: {
+                        enable: true,
+                        size: void 0,
+                        icon: void 0,
+                        rightIcon: false,
+                        iconIsLoading: false,
+                        text: "关闭",
+                        type: "default",
+                        callback(event) {
+                            event.close();
+                        },
+                    },
+                    other: {
+                        enable: false,
+                        size: void 0,
+                        icon: void 0,
+                        rightIcon: false,
+                        iconIsLoading: false,
+                        text: "其它按钮",
+                        type: "default",
+                        callback(event) {
+                            event.close();
+                        },
+                    },
+                    close: {
+                        enable: true,
+                        callback(event) {
+                            event.close();
+                        },
+                    },
+                },
+                class: "",
+                only: false,
+                width: "350px",
+                height: "200px",
+                position: "center",
+                animation: "pops-anim-fadein-zoom",
+                zIndex: 10000,
+                mask: {
+                    enable: false,
+                    clickEvent: {
+                        toClose: false,
+                        toHide: false,
+                    },
+                    clickCallBack: void 0,
+                },
+                drag: false,
+                dragLimit: true,
+                dragExtraDistance: 3,
+                dragMoveCallBack() { },
+                dragEndCallBack() { },
+                forbiddenScroll: false,
+                style: null,
+                beforeAppendToPageCallBack() { },
+            };
+            config = popsUtils.assign(config, details);
+            let guid = popsUtils.getRandomGUID();
+            // 设置当前类型
+            const PopsType = "confirm";
+            config = PopsHandler.handleOnly(PopsType, config);
+            let maskHTML = PopsElementHandler.getMaskHTML(guid, config.zIndex);
+            let headerBtnHTML = PopsElementHandler.getHeaderBtnHTML(PopsType, config);
+            let bottomBtnHTML = PopsElementHandler.getBottomBtnHTML(PopsType, config);
+            let { headerStyle, headerPStyle } = PopsElementHandler.getHeaderStyle(PopsType, config);
+            let { contentStyle, contentPStyle } = PopsElementHandler.getContentStyle(PopsType, config);
+            let animHTML = PopsElementHandler.getAnimHTML(guid, PopsType, config, `
+            <div class="pops-confirm-title" style="text-align: ${config.title.position};${headerStyle}">
+                            ${config.title.html
+            ? config.title.text
+            : `<p pops style="${headerPStyle}">${config.title.text}</p>`}
+                ${headerBtnHTML}
+                        </div>
+                        <div class="pops-confirm-content" style="${contentStyle}">
+                ${config.content.html
+            ? config.content.text
+            : `<p pops style="${contentPStyle}">${config.content.text}</p>`}
+                
+                        </div>
+                        ${bottomBtnHTML}
+            `, bottomBtnHTML);
+            /**
+             * 弹窗的主元素，包括动画层
+             */
+            let $anim = PopsElementHandler.parseElement(animHTML);
+            let { popsElement: $pops, titleElement: $title, headerCloseBtnElement: $btnClose, btnOkElement: $btnOk, btnCancelElement: $btnCancel, btnOtherElement: $btnOther, } = PopsHandler.handleQueryElement($anim, PopsType);
+            /**
+             * 遮罩层元素
+             */
+            let $mask = null;
+            /**
+             * 已创建的元素列表
+             */
+            let elementList = [$anim];
+            if (config.mask.enable) {
+                // 启用遮罩层
+                let _handleMask_ = PopsHandler.handleMask({
+                    type: PopsType,
+                    guid: guid,
+                    config: config,
+                    animElement: $anim,
+                    maskHTML: maskHTML,
+                });
+                $mask = _handleMask_.maskElement;
+                elementList.push($mask);
+            }
+            let eventDetails = PopsHandler.handleEventDetails(guid, $shadowContainer, $shadowRoot, PopsType, $anim, $pops, $mask, config);
+            PopsHandler.handleClickEvent("close", $btnClose, eventDetails, config.btn.close.callback);
+            PopsHandler.handleClickEvent("ok", $btnOk, eventDetails, config.btn.ok.callback);
+            PopsHandler.handleClickEvent("cancel", $btnCancel, eventDetails, config.btn.cancel.callback);
+            PopsHandler.handleClickEvent("other", $btnOther, eventDetails, config.btn.other.callback);
+            /* 创建到页面中 */
+            popsDOMUtils.append($shadowRoot, elementList);
+            if (typeof config.beforeAppendToPageCallBack === "function") {
+                config.beforeAppendToPageCallBack($shadowRoot, $shadowContainer);
+            }
+            popsDOMUtils.appendBody($shadowContainer);
+            if ($mask != null) {
+                $anim.after($mask);
+            }
+            PopsHandler.handlePush(PopsType, {
+                guid: guid,
+                animElement: $anim,
+                popsElement: $pops,
+                maskElement: $mask,
+                $shadowContainer: $shadowContainer,
+                $shadowRoot: $shadowRoot,
+            });
+            /* 拖拽 */
+            if (config.drag) {
+                PopsUIUtils.drag($pops, {
+                    dragElement: $title,
+                    limit: config.dragLimit,
+                    extraDistance: config.dragExtraDistance,
+                    moveCallBack: config.dragMoveCallBack,
+                    endCallBack: config.dragEndCallBack,
+                });
+            }
+            return PopsHandler.handleResultDetails(eventDetails);
+        }
+    }
+
+    class Pops {
+        /** 配置 */
+        config = {
+            /** 版本号 */
+            version: "2024.7.8",
+            cssText: {
+                /** 主CSS */
+                index: indexCSS,
+                /** 九宫格位置CSS */
+                ninePalaceGridPosition: ninePalaceGridPositionCSS,
+                /** 滚动条CSS */
+                scrollbar: scrollbarCSS,
+                /** 按钮CSS */
+                button: buttonCSS,
+                /** 通用的CSS */
+                common: commonCSS,
+                /** 动画 */
+                anim: animCSS,
+                /** pops.alert */
+                alertCSS: alertCSS,
+                /** pops.cponfirm */
+                confirmCSS: confirmCSS,
+            },
+            /** icon图标的svg代码 */
+            iconSVG: {
+                min: SVG_min,
+                mise: SVG_mise,
+                max: SVG_max,
+                close: SVG_close,
+                edit: SVG_edit,
+                share: SVG_share,
+                delete: SVG_delete,
+                search: SVG_search,
+                upload: SVG_upload,
+                loading: SVG_loading,
+                next: SVG_next,
+                prev: SVG_prev,
+                eleme: SVG_eleme,
+                elemePlus: SVG_elemePlus,
+                chromeFilled: SVG_chromeFilled,
+                cpu: SVG_cpu,
+                videoPlay: SVG_videoPlay,
+                videoPause: SVG_videoPause,
+                headset: SVG_headset,
+                monitor: SVG_monitor,
+                documentCopy: SVG_documentCopy,
+                picture: SVG_picture,
+                circleClose: SVG_circleClose,
+                view: SVG_view,
+                hide: SVG_hide,
+                keyboard: SVG_keyboard,
+                arrowRight: SVG_arrowRight,
+                arrowLeft: SVG_arrowLeft,
+            },
+            /** 当前已配置的动画@keyframes名字映射(初始化时生成) */
+            animation: {},
+            /** 是否初始化 */
+            isInit: false,
+            /** 存储已创建的元素 */
+            layer: {
+                alert: [],
+                confirm: [],
+                prompt: [],
+                loading: [],
+                iframe: [],
+                tooltip: [],
+                drawer: [],
+                folder: [],
+                panel: [],
+            },
+            /** 禁止滚动 */
+            forbiddenScroll: {
+                event(event) {
+                    return popsDOMUtils.preventEvent(event);
+                },
+            },
+            /** pops使用的工具类 */
+            Utils: popsUtils,
+            /** pops使用的DOM工具类 */
+            DOMUtils: popsDOMUtils,
+        };
+        constructor() { }
+        init() {
+            if (!this.config.isInit) {
+                /* 处理获取当前所有的动画名 */
+                this.config.isInit = true;
+                let animationStyle = document.createElement("style");
+                animationStyle.innerHTML = this.config.cssText.anim;
+                popsDOMUtils.appendHead(animationStyle);
+                this.config.animation = null;
+                this.config.animation = PopsUIUtils.getKeyFrames(animationStyle.sheet);
+                setTimeout(() => {
+                    animationStyle.remove();
+                }, 50);
+            }
+        }
+        /**
+         * 释放原有的pops控制权
+         * @example
+         * let pops = window.pops.noConflict()
+         */
+        noConflict() {
+            if (typeof PopsCore.globalThis.pops === "object") {
+                popsUtils.delete(PopsCore.globalThis, "pops");
+            }
+            if (typeof unsafeWindow === "object" &&
+                unsafeWindow != null &&
+                typeof unsafeWindow.pops === "object") {
+                popsUtils.delete(unsafeWindow, "pops");
+            }
+            return new Pops();
+        }
+        /**
+         * 通过navigator.userAgent判断是否是手机访问
+         * @param userAgent
+         */
+        isPhone(userAgent = PopsCore.globalThis.navigator.userAgent) {
+            return Boolean(/(iPhone|iPad|iPod|iOS|Android)/i.test(userAgent));
+        }
+        /**
+         * 普通信息框
+         * @param details 配置
+         */
+        alert = (details) => {
+            return new PopsAlert(details);
+        };
+        /**
+         * 询问框
+         * @param details 配置
+         */
+        confirm = (details) => {
+            return new PopsConfirm(details);
+        };
+    }
+    const pops = new Pops();
+
+    return pops;
+
+}));
+//# sourceMappingURL=index.amd.js.map