@whitesev/pops 2.1.4 → 2.1.5

package/dist/index.system.js

@@ -3,14 +3,18 @@ System.register('pops', [], (function (exports) {
     return {
         execute: (function () {
 
+            /**
+             * 存储在元素属性上的事件名
+             */
             const SymbolEvents = Symbol("events_" + (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1));
 
-            const PopsCoreEnv = {
+            const PopsCoreDefaultEnv = {
                 document: document,
                 window: window,
                 globalThis: globalThis,
                 self: self,
             };
+            const PopsCoreEnv = Object.assign({}, PopsCoreDefaultEnv);
             const PopsCore = {
                 get document() {
                     return PopsCoreEnv.document;
@@ -2230,17 +2234,18 @@ System.register('pops', [], (function (exports) {
             }
             const popsDOMUtils = new PopsDOMUtils();
 
-            const PopsLayer = {
+            const PopsLayerData = {
                 alert: [],
                 confirm: [],
-                prompt: [],
-                loading: [],
-                iframe: [],
-                tooltip: [],
                 drawer: [],
                 folder: [],
+                iframe: [],
+                loading: [],
                 panel: [],
+                prompt: [],
                 rightClickMenu: [],
+                // 没有 searchSuggestion
+                tooltip: [],
             };
 
             var indexCSS = "@charset \"utf-8\";\r\n.pops * {\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\tinterpolate-size: allow-keywords;\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\tline-height: normal;\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\tdisplay: flex;\r\n\tflex-direction: column;\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: normal;\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\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: normal;\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\tdisplay: flex;\r\n\talign-items: center;\r\n}\r\n.pops[type-value] .pops-header-controls {\r\n\tdisplay: flex;\r\n\tgap: 6px;\r\n}\r\n\r\n/* 标题禁止选中文字 */\r\n.pops [class^=\"pops\"][class*=\"-title\"] p[pops] {\r\n\t-webkit-user-select: none;\r\n\t-moz-user-select: none;\r\n\t-ms-user-select: none;\r\n\tuser-select: none;\r\n}\r\n\r\n/* <code> */\r\n.pops code {\r\n\tfont-family: Menlo, Monaco, Consolas, \"Courier New\", monospace;\r\n\tfont-size: 0.85em;\r\n\tcolor: #000;\r\n\tbackground-color: #f0f0f0;\r\n\tborder-radius: 3px;\r\n\tborder: 0;\r\n\tpadding: 0.2em 0;\r\n\twhite-space: normal;\r\n\tbackground: #f5f5f5;\r\n\ttext-wrap: wrap;\r\n\ttext-align: left;\r\n\tword-spacing: normal;\r\n\tword-break: normal;\r\n\tword-wrap: normal;\r\n\tline-height: 1.4;\r\n\t-moz-tab-size: 8;\r\n\t-o-tab-size: 8;\r\n\ttab-size: 8;\r\n\t-webkit-hyphens: none;\r\n\t-moz-hyphens: none;\r\n\t-ms-hyphens: none;\r\n\thyphens: none;\r\n\tdirection: ltr;\r\n}\r\n\r\n.pops code::before,\r\n.pops code::after {\r\n\tletter-spacing: -0.2em;\r\n\tcontent: \"\\00a0\";\r\n}\r\n";
@@ -2435,8 +2440,8 @@ System.register('pops', [], (function (exports) {
                     function isVisibleNode($css) {
                         return $css.position !== "static" && $css.display !== "none";
                     }
-                    Object.keys(PopsLayer).forEach((layerName) => {
-                        let layerList = PopsLayer[layerName];
+                    Object.keys(PopsLayerData).forEach((layerName) => {
+                        let layerList = PopsLayerData[layerName];
                         for (let index = 0; index < layerList.length; index++) {
                             const layer = layerList[index];
                             let nodeStyle = window.getComputedStyle(layer.animElement);
@@ -2984,8 +2989,7 @@ System.register('pops', [], (function (exports) {
                             let style = configValue == null
                                 ? ""
                                 : typeof configValue === "function"
-                                    ? // @ts-ignore
-                                        configValue()
+                                    ? configValue()
                                     : configValue;
                             if (typeof style === "string") {
                                 result.style = style;
@@ -2999,7 +3003,7 @@ System.register('pops', [], (function (exports) {
                                     ? configValue()
                                     : configValue;
                             if (typeof zIndex === "string") {
-                                let newIndex = (zIndex = parseInt(zIndex));
+                                let newIndex = (zIndex = Number(zIndex));
                                 if (!isNaN(newIndex)) {
                                     result.zIndex = newIndex;
                                 }
@@ -3080,37 +3084,38 @@ System.register('pops', [], (function (exports) {
 
             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 PopsIconData = {
+                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,
+            };
             const PopsIcon = {
-                $data: {
-                    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,
-                },
+                $data: PopsIconData,
                 /**
                  * 判断是否存在某个icon
                  * @param iconName 图标名
@@ -3474,7 +3479,7 @@ System.register('pops', [], (function (exports) {
                     function clickEvent(event) {
                         popsDOMUtils.preventEvent(event);
                         // 获取该类型实例存储列表
-                        let targetLayer = PopsLayer[details.type];
+                        let targetLayer = PopsLayerData[details.type];
                         function originalRun() {
                             if (details.config.mask.clickEvent.toClose) {
                                 /* 关闭 */
@@ -3661,13 +3666,13 @@ System.register('pops', [], (function (exports) {
                         mode: mode,
                         guid: guid,
                         close() {
-                            return PopsInstanceUtils.close(mode, PopsLayer[mode], guid, config, animElement);
+                            return PopsInstanceUtils.close(mode, PopsLayerData[mode], guid, config, animElement);
                         },
                         hide() {
-                            return PopsInstanceUtils.hide(mode, PopsLayer[mode], guid, config, animElement, maskElement);
+                            return PopsInstanceUtils.hide(mode, PopsLayerData[mode], guid, config, animElement, maskElement);
                         },
                         show() {
-                            return PopsInstanceUtils.show(mode, PopsLayer[mode], guid, config, animElement, maskElement);
+                            return PopsInstanceUtils.show(mode, PopsLayerData[mode], guid, config, animElement, maskElement);
                         },
                     };
                 },
@@ -3689,13 +3694,13 @@ System.register('pops', [], (function (exports) {
                         mode: mode,
                         guid: guid,
                         close() {
-                            return PopsInstanceUtils.close(mode, PopsLayer[mode], guid, config, animElement);
+                            return PopsInstanceUtils.close(mode, PopsLayerData[mode], guid, config, animElement);
                         },
                         hide() {
-                            return PopsInstanceUtils.hide(mode, PopsLayer[mode], guid, config, animElement, maskElement);
+                            return PopsInstanceUtils.hide(mode, PopsLayerData[mode], guid, config, animElement, maskElement);
                         },
                         show() {
-                            return PopsInstanceUtils.show(mode, PopsLayer[mode], guid, config, animElement, maskElement);
+                            return PopsInstanceUtils.show(mode, PopsLayerData[mode], guid, config, animElement, maskElement);
                         },
                     };
                 },
@@ -3807,20 +3812,20 @@ System.register('pops', [], (function (exports) {
                         if (type === "loading" ||
                             type === "tooltip" ||
                             type === "rightClickMenu") {
-                            let layer = PopsLayer[type];
+                            let layer = PopsLayerData[type];
                             if (layer) {
                                 PopsInstanceUtils.removeInstance([layer], "", true);
                             }
                         }
                         else {
                             PopsInstanceUtils.removeInstance([
-                                PopsLayer.alert,
-                                PopsLayer.confirm,
-                                PopsLayer.prompt,
-                                PopsLayer.iframe,
-                                PopsLayer.drawer,
-                                PopsLayer.folder,
-                                PopsLayer.panel,
+                                PopsLayerData.alert,
+                                PopsLayerData.confirm,
+                                PopsLayerData.prompt,
+                                PopsLayerData.iframe,
+                                PopsLayerData.drawer,
+                                PopsLayerData.folder,
+                                PopsLayerData.panel,
                             ], "", true);
                         }
                     }
@@ -3841,7 +3846,7 @@ System.register('pops', [], (function (exports) {
                  * @param value
                  */
                 handlePush(type, value) {
-                    PopsLayer[type].push(value);
+                    PopsLayerData[type].push(value);
                 },
             };
 
@@ -4763,7 +4768,7 @@ System.register('pops', [], (function (exports) {
                     popsDOMUtils.on(headerCloseBtnElement, "click", (event) => {
                         event.preventDefault();
                         event.stopPropagation();
-                        PopsInstanceUtils.removeInstance([PopsLayer.iframe], guid, false);
+                        PopsInstanceUtils.removeInstance([PopsLayerData.iframe], guid, false);
                         if (typeof config?.btn?.close?.callback === "function") {
                             config.btn.close.callback(eventDetails, event);
                         }
@@ -7061,7 +7066,10 @@ System.register('pops', [], (function (exports) {
                 },
             };
 
-            const PanelHandleContentDetails = () => {
+            /**
+             * 处理组件（把组件配置转为组件元素）
+             */
+            const PanelHandlerComponents = () => {
                 return {
                     /**
                      * 左侧的ul容器
@@ -9770,11 +9778,11 @@ System.register('pops', [], (function (exports) {
                     if ($mask != null) {
                         $anim.after($mask);
                     }
-                    let panelHandleContentDetails = PanelHandleContentDetails();
+                    let panelHandlerComponents = PanelHandlerComponents();
                     /**
                      * 处理内部配置
                      */
-                    panelHandleContentDetails.init({
+                    panelHandlerComponents.init({
                         config: config,
                         $el: {
                             $pops: $pops,
@@ -11054,14 +11062,14 @@ System.register('pops', [], (function (exports) {
                 /** 配置 */
                 config = {
                     /** 版本号 */
-                    version: "2025.6.25",
+                    version: "2025.7.1",
                     cssText: PopsCSS,
                     /** icon图标的svg代码 */
                     iconSVG: PopsIcon.$data,
                     /** 当前已配置的动画@keyframes名字映射(初始化时生成) */
                     animation: PopsAnimation.$data,
                     /** 存储已创建的元素 */
-                    layer: PopsLayer,
+                    layer: PopsLayerData,
                     /** 禁止滚动 */
                     forbiddenScroll: {
                         event(event) {
@@ -11077,7 +11085,7 @@ System.register('pops', [], (function (exports) {
                     /** pops处理float类型使用的工具类 */
                     MathFloatUtils: PopsMathFloatUtils,
                     /** pops.panel中用于处理各个类型的工具 */
-                    panelHandleContentUtils: PanelHandleContentDetails,
+                    PanelHandlerComponents: PanelHandlerComponents,
                 };
                 init() { }
                 /**