@whitesev/pops 2.3.0 → 2.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.amd.js CHANGED
@@ -441,7 +441,7 @@ define((function () { 'use strict';
441
441
  };
442
442
 
443
443
  // This is the minified and stringified code of the worker-timers-worker package.
444
- const worker = `(()=>{var e={455:function(e,t){!function(e){"use strict";var t=function(e){return function(t){var r=e(t);return t.add(r),r}},r=function(e){return function(t,r){return e.set(t,r),r}},n=void 0===Number.MAX_SAFE_INTEGER?9007199254740991:Number.MAX_SAFE_INTEGER,o=536870912,s=2*o,a=function(e,t){return function(r){var a=t.get(r),i=void 0===a?r.size:a<s?a+1:0;if(!r.has(i))return e(r,i);if(r.size<o){for(;r.has(i);)i=Math.floor(Math.random()*s);return e(r,i)}if(r.size>n)throw new Error("Congratulations, you created a collection of unique numbers which uses all available integers!");for(;r.has(i);)i=Math.floor(Math.random()*n);return e(r,i)}},i=new WeakMap,u=r(i),c=a(u,i),l=t(c);e.addUniqueNumber=l,e.generateUniqueNumber=c}(t)}},t={};function r(n){var o=t[n];if(void 0!==o)return o.exports;var s=t[n]={exports:{}};return e[n].call(s.exports,s,s.exports,r),s.exports}(()=>{"use strict";const e=-32603,t=-32602,n=-32601,o=(e,t)=>Object.assign(new Error(e),{status:t}),s=t=>o('The handler of the method called "'.concat(t,'" returned an unexpected result.'),e),a=(t,r)=>async({data:{id:a,method:i,params:u}})=>{const c=r[i];try{if(void 0===c)throw(e=>o('The requested method called "'.concat(e,'" is not supported.'),n))(i);const r=void 0===u?c():c(u);if(void 0===r)throw(t=>o('The handler of the method called "'.concat(t,'" returned no required result.'),e))(i);const l=r instanceof Promise?await r:r;if(null===a){if(void 0!==l.result)throw s(i)}else{if(void 0===l.result)throw s(i);const{result:e,transferables:r=[]}=l;t.postMessage({id:a,result:e},r)}}catch(e){const{message:r,status:n=-32603}=e;t.postMessage({error:{code:n,message:r},id:a})}};var i=r(455);const u=new Map,c=(e,r,n)=>({...r,connect:({port:t})=>{t.start();const n=e(t,r),o=(0,i.generateUniqueNumber)(u);return u.set(o,(()=>{n(),t.close(),u.delete(o)})),{result:o}},disconnect:({portId:e})=>{const r=u.get(e);if(void 0===r)throw(e=>o('The specified parameter called "portId" with the given value "'.concat(e,'" does not identify a port connected to this worker.'),t))(e);return r(),{result:null}},isSupported:async()=>{if(await new Promise((e=>{const t=new ArrayBuffer(0),{port1:r,port2:n}=new MessageChannel;r.onmessage=({data:t})=>e(null!==t),n.postMessage(t,[t])}))){const e=n();return{result:e instanceof Promise?await e:e}}return{result:!1}}}),l=(e,t,r=()=>!0)=>{const n=c(l,t,r),o=a(e,n);return e.addEventListener("message",o),()=>e.removeEventListener("message",o)},d=(e,t)=>r=>{const n=t.get(r);if(void 0===n)return Promise.resolve(!1);const[o,s]=n;return e(o),t.delete(r),s(!1),Promise.resolve(!0)},f=(e,t,r,n)=>(o,s,a)=>{const i=o+s-t.timeOrigin,u=i-t.now();return new Promise((t=>{e.set(a,[r(n,u,i,e,t,a),t])}))},m=new Map,h=d(globalThis.clearTimeout,m),p=new Map,v=d(globalThis.clearTimeout,p),w=((e,t)=>{const r=(n,o,s,a)=>{const i=n-e.now();i>0?o.set(a,[t(r,i,n,o,s,a),s]):(o.delete(a),s(!0))};return r})(performance,globalThis.setTimeout),g=f(m,performance,globalThis.setTimeout,w),T=f(p,performance,globalThis.setTimeout,w);l(self,{clear:async({timerId:e,timerType:t})=>({result:await("interval"===t?h(e):v(e))}),set:async({delay:e,now:t,timerId:r,timerType:n})=>({result:await("interval"===n?g:T)(e,t,r)})})})()})();`; // tslint:disable-line:max-line-length
444
+ const worker = `(()=>{var e={455:function(e,t){!function(e){"use strict";var t=function(e){return function(t){var r=e(t);return t.add(r),r}},r=function(e){return function(t,r){return e.set(t,r),r}},n=void 0===Number.MAX_SAFE_INTEGER?9007199254740991:Number.MAX_SAFE_INTEGER,o=536870912,s=2*o,a=function(e,t){return function(r){var a=t.get(r),i=void 0===a?r.size:a<s?a+1:0;if(!r.has(i))return e(r,i);if(r.size<o){for(;r.has(i);)i=Math.floor(Math.random()*s);return e(r,i)}if(r.size>n)throw new Error("Congratulations, you created a collection of unique numbers which uses all available integers!");for(;r.has(i);)i=Math.floor(Math.random()*n);return e(r,i)}},i=new WeakMap,u=r(i),c=a(u,i),l=t(c);e.addUniqueNumber=l,e.generateUniqueNumber=c}(t)}},t={};function r(n){var o=t[n];if(void 0!==o)return o.exports;var s=t[n]={exports:{}};return e[n].call(s.exports,s,s.exports,r),s.exports}(()=>{"use strict";const e=-32603,t=-32602,n=-32601,o=(e,t)=>Object.assign(new Error(e),{status:t}),s=t=>o('The handler of the method called "'.concat(t,'" returned an unexpected result.'),e),a=(t,r)=>async({data:{id:a,method:i,params:u}})=>{const c=r[i];try{if(void 0===c)throw(e=>o('The requested method called "'.concat(e,'" is not supported.'),n))(i);const r=void 0===u?c():c(u);if(void 0===r)throw(t=>o('The handler of the method called "'.concat(t,'" returned no required result.'),e))(i);const l=r instanceof Promise?await r:r;if(null===a){if(void 0!==l.result)throw s(i)}else{if(void 0===l.result)throw s(i);const{result:e,transferables:r=[]}=l;t.postMessage({id:a,result:e},r)}}catch(e){const{message:r,status:n=-32603}=e;t.postMessage({error:{code:n,message:r},id:a})}};var i=r(455);const u=new Map,c=(e,r,n)=>({...r,connect:({port:t})=>{t.start();const n=e(t,r),o=(0,i.generateUniqueNumber)(u);return u.set(o,()=>{n(),t.close(),u.delete(o)}),{result:o}},disconnect:({portId:e})=>{const r=u.get(e);if(void 0===r)throw(e=>o('The specified parameter called "portId" with the given value "'.concat(e,'" does not identify a port connected to this worker.'),t))(e);return r(),{result:null}},isSupported:async()=>{if(await new Promise(e=>{const t=new ArrayBuffer(0),{port1:r,port2:n}=new MessageChannel;r.onmessage=({data:t})=>e(null!==t),n.postMessage(t,[t])})){const e=n();return{result:e instanceof Promise?await e:e}}return{result:!1}}}),l=(e,t,r=()=>!0)=>{const n=c(l,t,r),o=a(e,n);return e.addEventListener("message",o),()=>e.removeEventListener("message",o)},d=(e,t)=>r=>{const n=t.get(r);if(void 0===n)return Promise.resolve(!1);const[o,s]=n;return e(o),t.delete(r),s(!1),Promise.resolve(!0)},f=(e,t,r,n)=>(o,s,a)=>{const i=o+s-t.timeOrigin,u=i-t.now();return new Promise(t=>{e.set(a,[r(n,u,i,e,t,a),t])})},m=new Map,h=d(globalThis.clearTimeout,m),p=new Map,v=d(globalThis.clearTimeout,p),w=((e,t)=>{const r=(n,o,s,a)=>{const i=n-e.now();i>0?o.set(a,[t(r,i,n,o,s,a),s]):(o.delete(a),s(!0))};return r})(performance,globalThis.setTimeout),g=f(m,performance,globalThis.setTimeout,w),T=f(p,performance,globalThis.setTimeout,w);l(self,{clear:async({timerId:e,timerType:t})=>({result:await("interval"===t?h(e):v(e))}),set:async({delay:e,now:t,timerId:r,timerType:n})=>({result:await("interval"===n?g:T)(e,t,r)})})})()})();`; // tslint:disable-line:max-line-length
445
445
 
446
446
  const loadOrReturnBroker = createLoadOrReturnBroker(load, worker);
447
447
  const clearInterval$1 = (timerId) => loadOrReturnBroker().clearInterval(timerId);
@@ -2778,9 +2778,9 @@ define((function () { 'use strict';
2778
2778
 
2779
2779
  var folderCSS = ".pops-folder-list {\n\t--folder-arrow-fill-color: #d4d7de;\n\t--folder-arrow-active-fill-color: #06a7ff;\n\t--header-breadcrumb-text-color: #06a7ff;\n\t--header-breadcrumb-all-files-text-color: var(--header-breadcrumb-text-color);\n\t--header-breadcrumb-all-files-first-text-color: var(--header-breadcrumb-text-color);\n\t--header-breadcrumb-all-files-last-text-color: #999999;\n\t--table-header-row-text-color: #818999;\n\t--table-body-td-text-color: rgb(247, 248, 250, var(--pops-bg-opacity));\n\t--table-body-th-text-color: rgb(247, 248, 250, var(--pops-bg-opacity));\n\t--table-body-row-text-color: #05082c;\n\t--table-body-row-file-name-text-color: #05082c;\n\t--table-body-row-hover-bd-color: rgb(245, 246, 247, var(--pops-bg-opacity));\n\t--table-body-row-hover-bg-color: rgb(245, 246, 247, var(--pops-bg-opacity));\n\t--table-body-row-file-name-hover-text-color: #06a7ff;\n\t--table-body-row-content-text-color: #818999;\n}\n.pops-folder-list .cursor-p {\n\tcursor: pointer;\n}\n.pops-folder-list a {\n\tbackground: 0 0;\n\ttext-decoration: none;\n\t-webkit-tap-highlight-color: transparent;\n\tcolor: var(--header-breadcrumb-text-color);\n}\ntable.pops-folder-list-table__body,\ntable.pops-folder-list-table__header {\n\twidth: 100%;\n\ttable-layout: fixed;\n\tborder-collapse: collapse;\n\tborder-spacing: 0;\n\tpadding: 0 20px;\n}\ntable.pops-folder-list-table__body,\ntable.pops-folder-list-table__header {\n\theight: 100%;\n\tbackground: 0 0;\n\toverflow: hidden;\n\tdisplay: -webkit-box;\n\tdisplay: -ms-flexbox;\n\t-ms-flex-direction: column;\n\t-webkit-box-orient: vertical;\n\t-webkit-box-direction: normal;\n}\ntable.pops-folder-list-table__body {\n\theight: 100%;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tuser-select: none;\n}\n.pops-folder-list table tr {\n\tline-height: normal;\n\talign-content: center;\n}\n.pops-folder-list-table__header-row {\n\theight: 50px;\n\tline-height: normal;\n\talign-content: center;\n\tcolor: var(--table-header-row-text-color);\n\ttext-align: left;\n\tfont-size: 12px;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tuser-select: none;\n}\n.pops-folder-list-table__body-row {\n\theight: 50px;\n\tline-height: normal;\n\talign-content: center;\n\tcolor: var(--table-body-row-text-color);\n\tfont-size: 12px;\n}\n.pops-folder-list-table__body-row:hover {\n\tbackground-color: var(--table-body-row-hover-bg-color);\n\tborder-color: var(--table-body-row-hover-bd-color);\n\tborder: 0;\n\toutline: none;\n}\n.pops-folder-list table th {\n\tborder: 0;\n\tborder-bottom: 1px solid var(--table-body-th-text-color);\n}\n.pops-folder-list table td {\n\tborder: 0;\n\tborder-bottom: 1px solid var(--table-body-td-text-color);\n\tposition: relative;\n}\n.pops-folder-list .list-name-text {\n\tdisplay: inline-block;\n\tpadding-left: 12px;\n\tline-height: normal;\n\talign-content: center;\n\tmax-width: 176px;\n}\n.pops-folder-list-file-name > div {\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.pops-mobile-folder-list-file-name {\n\tdisplay: flex;\n\talign-items: center;\n}\n.pops-mobile-folder-list-file-name > div {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tpadding: 6px 0px;\n\tflex-direction: column;\n}\n.pops-mobile-folder-list-file-name img.pops-folder-list-file-icon {\n\twidth: 45px;\n\theight: 45px;\n}\n.pops-mobile-folder-list-file-name a.pops-folder-list-file-name-title-text {\n\tpadding-left: unset;\n\tmax-width: 250px;\n\toverflow-x: hidden;\n\tfont-weight: 400;\n\tline-height: unset;\n\tmargin-bottom: 4px;\n\twhite-space: normal;\n\ttext-overflow: unset;\n}\n\n/* 修改滚动 */\n.pops-folder-content {\n\toverflow: hidden !important;\n}\n.pops-folder-content .pops-folder-list {\n\theight: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n}\n.pops-folder-content .pops-folder-list-table__body-div {\n\theight: 100%;\n\tflex: 1 auto;\n\toverflow: auto;\n\tpadding-bottom: 0;\n}\n.pops-mobile-folder-content .pops-folder-list-table__body-div {\n\theight: 100%;\n\tflex: 1 auto;\n\toverflow: auto;\n\tpadding-bottom: 0;\n}\n.pops-folder-content table.pops-folder-list-table__body {\n\toverflow: auto;\n}\n.pops-folder-content .pops-folder-list-table__header-div {\n\tflex: 0;\n}\n.pops-mobile-folder-content .pops-folder-list-table__header-div {\n\tdisplay: none;\n}\n\n.pops-folder-list .pops-folder-list-file-name-title-text {\n\tcolor: var(--table-body-row-file-name-text-color);\n}\n.pops-folder-list .pops-folder-list-file-name-title-text:hover {\n\ttext-decoration: none;\n\tcolor: var(--table-body-row-file-name-hover-text-color);\n}\n.pops-folder-list .text-ellip {\n\toverflow: hidden;\n\twhite-space: nowrap;\n\ttext-overflow: ellipsis;\n}\n.pops-folder-list .content {\n\tcolor: var(--table-body-row-content-text-color);\n\tposition: relative;\n\twidth: 100%;\n\ttext-align: left;\n}\n.pops-folder-list .inline-block-v-middle {\n\tdisplay: inline-block;\n\tvertical-align: middle;\n}\n.pops-folder-list .flex-a-i-center {\n\tdisplay: flex;\n\talign-items: center;\n}\n.pops-folder-list .u-file-icon {\n\tdisplay: inline-block;\n\tvertical-align: middle;\n}\n.pops-folder-list .u-file-icon--list {\n\twidth: 32px;\n\theight: 32px;\n}\n.pops-folder-list .pops-folder-list-file-icon {\n\tline-height: normal;\n\talign-content: center;\n\tposition: relative;\n\tvertical-align: middle;\n}\n.pops-folder-list .pops-folder-file-list-breadcrumb-primary {\n\tflex: 1;\n\tdisplay: -webkit-box;\n\tdisplay: -webkit-flex;\n\tdisplay: -ms-flexbox;\n\tdisplay: flex;\n\t-webkit-box-align: center;\n\t-webkit-align-items: center;\n\t-ms-flex-align: center;\n\talign-items: center;\n\t-webkit-box-orient: horizontal;\n\t-webkit-box-direction: normal;\n\t-webkit-flex-direction: row;\n\t-ms-flex-direction: row;\n\tflex-direction: row;\n\tmin-height: 17px;\n\tflex-wrap: wrap;\n}\n.pops-folder-list .pops-folder-list-table__sort {\n\tdisplay: inline-flex;\n\tmargin-left: 4px;\n\tflex-direction: column;\n}\n\n.pops-folder-list .pops-folder-icon-arrow {\n\twidth: 10px;\n\theight: 10px;\n\tfill: var(--folder-arrow-fill-color);\n}\n.pops-folder-list .pops-folder-icon-active {\n\tfill: var(--folder-arrow-active-fill-color);\n}\n.pops-folder-list .pops-folder-file-list-breadcrumb {\n\tpadding: 4px 20px;\n\t-webkit-box-sizing: border-box;\n\tbox-sizing: border-box;\n\tdisplay: -webkit-box;\n\tdisplay: -webkit-flex;\n\tdisplay: -ms-flexbox;\n\tdisplay: flex;\n\t-webkit-box-align: center;\n\t-webkit-align-items: center;\n\t-ms-flex-align: center;\n\talign-items: center;\n\t-webkit-box-orient: horizontal;\n\t-webkit-box-direction: normal;\n\t-webkit-flex-direction: row;\n\t-ms-flex-direction: row;\n\tflex-direction: row;\n\t-webkit-box-pack: start;\n\t-webkit-justify-content: start;\n\t-ms-flex-pack: start;\n\tjustify-content: flex-start;\n\tmin-height: 35px;\n}\n.pops-folder-list .pops-folder-file-list-breadcrumb-allFiles {\n\tfont-size: 12px;\n\tcolor: var(--header-breadcrumb-all-files-text-color);\n\tline-height: normal;\n\talign-content: center;\n\tfont-weight: 700;\n\tdisplay: inline-block;\n\tmax-width: 140px;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n\tword-wrap: normal;\n}\n.pops-folder-list .pops-folder-file-list-breadcrumb-allFiles:last-child a {\n\tcolor: var(--header-breadcrumb-all-files-last-text-color);\n}\n.pops-folder-list .pops-folder-file-list-breadcrumb-allFiles:first-child a {\n\tfont-size: 14px;\n\tcolor: var(--header-breadcrumb-all-files-first-text-color);\n}\n.pops-folder-list .pops-folder-file-list-breadcrumb .iconArrow {\n\twidth: 16px;\n\theight: 16px;\n}\n.pops-folder-list .iconArrow {\n\tbackground: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAASCAMAAABYd88+AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABFUExURUdwTOLi4uLi4t7e3uPj49/f397e3t3d3f///97e3vDw8N3d3d7e3t3d3d3d3ejo6N/f397e3t7e3t3d3d/f393d3d3d3RK+NoEAAAAWdFJOUwAnM4YPU/iQA+UIeMDaHhY41i7zX7UebpjFAAAAUElEQVQI15XOORaAIAwE0LATXHCd+x9VfCiksXCq+UUWou8oZ1vXHrt7YVBiYkW4gdMKYFIC4CSATWCNHWPuM6HuHkr1x3N0ZrBu/9gl0b9c3+kF7C7hS1YAAAAASUVORK5CYII=)\n\t\t55% 50%/6px 9px no-repeat;\n}\n\n@media (prefers-color-scheme: dark) {\n\t.pops[type-value=\"folder\"] {\n\t\t--pops-title-border-color: rgb(73, 83, 102, var(--pops-bg-opacity));\n\t\t--pops-bottom-btn-controls-border-color: rgb(73, 83, 102, var(--pops-bg-opacity));\n\t}\n\t.pops-folder-list {\n\t\t--header-breadcrumb-text-color: #06a7ff;\n\t\t--header-breadcrumb-all-files-text-color: var(--header-breadcrumb-text-color);\n\t\t--header-breadcrumb-all-files-first-text-color: var(--header-breadcrumb-text-color);\n\t\t--header-breadcrumb-all-files-last-text-color: #818999;\n\t\t--table-body-row-text-color: #f7f8fa;\n\t\t--table-body-td-text-color: rgb(73, 83, 102, var(--pops-bg-opacity));\n\t\t--table-body-th-text-color: rgb(73, 83, 102, var(--pops-bg-opacity));\n\t\t--table-body-td-text-color: #495366;\n\t\t--table-body-row-hover-bd-color: #1f2022;\n\t\t--table-body-row-hover-bg-color: #1f2022;\n\t\t--table-body-row-file-name-text-color: #f7f8fa;\n\t}\n}\n";
2780
2780
 
2781
- var panelCSS = ".pops[type-value=\"panel\"] {\n\t--pops-bg-color: #f2f2f2;\n\t--pops-color: #333333;\n\t--panel-title-bg-color: #ffffff;\n\n\t--panel-aside-bg-color: #ffffff;\n\t--panel-aside-hover-color: rgb(64, 158, 255);\n\t--panel-aside-hover-bg-color: rgba(64, 158, 255, 0.1);\n\n\t--pops-panel-forms-margin-top-bottom: 10px;\n\t--pops-panel-forms-margin-left-right: 20px;\n\t--pops-panel-forms-header-icon-size: calc(var(--pops-panel-forms-container-li-padding-left-right) + 1px);\n\t--pops-panel-forms-header-padding-top-bottom: 15px;\n\t--pops-panel-forms-header-padding-left-right: 10px;\n\t--pops-panel-forms-container-item-left-text-gap: 6px;\n\t--pops-panel-forms-container-item-left-desc-text-size: 0.8em;\n\t--pops-panel-forms-container-item-left-desc-text-color: #6c6c6c;\n\t--pops-panel-forms-container-item-bg-color: #ffffff;\n\t--pops-panel-forms-container-item-title-color: #333;\n\t--pops-panel-forms-container-item-border-radius: 6px;\n\t--pops-panel-forms-container-item-margin-top-bottom: 10px;\n\t--pops-panel-forms-container-item-margin-left-right: var(--pops-panel-forms-margin-left-right);\n\t--pops-panel-forms-container-li-border-color: var(--pops-bd-color);\n\t--pops-panel-forms-container-li-padding-top-bottom: 12px;\n\t--pops-panel-forms-container-li-padding-left-right: 16px;\n\n\t--pops-panel-forms-container-deepMenu-item-active-bg: #e9e9e9;\n}\n.pops[type-value=\"panel\"] {\n\tcolor: var(--pops-color);\n\tbackground: var(--pops-bg-color);\n}\n.pops[type-value] .pops-panel-title {\n\tbackground: var(--panel-title-bg-color);\n}\n\n/* ↓panel的CSS↓ */\naside.pops-panel-aside {\n\tbox-sizing: border-box;\n\tflex-shrink: 0;\n\tmax-width: 200px;\n\tmin-width: 100px;\n\theight: 100%;\n\tbackground: var(--panel-aside-bg-color);\n\tborder-right: 1px solid var(--panel-aside-bg-color);\n\tfont-size: 0.9em;\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n}\naside.pops-panel-aside {\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n}\naside.pops-panel-aside .pops-panel-aside-top-container {\n\toverflow: auto;\n}\n.pops-panel-content {\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex: 1;\n\toverflow: auto;\n\tflex-basis: auto;\n\tbox-sizing: border-box;\n\tmin-width: 0;\n\tbottom: 0 !important;\n}\nsection.pops-panel-container {\n\twidth: 100%;\n\toverflow: hidden;\n\tdisplay: flex;\n\tflex-direction: column;\n}\nsection.pops-panel-container .pops-panel-container-header-ul,\nsection.pops-panel-container .pops-panel-deepMenu-container-header-ul {\n\tborder-bottom: 1px solid rgba(223, 223, 223, var(--pops-bg-opacity));\n\tflex: 0 auto;\n}\nsection.pops-panel-container .pops-panel-container-header-ul li,\nsection.pops-panel-container .pops-panel-container-header-ul li.pops-panel-container-header-title-text {\n\tdisplay: flex;\n\tjustify-content: flex-start !important;\n\tmargin: 0px !important;\n\tpadding: var(--pops-panel-forms-header-padding-top-bottom)\n\t\tcalc(var(--pops-panel-forms-margin-left-right) + var(--pops-panel-forms-container-li-padding-left-right));\n\ttext-align: left;\n}\nsection.pops-panel-container ul.pops-panel-container-main-ul {\n\toverflow: auto;\n\t/*flex: 1;*/\n}\naside.pops-panel-aside ul li {\n\tmargin: 6px 8px;\n\tborder-radius: 4px;\n\tpadding: 6px 10px;\n\tcursor: default;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: flex-start;\n}\naside.pops-panel-aside .pops-is-visited,\naside.pops-panel-aside ul li:not(.pops-panel-disabled-aside-hover-css):hover {\n\tcolor: var(--panel-aside-hover-color);\n\tbackground: var(--panel-aside-hover-bg-color);\n}\nsection.pops-panel-container > ul li:not(.pops-panel-forms-container-item) {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tmargin: var(--pops-panel-forms-margin-top-bottom)\n\t\tcalc(var(--pops-panel-forms-margin-left-right) + var(--pops-panel-forms-margin-left-right));\n\tgap: 10px;\n}\nsection.pops-panel-container .pops-panel-forms-container-item-header-text {\n\tmargin: 10px;\n\tmargin-left: calc(\n\t\tvar(--pops-panel-forms-margin-left-right) + var(--pops-panel-forms-container-li-padding-left-right)\n\t);\n\tfont-size: 0.9em;\n\ttext-align: left;\n\tcolor: var(--pops-panel-forms-container-item-title-color);\n}\nsection.pops-panel-container li.pops-panel-forms-container-item {\n\t/* 去除<li>左侧的圆点 */\n\tdisplay: block;\n}\nsection.pops-panel-container .pops-panel-forms-container-item ul.pops-panel-forms-container-item-formlist {\n\tborder-radius: var(--pops-panel-forms-container-item-border-radius);\n\tbackground: var(--pops-panel-forms-container-item-bg-color);\n\tmargin: var(--pops-panel-forms-container-item-margin-top-bottom) var(--pops-panel-forms-margin-left-right);\n}\nsection.pops-panel-container .pops-panel-forms-container-item ul.pops-panel-forms-container-item-formlist li {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tpadding: var(--pops-panel-forms-container-li-padding-top-bottom) 0px;\n\tmargin: 0px var(--pops-panel-forms-container-li-padding-left-right);\n\tborder-bottom: 1px solid var(--pops-panel-forms-container-li-border-color);\n\ttext-align: left;\n}\n/*section.pops-panel-container\n\t.pops-panel-forms-container-item\n\tul\n\tli.pops-panel-deepMenu-nav-item {\n\tpadding: var(--pops-panel-forms-container-li-padding-top-bottom) 0px;\n\tmargin: 0px var(--pops-panel-forms-container-li-padding-left-right);\n\tborder-bottom: 1px solid var(--pops-panel-forms-container-li-border-color);\n}*/\nsection.pops-panel-container\n\t.pops-panel-forms-container-item\n\tul.pops-panel-forms-container-item-formlist\n\tli:last-child {\n\tborder: 0px;\n}\n/* 左侧的文字 */\nsection.pops-panel-container .pops-panel-item-left-text {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--pops-panel-forms-container-item-left-text-gap);\n}\n\n/* 左侧的主文字 */\n/*section.pops-panel-container .pops-panel-item-left-main-text {\n\t\n}*/\n/* 左侧的描述文字 */\nsection.pops-panel-container .pops-panel-item-left-desc-text {\n\tfont-size: var(--pops-panel-forms-container-item-left-desc-text-size);\n\tcolor: var(--pops-panel-forms-container-item-left-desc-text-color);\n}\n\n/* 折叠面板 */\nsection.pops-panel-container .pops-panel-forms-fold {\n\tborder-radius: var(--pops-panel-forms-container-item-border-radius);\n\tbackground: var(--pops-panel-forms-container-item-bg-color);\n\tmargin: var(--pops-panel-forms-margin-top-bottom) var(--pops-panel-forms-margin-left-right);\n}\nsection.pops-panel-container .pops-panel-forms-fold .pops-panel-forms-fold-container {\n\tdisplay: flex;\n\talign-items: center;\n\tfill: #6c6c6c;\n\tjustify-content: space-between;\n\tmargin: 0px var(--pops-panel-forms-container-li-padding-left-right) !important;\n\tpadding: var(--pops-panel-forms-container-li-padding-top-bottom) 0px !important;\n}\nsection.pops-panel-container .pops-panel-forms-fold[data-fold-enable] .pops-panel-forms-fold-container-icon {\n\ttransform: rotate(90deg);\n}\nsection.pops-panel-container .pops-panel-forms-fold .pops-panel-forms-fold-container-icon {\n\twidth: 15px;\n\theight: 15px;\n\tdisplay: flex;\n\talign-items: center;\n\ttransform: rotate(-90deg);\n\ttransition: transform 0.3s;\n}\n/* 折叠状态 */\nsection.pops-panel-container\n\t.pops-panel-forms-fold[data-fold-enable]\n\t.pops-panel-forms-container-item-formlist {\n\theight: 0;\n}\n/* 非折叠状态 */\nsection.pops-panel-container .pops-panel-forms-fold ul.pops-panel-forms-container-item-formlist {\n\tmargin: 0;\n}\nsection.pops-panel-container .pops-panel-forms-fold .pops-panel-forms-container-item-formlist {\n\ttransition: height 0.3s;\n\toverflow: hidden;\n\tborder-radius: unset;\n\tbackground: unset;\n\tmargin: 0;\n\theight: calc-size(auto, size);\n}\n/* 折叠面板 */\n\n/* 姑且认为小于600px的屏幕为移动端 */\n@media (max-width: 600px) {\n\t/* 兼容移动端CSS */\n\t.pops[type-value=\"panel\"] {\n\t\t--pops-panel-forms-margin-left-right: 10px;\n\t}\n\t.pops[type-value=\"panel\"] {\n\t\twidth: 92%;\n\t\twidth: 92vw;\n\t\twidth: 92dvw;\n\t}\n\t.pops[type-value=\"panel\"] .pops-panel-content aside.pops-panel-aside {\n\t\tmax-width: 20%;\n\t\tmin-width: auto;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container .pops-panel-forms-container-item > div {\n\t\ttext-align: left;\n\t\t--pops-panel-forms-margin-left-right: 0px;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container .pops-panel-forms-container-item ul {\n\t\tmargin: 0px !important;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container > ul > li {\n\t\tmargin: 10px 10px;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container > ul > li div:nth-child(2) {\n\t\tmax-width: 55%;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container .pops-panel-select select {\n\t\tmin-width: 88px !important;\n\t\twidth: -webkit-fill-available;\n\t\twidth: -moz-available;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container .pops-panel-container-header-ul li {\n\t\tfont-size: 16px;\n\t}\n\t.pops[type-value=\"panel\"] .pops-panel-title p[pops],\n\t.pops[type-value=\"panel\"] section.pops-panel-container > ul li,\n\t.pops[type-value=\"panel\"] aside.pops-panel-aside ul li {\n\t\tfont-size: 14px;\n\t}\n}\n/* switch的CSS */\n.pops-panel-switch {\n\t--panel-switch-core-bd-color: rgb(220, 223, 230, var(--pops-bd-opacity));\n\t--panel-switch-core-bg-color: rgb(220, 223, 230, var(--pops-bg-opacity));\n\t--panel-switch-circle-color: #dcdfe6;\n\t--panel-switch-circle-bg-color: rgb(255, 255, 255, var(--pops-bg-opacity));\n\t--panel-switch-checked-circle-color: #409eff;\n\t--panel-switch-checked-core-bd-color: rgb(64, 158, 255, var(--pops-bd-opacity));\n\t--panel-switch-checked-core-bg-color: rgb(64, 158, 255, var(--pops-bg-opacity));\n}\n.pops-panel-switch {\n\tdisplay: inline-flex;\n\tflex-direction: row-reverse;\n\talign-items: center;\n\tposition: relative;\n\tfont-size: 14px;\n\tline-height: normal;\n\talign-content: center;\n\theight: 32px;\n\tvertical-align: middle;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-ms-user-select: none;\n\t-moz-user-select: none;\n}\n.pops-panel-switch input.pops-panel-switch__input {\n\tposition: absolute;\n\twidth: 0;\n\theight: 0;\n\topacity: 0;\n\tmargin: 0;\n}\n.pops-panel-switch:has(input.pops-panel-switch__input:disabled),\n.pops-panel-switch[data-disabled],\n.pops-panel-switch[data-disabled] .pops-panel-switch__core,\n.pops-panel-switch input.pops-panel-switch__input:disabled + .pops-panel-switch__core {\n\tcursor: not-allowed;\n\topacity: 0.6;\n}\n.pops-panel-switch span.pops-panel-switch__core {\n\tdisplay: inline-flex;\n\tposition: relative;\n\talign-items: center;\n\tmin-width: 40px;\n\theight: 20px;\n\tborder: 1px solid var(--panel-switch-core-bd-color);\n\toutline: 0;\n\tborder-radius: 10px;\n\tbox-sizing: border-box;\n\tbackground: var(--panel-switch-core-bg-color);\n\tcursor: pointer;\n\ttransition: border-color 0.3s, background-color 0.3s;\n}\n.pops-panel-switch .pops-panel-switch__action {\n\tposition: absolute;\n\tleft: 1px;\n\tborder-radius: 100%;\n\ttransition: all 0.3s;\n\twidth: 16px;\n\theight: 16px;\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbackground-color: var(--panel-switch-circle-bg-color);\n\tcolor: var(--panel-switch-circle-color);\n}\n.pops-panel-switch.pops-panel-switch-is-checked span.pops-panel-switch__core {\n\tborder-color: var(--panel-switch-checked-core-bd-color);\n\tbackground-color: var(--panel-switch-checked-core-bg-color);\n}\n.pops-panel-switch.pops-panel-switch-is-checked .pops-panel-switch__action {\n\tleft: calc(100% - 17px);\n\tcolor: var(--panel-switch-checked-circle-color);\n}\n/* switch的CSS */\n\n/* slider旧的CSS */\nsection.pops-panel-container .pops-panel-slider:has(> input[type=\"range\"]) {\n\toverflow: hidden;\n\theight: 25px;\n\tline-height: normal;\n\talign-content: center;\n\tdisplay: flex;\n\talign-items: center;\n}\nsection.pops-panel-container .pops-panel-slider input[type=\"range\"] {\n\theight: 6px;\n\tbackground: rgb(228, 231, 237, var(--pops-bg-opacity));\n\toutline: 0;\n\t-webkit-appearance: none;\n\tappearance: none;\n\twidth: 100%;\n}\nsection.pops-panel-container .pops-panel-slider input[type=\"range\"]::-webkit-slider-thumb {\n\twidth: 20px;\n\theight: 20px;\n\tborder-radius: 50%;\n\tborder: 1px solid rgb(64, 158, 255, var(--pops-bd-opacity));\n\tbackground-color: rgb(255, 255, 255, var(--pops-bg-opacity));\n\tbox-shadow: 0 0 2px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2);\n\tcursor: pointer;\n\t-webkit-appearance: none;\n\tappearance: none;\n\tborder-image: linear-gradient(#409eff, #409eff) 0 fill/9 25 9 0/0 0 0 100vw;\n}\nsection.pops-panel-container .pops-panel-slider input[type=\"range\"]::-moz-range-thumb {\n\twidth: 20px;\n\theight: 20px;\n\tborder-radius: 50%;\n\tborder: 1px solid rgb(64, 159, 255, var(--pops-bd-opacity));\n\tbackground-color: rgb(255, 255, 255, var(--pops-bg-opacity));\n\tbox-shadow: 0 0 2px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2);\n\tcursor: pointer;\n\t-webkit-appearance: none;\n\tappearance: none;\n}\nsection.pops-panel-container .pops-panel-slider input[type=\"range\"]::-moz-range-progress {\n\theight: 6px;\n\tborder-image: linear-gradient(#409eff, #409eff) 0 fill/9 25 9 0/0 0 0 100vw;\n}\n/* slider旧的CSS */\n\n/* slider的CSS */\n.pops-slider {\n\t--pops-slider-color-white: #ffffff;\n\t--pops-slider-color-primary: #409eff;\n\t--pops-slider-color-info: #909399;\n\t--pops-slider-text-color-placeholder: #a8abb2;\n\t--pops-slider-border-color-light: #e4e7ed;\n\t--pops-slider-border-radius-circle: 100%;\n\t--pops-slider-transition-duration-fast: 0.2s;\n\n\t--pops-slider-main-bg-color: var(--pops-slider-color-primary);\n\t--pops-slider-runway-bg-color: var(--pops-slider-border-color-light);\n\t--pops-slider-stop-bg-color: var(--pops-slider-color-white);\n\t--pops-slider-disabled-color: var(--pops-slider-text-color-placeholder);\n\t--pops-slider-border-radius: 3px;\n\t--pops-slider-height: 6px;\n\t--pops-slider-button-size: 20px;\n\t--pops-slider-button-wrapper-size: 36px;\n\t--pops-slider-button-wrapper-offset: -15px;\n}\n\n.pops-slider {\n\twidth: 100%;\n\theight: 32px;\n\tdisplay: flex;\n\talign-items: center;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-ms-user-select: none;\n\t-moz-user-select: none;\n}\n\n.pops-slider-width {\n\tflex: 0 0 52%;\n\tmargin-left: 10px;\n}\n\n.pops-slider__runway {\n\tflex: 1;\n\theight: var(--pops-slider-height);\n\tbackground-color: var(--pops-slider-runway-bg-color);\n\tborder-radius: var(--pops-slider-border-radius);\n\tposition: relative;\n\tcursor: pointer;\n}\n\n.pops-slider__runway.show-input {\n\tmargin-right: 30px;\n\twidth: auto;\n}\n\n.pops-slider__runway.pops-slider-is-disabled {\n\tcursor: default;\n}\n\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__bar {\n\tbackground-color: var(--pops-slider-disabled-color);\n}\n\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button {\n\tborder-color: var(--pops-slider-disabled-color);\n}\n\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button:hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.dragging {\n\tcursor: not-allowed;\n}\n\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button:hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.dragging {\n\ttransform: scale(1);\n}\n\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button:hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.dragging {\n\tcursor: not-allowed;\n}\n\n.pops-slider__input {\n\tflex-shrink: 0;\n\twidth: 130px;\n}\n\n.pops-slider__bar {\n\theight: var(--pops-slider-height);\n\tbackground-color: var(--pops-slider-main-bg-color);\n\tborder-top-left-radius: var(--pops-slider-border-radius);\n\tborder-bottom-left-radius: var(--pops-slider-border-radius);\n\tposition: absolute;\n}\n\n.pops-slider__button-wrapper {\n\theight: var(--pops-slider-button-wrapper-size);\n\twidth: var(--pops-slider-button-wrapper-size);\n\tposition: absolute;\n\tz-index: 1;\n\ttop: var(--pops-slider-button-wrapper-offset);\n\ttransform: translate(-50%);\n\tbackground-color: transparent;\n\ttext-align: center;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tline-height: normal;\n\toutline: none;\n}\n\n.pops-slider__button-wrapper:after {\n\tdisplay: inline-block;\n\tcontent: \"\";\n\theight: 100%;\n\tvertical-align: middle;\n}\n\n.pops-slider__button:hover,\n.pops-slider__button.hover {\n\tcursor: grab;\n}\n\n.pops-slider__button {\n\tdisplay: inline-block;\n\twidth: var(--pops-slider-button-size);\n\theight: var(--pops-slider-button-size);\n\tvertical-align: middle;\n\tborder: solid 2px var(--pops-slider-main-bg-color);\n\tbackground-color: var(--pops-slider-color-white);\n\tborder-radius: 50%;\n\tbox-sizing: border-box;\n\ttransition: var(--pops-slider-transition-duration-fast);\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n}\n\n.pops-slider__button:hover,\n.pops-slider__button.hover,\n.pops-slider__button.dragging {\n\ttransform: scale(1.2);\n}\n\n.pops-slider__button:hover,\n.pops-slider__button.hover {\n\tcursor: grab;\n}\n\n.pops-slider__button.dragging {\n\tcursor: grabbing;\n}\n\n.pops-slider__stop {\n\tposition: absolute;\n\theight: var(--pops-slider-height);\n\twidth: var(--pops-slider-height);\n\tborder-radius: var(--pops-slider-border-radius-circle);\n\tbackground-color: var(--pops-slider-stop-bg-color);\n\ttransform: translate(-50%);\n}\n\n.pops-slider__marks {\n\ttop: 0;\n\tleft: 12px;\n\twidth: 18px;\n\theight: 100%;\n}\n\n.pops-slider__marks-text {\n\tposition: absolute;\n\ttransform: translate(-50%);\n\tfont-size: 14px;\n\tcolor: var(--pops-slider-color-info);\n\tmargin-top: 15px;\n\twhite-space: pre;\n}\n\n.pops-slider.is-vertical {\n\tposition: relative;\n\tdisplay: inline-flex;\n\twidth: auto;\n\theight: 100%;\n\tflex: 0;\n}\n\n.pops-slider.is-vertical .pops-slider__runway {\n\twidth: var(--pops-slider-height);\n\theight: 100%;\n\tmargin: 0 16px;\n}\n\n.pops-slider.is-vertical .pops-slider__bar {\n\twidth: var(--pops-slider-height);\n\theight: auto;\n\tborder-radius: 0 0 3px 3px;\n}\n\n.pops-slider.is-vertical .pops-slider__button-wrapper {\n\ttop: auto;\n\tleft: var(--pops-slider-button-wrapper-offset);\n\ttransform: translateY(50%);\n}\n\n.pops-slider.is-vertical .pops-slider__stop {\n\ttransform: translateY(50%);\n}\n\n.pops-slider.is-vertical .pops-slider__marks-text {\n\tmargin-top: 0;\n\tleft: 15px;\n\ttransform: translateY(50%);\n}\n\n.pops-slider--large {\n\theight: 40px;\n}\n\n.pops-slider--small {\n\theight: 24px;\n}\n/* slider的CSS */\n\n/* input的CSS */\n.pops-panel-input {\n\t--el-disabled-text-color: #a8abb2;\n\t--el-disabled-bg-color: #f5f7fa;\n\t--el-disabled-border-color: #e4e7ed;\n\n\t--pops-panel-components-input-text-color: #000000;\n\t--pops-panel-components-input-text-bg-color: transparent;\n\t--pops-panel-components-input-text-default-padding: 8px;\n\t--pops-panel-components-input-bd-color: #dcdfe6;\n\t--pops-panel-components-input-bg-color: #ffffff;\n\t--pops-panel-components-input-hover-bd-color: #c0c4cc;\n\t--pops-panel-components-input-focus-bd-color: #409eff;\n\t--pops-panel-components-input-suffix-color: #a8abb2;\n\t--pops-panel-components-input-suffix-bg-color: #ffffff;\n}\n.pops-panel-input {\n\tdisplay: flex;\n\talign-items: center;\n\tborder: 1px solid var(--pops-panel-components-input-bd-color);\n\tborder-radius: 4px;\n\tbackground-color: var(--pops-panel-components-input-bg-color);\n\tposition: relative;\n\tbox-shadow: none;\n}\n.pops-panel-input:hover {\n\tborder: 1px solid var(--pops-panel-components-input-hover-bd-color);\n}\n.pops-panel-input:has(input:disabled):hover {\n\t--pops-panel-components-input-hover-bd-color: var(--pops-panel-components-input-bd-color);\n}\n.pops-panel-input:has(input:focus) {\n\toutline: 0;\n\tborder: 1px solid var(--pops-panel-components-input-focus-bd-color);\n\tborder-radius: 4px;\n\tbox-shadow: none;\n}\n.pops-panel-input input {\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\ttext-align: start;\n\talign-items: center;\n\talign-content: center;\n\twhite-space: nowrap;\n\tcursor: text;\n\tbox-sizing: border-box;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tvertical-align: middle;\n\t-webkit-appearance: none;\n\tappearance: none;\n\tcolor: var(--pops-panel-components-input-text-color);\n\tbackground-color: var(--pops-panel-components-input-text-bg-color);\n\toutline: 0;\n\ttransition: 0.1s;\n\tborder: 0;\n\tfont-size: 14px;\n\tfont-weight: 500;\n\tline-height: normal;\n\theight: 32px;\n\twidth: 100%;\n\tflex: 1;\n\t/*margin-right: calc(1em + 8px);*/\n\tmargin: 0px;\n\tpadding: var(--pops-panel-components-input-text-default-padding);\n}\n.pops-panel-input span.pops-panel-input__suffix {\n\tdisplay: inline-flex;\n\twhite-space: nowrap;\n\tflex-shrink: 0;\n\tflex-wrap: nowrap;\n\theight: 100%;\n\ttext-align: center;\n\tcolor: var(--pops-panel-components-input-suffix-color);\n\tbackground: var(--pops-panel-components-input-suffix-bg-color);\n\ttransition: all 0.3s;\n\tpointer-events: none;\n\tpadding: 0 8px;\n\tposition: absolute;\n\tright: 0px;\n\tborder-top-right-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tborder: 1px solid transparent;\n}\n.pops-panel-input span.pops-panel-input__suffix-inner {\n\tpointer-events: all;\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n}\n/* 如果包含清空图标的按钮,则默认隐藏清空图标,当:hover、:focus、:focus-within、:active时显示清空图标 */\n.pops-panel-input span.pops-panel-input__suffix:has(svg[data-type=\"circleClose\"]) {\n\tdisplay: none;\n}\n.pops-panel-input:hover span.pops-panel-input__suffix:has(svg[data-type=\"circleClose\"]),\n.pops-panel-input:focus span.pops-panel-input__suffix:has(svg[data-type=\"circleClose\"]),\n.pops-panel-input:focus-within span.pops-panel-input__suffix:has(svg[data-type=\"circleClose\"]),\n.pops-panel-input:active span.pops-panel-input__suffix:has(svg[data-type=\"circleClose\"]) {\n\tdisplay: inline-flex;\n}\n.pops-panel-input .pops-panel-icon {\n\tcursor: pointer;\n}\n.pops-panel-input .pops-panel-icon {\n\theight: inherit;\n\tline-height: normal;\n\talign-content: center;\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\ttransition: all 0.3s;\n}\n.pops-panel-input .pops-panel-icon svg {\n\theight: 1em;\n\twidth: 1em;\n}\n\n.pops-input-disabled {\n\tbackground-color: var(--pops-components-is-disabled-bg-color);\n}\n.pops-panel-input.pops-input-disabled:hover {\n\t--pops-panel-components-input-hover-bd-color: var(--pops-panel-components-input-bd-color);\n}\n.pops-panel-input input:disabled,\n.pops-panel-input input:disabled + .pops-panel-input__suffix {\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tcolor: var(--el-disabled-text-color);\n\t-webkit-text-fill-color: var(--el-disabled-text-color);\n\tcursor: not-allowed;\n}\n.pops-panel-input input:disabled + .pops-panel-input__suffix {\n\tdisplay: none;\n}\n/* input的CSS */\n\n/* textarea的CSS */\n.pops-panel-textarea {\n\t--pops-panel-components-textarea-text-color: #000000;\n\t--pops-panel-components-textarea-text-bg-color: #ffffff;\n\t--pops-panel-components-textarea-bd-color: #dcdfe6;\n\t--pops-panel-components-textarea-hover-bd-color: #c0c4cc;\n\t--pops-panel-components-textarea-focus-bd-color: #409eff;\n}\n.pops-panel-textarea textarea {\n\twidth: 100%;\n\t/*vertical-align: bottom;*/\n\tposition: relative;\n\tdisplay: block;\n\tresize: none;\n\tpadding: 5px 11px;\n\t/*line-height: 1;*/\n\tbox-sizing: border-box;\n\tfont-size: inherit;\n\tfont-family: inherit;\n\tcolor: var(--pops-panel-components-textarea-text-color);\n\tbackground-color: var(--pops-panel-components-textarea-text-bg-color);\n\tbackground-image: none;\n\t-webkit-appearance: none;\n\tappearance: none;\n\tbox-shadow: none;\n\tborder-radius: 0;\n\ttransition: box-shadow 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n\tborder: 1px solid var(--pops-panel-components-textarea-bd-color);\n}\n.pops-panel-textarea textarea:hover {\n\tborder-color: var(--pops-panel-components-textarea-hover-bd-color);\n}\n.pops-panel-textarea:has(textarea:disabled):hover {\n\t--pops-panel-components-textarea-hover-bd-color: var(--pops-panel-components-textarea-bd-color);\n}\n.pops-panel-textarea-disable {\n\t--pops-panel-components-textarea-text-bg-color: var(--pops-components-is-disabled-bg-color) !important;\n\t--pops-panel-components-textarea-text-color: var(--pops-components-is-disabled-text-color);\n}\n.pops-panel-textarea-disable textarea {\n\tcursor: not-allowed;\n}\n.pops-panel-textarea textarea:focus {\n\toutline: 0;\n\tborder-color: var(--pops-panel-components-textarea-focus-bd-color);\n}\n/* textarea的CSS */\n\n/* select的CSS */\n.pops-panel-select {\n\t--pops-panel-components-select-text-color: #000000;\n\t--pops-panel-components-select-bd-color: rgb(184, 184, 184, var(--pops-bd-opacity));\n\t--pops-panel-components-select-hover-bd-color: rgb(184, 184, 184, var(--pops-bd-opacity));\n\t--pops-panel-components-select-bg-color: rgb(255, 255, 255, var(--pops-bg-opacity));\n}\n.pops-panel-select {\n\tborder: 0;\n}\n.pops-panel-select select {\n\theight: 32px;\n\tline-height: normal;\n\talign-content: center;\n\tmin-width: 200px;\n\tborder: 1px solid var(--pops-panel-components-select-bd-color);\n\tborder-radius: 5px;\n\ttext-align: center;\n\toutline: 0;\n\tcolor: var(--pops-panel-components-select-text-color);\n\tbackground-color: var(--pops-panel-components-select-bg-color);\n\tbox-shadow: none;\n}\n.pops-panel-select select:hover {\n\tborder: 1px solid var(--pops-panel-components-select-hover-bd-color);\n}\n.pops-panel-select-disable {\n\t--pops-panel-components-select-text-color: var(--pops-components-is-disabled-text-color);\n\t--pops-panel-components-select-bg-color: var(--pops-components-is-disabled-bg-color);\n}\n.pops-panel-select-disable select {\n\tcursor: not-allowed;\n}\n.pops-panel-select-disable select:hover {\n\tbox-shadow: none;\n\t--pops-panel-components-select-hover-bd-color: var(--pops-panel-components-select-bd-color);\n}\n.pops-panel-select select:focus {\n\tborder: 1px solid rgb(64, 158, 255, var(--pops-bd-opacity));\n\tbox-shadow: none;\n}\n/* select的CSS */\n\n/* select-multiple的CSS*/\n.pops-panel-select-multiple {\n\t--el-border-radius-base: 4px;\n\t--el-fill-color-blank: #ffffff;\n\t--el-transition-duration: 0.3s;\n\t--el-border-color: #cbcbcb;\n\t--el-text-color-placeholder: #a8abb2;\n\t--color: inherit;\n\t--el-select-input-color: #a8abb2;\n\t--el-select-input-font-size: 14px;\n\t--el-text-color-regular: #606266;\n\t--el-color-info: #909399;\n\t--el-color-info-light-9: #f4f4f5;\n\t--el-color-info-light-8: #e9e9eb;\n\t--el-color-primary-light-9: #ecf5ff;\n\t--el-color-primary-light-8: #d9ecff;\n\t--el-color-primary: #409eff;\n\t--el-color-white: #ffffff;\n\twidth: 200px;\n}\n.pops-panel-select-multiple .el-select__wrapper {\n\tdisplay: flex;\n\talign-items: center;\n\tposition: relative;\n\tbox-sizing: border-box;\n\tcursor: pointer;\n\ttext-align: left;\n\tfont-size: 14px;\n\tpadding: 4px 12px;\n\tgap: 6px;\n\tmin-height: 32px;\n\tline-height: normal;\n\talign-content: center;\n\tborder-radius: var(--el-border-radius-base);\n\tbackground-color: var(--el-fill-color-blank);\n\ttransition: var(--el-transition-duration);\n\ttransform: translateZ(0);\n\tborder: 1px solid var(--el-border-color);\n}\n.pops-panel-select-multiple .el-select__wrapper.is-focused {\n\t--el-border-color: var(--el-color-primary);\n}\n.pops-panel-select-multiple .el-select__selection {\n\tposition: relative;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\talign-items: center;\n\tflex: 1;\n\tmin-width: 0;\n\tgap: 6px;\n}\n.pops-panel-select-multiple .el-select__selected-item {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\t-webkit-user-select: none;\n\tuser-select: none;\n}\n.pops-panel-select-multiple .el-select__selected-item.el-select__choose_tag .el-tag {\n\tmax-width: 200px;\n}\n.pops-panel-select-multiple .el-select__input-wrapper {\n\tmax-width: 100%;\n}\n.pops-panel-select-multiple .el-select__selection.is-near {\n\tmargin-left: -8px;\n}\n.pops-panel-select-multiple .el-select__placeholder {\n\tposition: absolute;\n\tdisplay: block;\n\ttop: 50%;\n\ttransform: translateY(-50%);\n\twidth: 100%;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n\tcolor: var(--el-input-text-color, var(--el-text-color-regular));\n}\n.pops-panel-select-multiple .el-select__placeholder.is-transparent {\n\t-webkit-user-select: none;\n\tuser-select: none;\n\tcolor: var(--el-text-color-placeholder);\n}\n.pops-panel-select-multiple .el-select__prefix,\n.pops-panel-select-multiple .el-select__suffix {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-shrink: 0;\n\tgap: 6px;\n\tcolor: var(--el-input-icon-color, var(--el-text-color-placeholder));\n}\n.pops-panel-select-multiple .el-icon {\n\t--color: inherit;\n\theight: 1em;\n\twidth: 1em;\n\tline-height: normal;\n\talign-content: center;\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\talign-items: center;\n\tposition: relative;\n\tfill: currentColor;\n\tcolor: var(--color);\n\tfont-size: inherit;\n}\n.pops-panel-select-multiple .el-icon svg {\n\theight: 1em;\n\twidth: 1em;\n}\n.pops-panel-select-multiple .el-select__caret {\n\tcolor: var(--el-select-input-color);\n\tfont-size: var(--el-select-input-font-size);\n\ttransition: var(--el-transition-duration);\n\ttransform: rotate(0);\n\tcursor: pointer;\n}\n.pops-panel-select-multiple .el-tag {\n\t--el-tag-font-size: 12px;\n\t--el-tag-border-radius: 4px;\n\t--el-tag-border-radius-rounded: 9999px;\n}\n.pops-panel-select-multiple .el-tag {\n\tbackground-color: var(--el-tag-bg-color);\n\tborder-color: var(--el-tag-border-color);\n\tcolor: var(--el-tag-text-color);\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\talign-items: center;\n\tvertical-align: middle;\n\theight: 24px;\n\tpadding: 0 9px;\n\tfont-size: var(--el-tag-font-size);\n\tline-height: normal;\n\talign-content: center;\n\tborder-width: 1px;\n\tborder-style: solid;\n\tborder-radius: var(--el-tag-border-radius);\n\tbox-sizing: border-box;\n\twhite-space: nowrap;\n\t--el-icon-size: 14px;\n\t--el-tag-bg-color: var(--el-color-primary-light-9);\n\t--el-tag-border-color: var(--el-color-primary-light-8);\n\t--el-tag-hover-color: var(--el-color-primary);\n}\n.pops-panel-select-multiple .el-select__selection .el-tag {\n\tcursor: pointer;\n\tborder-color: transparent;\n}\n.pops-panel-select-multiple .el-tag.el-tag--info {\n\t--el-tag-bg-color: var(--el-color-info-light-9);\n\t--el-tag-border-color: var(--el-color-info-light-8);\n\t--el-tag-hover-color: var(--el-color-info);\n}\n.pops-panel-select-multiple .el-tag.el-tag--info {\n\t--el-tag-text-color: var(--el-color-info);\n}\n.pops-panel-select-multiple .el-tag.is-closable {\n\tpadding-right: 5px;\n}\n.pops-panel-select-multiple .el-select__selection .el-tag .el-tag__content {\n\tmin-width: 0;\n}\n.pops-panel-select-multiple .el-tag .el-tag__close {\n\tflex-shrink: 0;\n\tcolor: var(--el-tag-text-color);\n}\n.pops-panel-select-multiple .el-tag .el-tag__close:hover {\n\tcolor: var(--el-color-white);\n\tbackground-color: var(--el-tag-hover-color);\n}\n.pops-panel-select-multiple .el-tag .el-icon {\n\tborder-radius: 50%;\n\tcursor: pointer;\n\tfont-size: calc(var(--el-icon-size) - 2px);\n\theight: var(--el-icon-size);\n\twidth: var(--el-icon-size);\n}\n.pops-panel-select-multiple .el-tag .el-tag__close {\n\tmargin-left: 6px;\n}\n.pops-panel-select-multiple .el-select__tags-text {\n\tdisplay: block;\n\tline-height: normal;\n\talign-content: center;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n.pops-panel-select-multiple-disable {\n\t--el-fill-color-blank: #f5f7fa;\n\t--color: #a8abb2;\n\t--el-border-color: #cbcbcb;\n}\n.pops-panel-select-multiple-disable .el-tag.el-tag--info {\n\t--el-tag-bg-color: #e7e7e7;\n\t--el-tag-text-color: var(--pops-components-is-disabled-text-color);\n}\n.pops-panel-select-multiple-disable .el-select__selection .el-tag,\n.pops-panel-select-multiple-disable .el-tag .el-tag__close:hover,\n.pops-panel-select-multiple-disable .el-select__wrapper,\n.pops-panel-select-multiple-disable .el-select__caret {\n\tcursor: not-allowed;\n}\n/* select-multiple的CSS*/\n\n/* deepMenu的css */\n.pops-panel-deepMenu-nav-item {\n\tcursor: pointer;\n}\n.pops-panel-deepMenu-nav-item:active {\n\tbackground: var(--pops-panel-forms-container-deepMenu-item-active-bg);\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n}\nsection.pops-panel-container .pops-panel-forms-container-item ul li.pops-panel-deepMenu-nav-item:active {\n\tpadding: var(--pops-panel-forms-container-li-padding-top-bottom)\n\t\tvar(--pops-panel-forms-container-li-padding-left-right);\n\tmargin: 0px;\n}\n/* 去除上个兄弟item的底部边框颜色 */\nsection.pops-panel-container\n\t.pops-panel-forms-container-item\n\tul\n\tli:has(+ .pops-panel-deepMenu-nav-item:active) {\n\tborder-bottom: 1px solid transparent;\n}\n/* 第一个和最后一个跟随圆角 */\nsection.pops-panel-container\n\t.pops-panel-forms-container-item\n\tul\n\tli.pops-panel-deepMenu-nav-item:first-child:active {\n\tborder-top-left-radius: var(--pops-panel-forms-container-item-border-radius);\n\tborder-top-right-radius: var(--pops-panel-forms-container-item-border-radius);\n}\nsection.pops-panel-container\n\t.pops-panel-forms-container-item\n\tul\n\tli.pops-panel-deepMenu-nav-item:last-child:active {\n\tborder-bottom-left-radius: var(--pops-panel-forms-container-item-border-radius);\n\tborder-bottom-right-radius: var(--pops-panel-forms-container-item-border-radius);\n}\n.pops-panel-deepMenu-nav-item .pops-panel-deepMenu {\n\tdisplay: flex;\n\talign-items: center;\n\tcolor: #6c6c6c;\n\tfill: #6c6c6c;\n}\n.pops-panel-deepMenu-nav-item .pops-panel-deepMenu-arrowRight-icon {\n\twidth: 15px;\n\theight: 15px;\n\tdisplay: flex;\n\talign-items: center;\n}\nsection.pops-panel-deepMenu-container\n\t.pops-panel-container-header-ul\n\tli.pops-panel-deepMenu-container-header {\n\tdisplay: flex;\n\talign-items: center;\n\twidth: -webkit-fill-available;\n\twidth: -moz-available;\n\tpadding: var(--pops-panel-forms-header-padding-top-bottom)\n\t\tcalc(\n\t\t\tvar(--pops-panel-forms-margin-left-right) + var(--pops-panel-forms-container-li-padding-left-right) -\n\t\t\t\tvar(--pops-panel-forms-header-icon-size)\n\t\t);\n\tgap: 0px;\n}\n.pops-panel-deepMenu-container .pops-panel-deepMenu-container-left-arrow-icon {\n\twidth: var(--pops-panel-forms-header-icon-size);\n\theight: var(--pops-panel-forms-header-icon-size);\n\tdisplay: flex;\n\talign-items: center;\n\tcursor: pointer;\n}\n/* 修复safari上图标大小未正常显示 */\n.pops-panel-deepMenu-container .pops-panel-deepMenu-container-left-arrow-icon > svg {\n\twidth: inherit;\n\theight: inherit;\n}\n/* deepMenu的css */\n\n/* 文字对齐 */\n.pops-panel-item-left-desc-text:has(code) {\n\tdisplay: flex;\n\talign-items: baseline;\n\tflex-wrap: wrap;\n}\n\n@media (prefers-color-scheme: dark) {\n\t.pops[type-value=\"panel\"] {\n\t\t--pops-bg-color: #000000;\n\t\t--pops-color: #f2f2f2;\n\t\t--panel-title-bg-color: #000000;\n\t\t--panel-aside-bg-color: #262626;\n\t\t--pops-panel-forms-container-item-left-desc-text-color: #6c6c6c;\n\t\t--pops-panel-forms-container-item-bg-color: #262626;\n\t\t--pops-panel-forms-container-item-title-color: #c1c1c1;\n\n\t\t--pops-panel-forms-container-li-border-color: rgb(51, 51, 51, var(--pops-bd-opacity));\n\t\t--pops-panel-forms-container-deepMenu-item-active-bg: #333333;\n\t}\n\t.pops[type-value=\"panel\"] .pops-panel-deepMenu-container .pops-panel-deepMenu-container-left-arrow-icon {\n\t\tfill: #f2f2f2;\n\t}\n\n\t/* switch的CSS */\n\t.pops-panel-switch {\n\t\t--panel-switch-core-bd-color: rgb(220, 223, 230, var(--pops-bd-opacity));\n\t\t--panel-switch-core-bg-color: rgb(220, 223, 230, var(--pops-bg-opacity));\n\t\t--panel-switch-circle-color: #dcdfe6;\n\t\t--panel-switch-circle-bg-color: rgb(255, 255, 255, var(--pops-bg-opacity));\n\t\t--panel-switch-checked-circle-color: #409eff;\n\t\t--panel-switch-checked-core-bd-color: rgb(64, 158, 255, var(--pops-bd-opacity));\n\t\t--panel-switch-checked-core-bg-color: rgb(64, 158, 255, var(--pops-bg-opacity));\n\t}\n\t/* select的CSS */\n\t.pops-panel-select {\n\t\t--pops-panel-components-select-text-color: #f2f2f2;\n\t\t--pops-panel-components-select-bd-color: rgb(51, 51, 51, var(--pops-bd-opacity));\n\t\t--pops-panel-components-select-bg-color: #141414;\n\t}\n\t/* select-multiple的CSS*/\n\t.pops-panel-select-multiple {\n\t\t--el-fill-color-blank: #141414;\n\t\t--el-border-color: #4c4d4f;\n\t\t--el-text-color-placeholder: #a8abb2;\n\t\t--el-select-input-color: #a8abb2;\n\t\t--el-text-color-regular: #606266;\n\t\t--el-color-info: #909399;\n\t\t--el-color-info-light-8: #e9e9eb;\n\t\t--el-color-primary-light-9: #ecf5ff;\n\t\t--el-color-primary-light-8: #d9ecff;\n\t\t--el-color-primary: #409eff;\n\t\t--el-color-white: #ffffff;\n\t}\n\t.pops-panel-select-multiple .el-tag {\n\t\t--el-color-info-light-9: #202121;\n\t}\n\t.pops-panel-select-multiple-disable {\n\t\t--el-border-color: rgb(51, 51, 51, var(--pops-bd-opacity));\n\t}\n\t.pops-panel-select-multiple-disable .el-tag.el-tag--info {\n\t\t--el-tag-bg-color: #2f2f2f;\n\t}\n\t/* select-multiple的CSS*/\n\t/* slider的CSS */\n\t.pops-slider {\n\t\t--pops-slider-border-color-light: #414243;\n\t}\n\t/* input的CSS */\n\t.pops-panel-input {\n\t\t--pops-panel-components-input-text-color: #f2f2f2;\n\t\t--pops-panel-components-input-bd-color: #4f5052;\n\t\t--pops-panel-components-input-bg-color: #141414;\n\t\t--pops-panel-components-input-hover-bd-color: #6f7175;\n\t\t--pops-panel-components-input-focus-bd-color: #409eff;\n\t\t--pops-panel-components-input-suffix-color: #a8abb2;\n\t}\n\t/* textarea的CSS */\n\t.pops-panel-textarea {\n\t\t--pops-panel-components-textarea-text-color: #f2f2f2;\n\t\t--pops-panel-components-textarea-text-bg-color: #141414;\n\t\t--pops-panel-components-textarea-bd-color: #4f5052;\n\t\t--pops-panel-components-textarea-hover-bd-color: #6f7175;\n\t\t--pops-panel-components-textarea-focus-bd-color: #409eff;\n\t}\n\t.pops-panel-textarea-disable {\n\t\t--pops-panel-components-textarea-text-color: var(--pops-components-is-disabled-text-color);\n\t\t--pops-panel-components-textarea-text-bg-color: var(--pops-components-is-disabled-bg-color);\n\t}\n\t/* slider */\n\t.pops-slider {\n\t\t--pops-slider-text-color-placeholder: #8d9095;\n\t}\n}\n";
2781
+ var panelCSS = ".pops[type-value=\"panel\"] {\n\t--pops-bg-color: #f2f2f2;\n\t--pops-color: #333333;\n\t--panel-title-bg-color: #ffffff;\n\n\t--panel-aside-bg-color: #ffffff;\n\t--panel-aside-hover-color: rgb(64, 158, 255);\n\t--panel-aside-hover-bg-color: rgba(64, 158, 255, 0.1);\n\n\t--pops-panel-forms-margin-top-bottom: 10px;\n\t--pops-panel-forms-margin-left-right: 20px;\n\t--pops-panel-forms-header-icon-size: calc(var(--pops-panel-forms-container-li-padding-left-right) + 1px);\n\t--pops-panel-forms-header-padding-top-bottom: 15px;\n\t--pops-panel-forms-header-padding-left-right: 10px;\n\t--pops-panel-forms-container-item-left-text-gap: 6px;\n\t--pops-panel-forms-container-item-left-desc-text-size: 0.8em;\n\t--pops-panel-forms-container-item-left-desc-text-color: #6c6c6c;\n\t--pops-panel-forms-container-item-bg-color: #ffffff;\n\t--pops-panel-forms-container-item-title-color: #333;\n\t--pops-panel-forms-container-item-border-radius: 6px;\n\t--pops-panel-forms-container-item-margin-top-bottom: 10px;\n\t--pops-panel-forms-container-item-margin-left-right: var(--pops-panel-forms-margin-left-right);\n\t--pops-panel-forms-container-li-border-color: var(--pops-bd-color);\n\t--pops-panel-forms-container-li-padding-top-bottom: 12px;\n\t--pops-panel-forms-container-li-padding-left-right: 16px;\n\n\t--pops-panel-forms-container-deepMenu-item-active-bg: #e9e9e9;\n}\n.pops[type-value=\"panel\"] {\n\tcolor: var(--pops-color);\n\tbackground: var(--pops-bg-color);\n}\n.pops[type-value] .pops-panel-title {\n\tbackground: var(--panel-title-bg-color);\n}\n\n/* ↓panel的CSS↓ */\naside.pops-panel-aside {\n\tbox-sizing: border-box;\n\tflex-shrink: 0;\n\tmax-width: 200px;\n\tmin-width: 100px;\n\theight: 100%;\n\tbackground: var(--panel-aside-bg-color);\n\tborder-right: 1px solid var(--panel-aside-bg-color);\n\tfont-size: 0.9em;\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n}\naside.pops-panel-aside {\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n}\naside.pops-panel-aside .pops-panel-aside-top-container {\n\toverflow: auto;\n}\n.pops-panel-content {\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex: 1;\n\toverflow: auto;\n\tflex-basis: auto;\n\tbox-sizing: border-box;\n\tmin-width: 0;\n\tbottom: 0 !important;\n}\nsection.pops-panel-container {\n\twidth: 100%;\n\toverflow: hidden;\n\tdisplay: flex;\n\tflex-direction: column;\n}\nsection.pops-panel-container .pops-panel-container-header-ul,\nsection.pops-panel-container .pops-panel-deepMenu-container-header-ul {\n\tborder-bottom: 1px solid rgba(223, 223, 223, var(--pops-bg-opacity));\n\tflex: 0 auto;\n}\nsection.pops-panel-container .pops-panel-container-header-ul li,\nsection.pops-panel-container .pops-panel-container-header-ul li.pops-panel-container-header-title-text {\n\tdisplay: flex;\n\tjustify-content: flex-start !important;\n\tmargin: 0px !important;\n\tpadding: var(--pops-panel-forms-header-padding-top-bottom)\n\t\tcalc(var(--pops-panel-forms-margin-left-right) + var(--pops-panel-forms-container-li-padding-left-right));\n\ttext-align: left;\n}\nsection.pops-panel-container ul.pops-panel-container-main-ul {\n\toverflow: auto;\n\t/*flex: 1;*/\n}\naside.pops-panel-aside ul li {\n\tmargin: 6px 8px;\n\tborder-radius: 4px;\n\tpadding: 6px 10px;\n\tcursor: default;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: flex-start;\n}\naside.pops-panel-aside .pops-is-visited,\naside.pops-panel-aside ul li:not(.pops-panel-disabled-aside-hover-css):hover {\n\tcolor: var(--panel-aside-hover-color);\n\tbackground: var(--panel-aside-hover-bg-color);\n}\nsection.pops-panel-container > ul li:not(.pops-panel-forms-container-item) {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tmargin: var(--pops-panel-forms-margin-top-bottom)\n\t\tcalc(var(--pops-panel-forms-margin-left-right) + var(--pops-panel-forms-margin-left-right));\n\tgap: 10px;\n}\nsection.pops-panel-container .pops-panel-forms-container-item-header-text {\n\tmargin: 10px;\n\tmargin-left: calc(\n\t\tvar(--pops-panel-forms-margin-left-right) + var(--pops-panel-forms-container-li-padding-left-right)\n\t);\n\tfont-size: 0.9em;\n\ttext-align: left;\n\tcolor: var(--pops-panel-forms-container-item-title-color);\n}\nsection.pops-panel-container li.pops-panel-forms-container-item {\n\t/* 去除<li>左侧的圆点 */\n\tdisplay: block;\n}\nsection.pops-panel-container .pops-panel-forms-container-item ul.pops-panel-forms-container-item-formlist {\n\tborder-radius: var(--pops-panel-forms-container-item-border-radius);\n\tbackground: var(--pops-panel-forms-container-item-bg-color);\n\tmargin: var(--pops-panel-forms-container-item-margin-top-bottom) var(--pops-panel-forms-margin-left-right);\n}\nsection.pops-panel-container .pops-panel-forms-container-item ul.pops-panel-forms-container-item-formlist li {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tpadding: var(--pops-panel-forms-container-li-padding-top-bottom)\n\t\tvar(--pops-panel-forms-container-li-padding-left-right);\n\tmargin: 0px 0px;\n\tborder-bottom: 1px solid var(--pops-panel-forms-container-li-border-color);\n\ttext-align: left;\n}\n/*section.pops-panel-container\n\t.pops-panel-forms-container-item\n\tul\n\tli.pops-panel-deepMenu-nav-item {\n\tpadding: var(--pops-panel-forms-container-li-padding-top-bottom) 0px;\n\tmargin: 0px var(--pops-panel-forms-container-li-padding-left-right);\n\tborder-bottom: 1px solid var(--pops-panel-forms-container-li-border-color);\n}*/\nsection.pops-panel-container\n\t.pops-panel-forms-container-item\n\tul.pops-panel-forms-container-item-formlist\n\tli:last-child {\n\tborder: 0px;\n}\n/* 左侧的文字 */\nsection.pops-panel-container .pops-panel-item-left-text {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--pops-panel-forms-container-item-left-text-gap);\n}\n\n/* 左侧的主文字 */\n/*section.pops-panel-container .pops-panel-item-left-main-text {\n\t\n}*/\n/* 左侧的描述文字 */\nsection.pops-panel-container .pops-panel-item-left-desc-text {\n\tfont-size: var(--pops-panel-forms-container-item-left-desc-text-size);\n\tcolor: var(--pops-panel-forms-container-item-left-desc-text-color);\n}\n\n/* 折叠面板 */\nsection.pops-panel-container .pops-panel-forms-fold {\n\tborder-radius: var(--pops-panel-forms-container-item-border-radius);\n\tbackground: var(--pops-panel-forms-container-item-bg-color);\n\tmargin: var(--pops-panel-forms-margin-top-bottom) var(--pops-panel-forms-margin-left-right);\n}\nsection.pops-panel-container .pops-panel-forms-fold .pops-panel-forms-fold-container {\n\tdisplay: flex;\n\talign-items: center;\n\tfill: #6c6c6c;\n\tjustify-content: space-between;\n\tmargin: 0px var(--pops-panel-forms-container-li-padding-left-right) !important;\n\tpadding: var(--pops-panel-forms-container-li-padding-top-bottom) 0px !important;\n}\nsection.pops-panel-container .pops-panel-forms-fold[data-fold-enable] .pops-panel-forms-fold-container-icon {\n\ttransform: rotate(90deg);\n}\nsection.pops-panel-container .pops-panel-forms-fold .pops-panel-forms-fold-container-icon {\n\twidth: 15px;\n\theight: 15px;\n\tdisplay: flex;\n\talign-items: center;\n\ttransform: rotate(-90deg);\n\ttransition: transform 0.3s;\n}\n/* 折叠状态 */\nsection.pops-panel-container\n\t.pops-panel-forms-fold[data-fold-enable]\n\t.pops-panel-forms-container-item-formlist {\n\theight: 0;\n}\n/* 非折叠状态 */\nsection.pops-panel-container .pops-panel-forms-fold ul.pops-panel-forms-container-item-formlist {\n\tmargin: 0;\n}\nsection.pops-panel-container .pops-panel-forms-fold .pops-panel-forms-container-item-formlist {\n\ttransition: height 0.3s;\n\toverflow: hidden;\n\tborder-radius: unset;\n\tbackground: unset;\n\tmargin: 0;\n\theight: calc-size(auto, size);\n}\n/* 折叠面板 */\n\n/* 姑且认为小于600px的屏幕为移动端 */\n@media (max-width: 600px) {\n\t/* 兼容移动端CSS */\n\t.pops[type-value=\"panel\"] {\n\t\t--pops-panel-forms-margin-left-right: 10px;\n\t}\n\t.pops[type-value=\"panel\"] {\n\t\twidth: 92%;\n\t\twidth: 92vw;\n\t\twidth: 92dvw;\n\t}\n\t.pops[type-value=\"panel\"] .pops-panel-content aside.pops-panel-aside {\n\t\tmax-width: 20%;\n\t\tmin-width: auto;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container .pops-panel-forms-container-item > div {\n\t\ttext-align: left;\n\t\t--pops-panel-forms-margin-left-right: 0px;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container .pops-panel-forms-container-item ul {\n\t\tmargin: 0px !important;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container > ul > li {\n\t\tmargin: 10px 10px;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container > ul > li div:nth-child(2) {\n\t\tmax-width: 55%;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container .pops-panel-select select {\n\t\tmin-width: 88px !important;\n\t\twidth: -webkit-fill-available;\n\t\twidth: -moz-available;\n\t}\n\t.pops[type-value=\"panel\"] section.pops-panel-container .pops-panel-container-header-ul li {\n\t\tfont-size: 16px;\n\t}\n\t.pops[type-value=\"panel\"] .pops-panel-title p[pops],\n\t.pops[type-value=\"panel\"] section.pops-panel-container > ul li,\n\t.pops[type-value=\"panel\"] aside.pops-panel-aside ul li {\n\t\tfont-size: 14px;\n\t}\n}\n/* switch的CSS */\n.pops-panel-switch {\n\t--panel-switch-core-bd-color: rgb(220, 223, 230, var(--pops-bd-opacity));\n\t--panel-switch-core-bg-color: rgb(220, 223, 230, var(--pops-bg-opacity));\n\t--panel-switch-circle-color: #dcdfe6;\n\t--panel-switch-circle-bg-color: rgb(255, 255, 255, var(--pops-bg-opacity));\n\t--panel-switch-checked-circle-color: #409eff;\n\t--panel-switch-checked-core-bd-color: rgb(64, 158, 255, var(--pops-bd-opacity));\n\t--panel-switch-checked-core-bg-color: rgb(64, 158, 255, var(--pops-bg-opacity));\n}\n.pops-panel-switch {\n\tdisplay: inline-flex;\n\tflex-direction: row-reverse;\n\talign-items: center;\n\tposition: relative;\n\tfont-size: 14px;\n\tline-height: normal;\n\talign-content: center;\n\theight: 32px;\n\tvertical-align: middle;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-ms-user-select: none;\n\t-moz-user-select: none;\n}\n.pops-panel-switch input.pops-panel-switch__input {\n\tposition: absolute;\n\twidth: 0;\n\theight: 0;\n\topacity: 0;\n\tmargin: 0;\n}\n.pops-panel-switch:has(input.pops-panel-switch__input:disabled),\n.pops-panel-switch[data-disabled],\n.pops-panel-switch[data-disabled] .pops-panel-switch__core,\n.pops-panel-switch input.pops-panel-switch__input:disabled + .pops-panel-switch__core {\n\tcursor: not-allowed;\n\topacity: 0.6;\n}\n.pops-panel-switch span.pops-panel-switch__core {\n\tdisplay: inline-flex;\n\tposition: relative;\n\talign-items: center;\n\tmin-width: 40px;\n\theight: 20px;\n\tborder: 1px solid var(--panel-switch-core-bd-color);\n\toutline: 0;\n\tborder-radius: 10px;\n\tbox-sizing: border-box;\n\tbackground: var(--panel-switch-core-bg-color);\n\tcursor: pointer;\n\ttransition:\n\t\tborder-color 0.3s,\n\t\tbackground-color 0.3s;\n}\n.pops-panel-switch .pops-panel-switch__action {\n\tposition: absolute;\n\tleft: 1px;\n\tborder-radius: 100%;\n\ttransition: all 0.3s;\n\twidth: 16px;\n\theight: 16px;\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbackground-color: var(--panel-switch-circle-bg-color);\n\tcolor: var(--panel-switch-circle-color);\n}\n.pops-panel-switch.pops-panel-switch-is-checked span.pops-panel-switch__core {\n\tborder-color: var(--panel-switch-checked-core-bd-color);\n\tbackground-color: var(--panel-switch-checked-core-bg-color);\n}\n.pops-panel-switch.pops-panel-switch-is-checked .pops-panel-switch__action {\n\tleft: calc(100% - 17px);\n\tcolor: var(--panel-switch-checked-circle-color);\n}\n/* switch的CSS */\n\n/* slider旧的CSS */\nsection.pops-panel-container .pops-panel-slider:has(> input[type=\"range\"]) {\n\toverflow: hidden;\n\theight: 25px;\n\tline-height: normal;\n\talign-content: center;\n\tdisplay: flex;\n\talign-items: center;\n}\nsection.pops-panel-container .pops-panel-slider input[type=\"range\"] {\n\theight: 6px;\n\tbackground: rgb(228, 231, 237, var(--pops-bg-opacity));\n\toutline: 0;\n\t-webkit-appearance: none;\n\tappearance: none;\n\twidth: 100%;\n}\nsection.pops-panel-container .pops-panel-slider input[type=\"range\"]::-webkit-slider-thumb {\n\twidth: 20px;\n\theight: 20px;\n\tborder-radius: 50%;\n\tborder: 1px solid rgb(64, 158, 255, var(--pops-bd-opacity));\n\tbackground-color: rgb(255, 255, 255, var(--pops-bg-opacity));\n\tbox-shadow:\n\t\t0 0 2px rgba(0, 0, 0, 0.3),\n\t\t0 3px 5px rgba(0, 0, 0, 0.2);\n\tcursor: pointer;\n\t-webkit-appearance: none;\n\tappearance: none;\n\tborder-image: linear-gradient(#409eff, #409eff) 0 fill/9 25 9 0/0 0 0 100vw;\n}\nsection.pops-panel-container .pops-panel-slider input[type=\"range\"]::-moz-range-thumb {\n\twidth: 20px;\n\theight: 20px;\n\tborder-radius: 50%;\n\tborder: 1px solid rgb(64, 159, 255, var(--pops-bd-opacity));\n\tbackground-color: rgb(255, 255, 255, var(--pops-bg-opacity));\n\tbox-shadow:\n\t\t0 0 2px rgba(0, 0, 0, 0.3),\n\t\t0 3px 5px rgba(0, 0, 0, 0.2);\n\tcursor: pointer;\n\t-webkit-appearance: none;\n\tappearance: none;\n}\nsection.pops-panel-container .pops-panel-slider input[type=\"range\"]::-moz-range-progress {\n\theight: 6px;\n\tborder-image: linear-gradient(#409eff, #409eff) 0 fill/9 25 9 0/0 0 0 100vw;\n}\n/* slider旧的CSS */\n\n/* slider的CSS */\n.pops-slider {\n\t--pops-slider-color-white: #ffffff;\n\t--pops-slider-color-primary: #409eff;\n\t--pops-slider-color-info: #909399;\n\t--pops-slider-text-color-placeholder: #a8abb2;\n\t--pops-slider-border-color-light: #e4e7ed;\n\t--pops-slider-border-radius-circle: 100%;\n\t--pops-slider-transition-duration-fast: 0.2s;\n\n\t--pops-slider-main-bg-color: var(--pops-slider-color-primary);\n\t--pops-slider-runway-bg-color: var(--pops-slider-border-color-light);\n\t--pops-slider-stop-bg-color: var(--pops-slider-color-white);\n\t--pops-slider-disabled-color: var(--pops-slider-text-color-placeholder);\n\t--pops-slider-border-radius: 3px;\n\t--pops-slider-height: 6px;\n\t--pops-slider-button-size: 20px;\n\t--pops-slider-button-wrapper-size: 36px;\n\t--pops-slider-button-wrapper-offset: -15px;\n}\n\n.pops-slider {\n\twidth: 100%;\n\theight: 32px;\n\tdisplay: flex;\n\talign-items: center;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-ms-user-select: none;\n\t-moz-user-select: none;\n}\n\n.pops-slider-width {\n\tflex: 0 0 52%;\n\tmargin-left: 10px;\n}\n\n.pops-slider__runway {\n\tflex: 1;\n\theight: var(--pops-slider-height);\n\tbackground-color: var(--pops-slider-runway-bg-color);\n\tborder-radius: var(--pops-slider-border-radius);\n\tposition: relative;\n\tcursor: pointer;\n}\n\n.pops-slider__runway.show-input {\n\tmargin-right: 30px;\n\twidth: auto;\n}\n\n.pops-slider__runway.pops-slider-is-disabled {\n\tcursor: default;\n}\n\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__bar {\n\tbackground-color: var(--pops-slider-disabled-color);\n}\n\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button {\n\tborder-color: var(--pops-slider-disabled-color);\n}\n\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button:hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.dragging {\n\tcursor: not-allowed;\n}\n\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button:hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.dragging {\n\ttransform: scale(1);\n}\n\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button:hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.hover,\n.pops-slider__runway.pops-slider-is-disabled .pops-slider__button.dragging {\n\tcursor: not-allowed;\n}\n\n.pops-slider__input {\n\tflex-shrink: 0;\n\twidth: 130px;\n}\n\n.pops-slider__bar {\n\theight: var(--pops-slider-height);\n\tbackground-color: var(--pops-slider-main-bg-color);\n\tborder-top-left-radius: var(--pops-slider-border-radius);\n\tborder-bottom-left-radius: var(--pops-slider-border-radius);\n\tposition: absolute;\n}\n\n.pops-slider__button-wrapper {\n\theight: var(--pops-slider-button-wrapper-size);\n\twidth: var(--pops-slider-button-wrapper-size);\n\tposition: absolute;\n\tz-index: 1;\n\ttop: var(--pops-slider-button-wrapper-offset);\n\ttransform: translate(-50%);\n\tbackground-color: transparent;\n\ttext-align: center;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tline-height: normal;\n\toutline: none;\n}\n\n.pops-slider__button-wrapper:after {\n\tdisplay: inline-block;\n\tcontent: \"\";\n\theight: 100%;\n\tvertical-align: middle;\n}\n\n.pops-slider__button:hover,\n.pops-slider__button.hover {\n\tcursor: grab;\n}\n\n.pops-slider__button {\n\tdisplay: inline-block;\n\twidth: var(--pops-slider-button-size);\n\theight: var(--pops-slider-button-size);\n\tvertical-align: middle;\n\tborder: solid 2px var(--pops-slider-main-bg-color);\n\tbackground-color: var(--pops-slider-color-white);\n\tborder-radius: 50%;\n\tbox-sizing: border-box;\n\ttransition: var(--pops-slider-transition-duration-fast);\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n}\n\n.pops-slider__button:hover,\n.pops-slider__button.hover,\n.pops-slider__button.dragging {\n\ttransform: scale(1.2);\n}\n\n.pops-slider__button:hover,\n.pops-slider__button.hover {\n\tcursor: grab;\n}\n\n.pops-slider__button.dragging {\n\tcursor: grabbing;\n}\n\n.pops-slider__stop {\n\tposition: absolute;\n\theight: var(--pops-slider-height);\n\twidth: var(--pops-slider-height);\n\tborder-radius: var(--pops-slider-border-radius-circle);\n\tbackground-color: var(--pops-slider-stop-bg-color);\n\ttransform: translate(-50%);\n}\n\n.pops-slider__marks {\n\ttop: 0;\n\tleft: 12px;\n\twidth: 18px;\n\theight: 100%;\n}\n\n.pops-slider__marks-text {\n\tposition: absolute;\n\ttransform: translate(-50%);\n\tfont-size: 14px;\n\tcolor: var(--pops-slider-color-info);\n\tmargin-top: 15px;\n\twhite-space: pre;\n}\n\n.pops-slider.is-vertical {\n\tposition: relative;\n\tdisplay: inline-flex;\n\twidth: auto;\n\theight: 100%;\n\tflex: 0;\n}\n\n.pops-slider.is-vertical .pops-slider__runway {\n\twidth: var(--pops-slider-height);\n\theight: 100%;\n\tmargin: 0 16px;\n}\n\n.pops-slider.is-vertical .pops-slider__bar {\n\twidth: var(--pops-slider-height);\n\theight: auto;\n\tborder-radius: 0 0 3px 3px;\n}\n\n.pops-slider.is-vertical .pops-slider__button-wrapper {\n\ttop: auto;\n\tleft: var(--pops-slider-button-wrapper-offset);\n\ttransform: translateY(50%);\n}\n\n.pops-slider.is-vertical .pops-slider__stop {\n\ttransform: translateY(50%);\n}\n\n.pops-slider.is-vertical .pops-slider__marks-text {\n\tmargin-top: 0;\n\tleft: 15px;\n\ttransform: translateY(50%);\n}\n\n.pops-slider--large {\n\theight: 40px;\n}\n\n.pops-slider--small {\n\theight: 24px;\n}\n/* slider的CSS */\n\n/* input的CSS */\n.pops-panel-input {\n\t--el-disabled-text-color: #a8abb2;\n\t--el-disabled-bg-color: #f5f7fa;\n\t--el-disabled-border-color: #e4e7ed;\n\n\t--pops-panel-components-input-text-color: #000000;\n\t--pops-panel-components-input-text-bg-color: transparent;\n\t--pops-panel-components-input-text-default-padding: 8px;\n\t--pops-panel-components-input-bd-color: #dcdfe6;\n\t--pops-panel-components-input-bg-color: #ffffff;\n\t--pops-panel-components-input-hover-bd-color: #c0c4cc;\n\t--pops-panel-components-input-focus-bd-color: #409eff;\n\t--pops-panel-components-input-suffix-color: #a8abb2;\n\t--pops-panel-components-input-suffix-bg-color: #ffffff;\n}\n.pops-panel-input {\n\tdisplay: flex;\n\talign-items: center;\n\tborder: 1px solid var(--pops-panel-components-input-bd-color);\n\tborder-radius: 4px;\n\tbackground-color: var(--pops-panel-components-input-bg-color);\n\tposition: relative;\n\tbox-shadow: none;\n}\n.pops-panel-input:hover {\n\tborder: 1px solid var(--pops-panel-components-input-hover-bd-color);\n}\n.pops-panel-input:has(input:disabled):hover {\n\t--pops-panel-components-input-hover-bd-color: var(--pops-panel-components-input-bd-color);\n}\n.pops-panel-input:has(input:focus) {\n\toutline: 0;\n\tborder: 1px solid var(--pops-panel-components-input-focus-bd-color);\n\tborder-radius: 4px;\n\tbox-shadow: none;\n}\n.pops-panel-input input {\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\ttext-align: start;\n\talign-items: center;\n\talign-content: center;\n\twhite-space: nowrap;\n\tcursor: text;\n\tbox-sizing: border-box;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tvertical-align: middle;\n\t-webkit-appearance: none;\n\tappearance: none;\n\tcolor: var(--pops-panel-components-input-text-color);\n\tbackground-color: var(--pops-panel-components-input-text-bg-color);\n\toutline: 0;\n\ttransition: 0.1s;\n\tborder: 0;\n\tfont-size: 14px;\n\tfont-weight: 500;\n\tline-height: normal;\n\theight: 32px;\n\twidth: 100%;\n\tflex: 1;\n\t/*margin-right: calc(1em + 8px);*/\n\tmargin: 0px;\n\tpadding: var(--pops-panel-components-input-text-default-padding);\n}\n.pops-panel-input span.pops-panel-input__suffix {\n\tdisplay: inline-flex;\n\twhite-space: nowrap;\n\tflex-shrink: 0;\n\tflex-wrap: nowrap;\n\theight: 100%;\n\ttext-align: center;\n\tcolor: var(--pops-panel-components-input-suffix-color);\n\tbackground: var(--pops-panel-components-input-suffix-bg-color);\n\ttransition: all 0.3s;\n\tpointer-events: none;\n\tpadding: 0 8px;\n\tposition: absolute;\n\tright: 0px;\n\tborder-top-right-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tborder: 1px solid transparent;\n}\n.pops-panel-input span.pops-panel-input__suffix-inner {\n\tpointer-events: all;\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n}\n/* 如果包含清空图标的按钮,则默认隐藏清空图标,当:hover、:focus、:focus-within、:active时显示清空图标 */\n.pops-panel-input span.pops-panel-input__suffix:has(svg[data-type=\"circleClose\"]) {\n\tdisplay: none;\n}\n.pops-panel-input:hover span.pops-panel-input__suffix:has(svg[data-type=\"circleClose\"]),\n.pops-panel-input:focus span.pops-panel-input__suffix:has(svg[data-type=\"circleClose\"]),\n.pops-panel-input:focus-within span.pops-panel-input__suffix:has(svg[data-type=\"circleClose\"]),\n.pops-panel-input:active span.pops-panel-input__suffix:has(svg[data-type=\"circleClose\"]) {\n\tdisplay: inline-flex;\n}\n.pops-panel-input .pops-panel-icon {\n\tcursor: pointer;\n}\n.pops-panel-input .pops-panel-icon {\n\theight: inherit;\n\tline-height: normal;\n\talign-content: center;\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\ttransition: all 0.3s;\n}\n.pops-panel-input .pops-panel-icon svg {\n\theight: 1em;\n\twidth: 1em;\n}\n\n.pops-input-disabled {\n\tbackground-color: var(--pops-components-is-disabled-bg-color);\n}\n.pops-panel-input.pops-input-disabled:hover {\n\t--pops-panel-components-input-hover-bd-color: var(--pops-panel-components-input-bd-color);\n}\n.pops-panel-input input:disabled,\n.pops-panel-input input:disabled + .pops-panel-input__suffix {\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tcolor: var(--el-disabled-text-color);\n\t-webkit-text-fill-color: var(--el-disabled-text-color);\n\tcursor: not-allowed;\n}\n.pops-panel-input input:disabled + .pops-panel-input__suffix {\n\tdisplay: none;\n}\n/* input的CSS */\n\n/* textarea的CSS */\n.pops-panel-textarea {\n\t--pops-panel-components-textarea-text-color: #000000;\n\t--pops-panel-components-textarea-text-bg-color: #ffffff;\n\t--pops-panel-components-textarea-bd-color: #dcdfe6;\n\t--pops-panel-components-textarea-hover-bd-color: #c0c4cc;\n\t--pops-panel-components-textarea-focus-bd-color: #409eff;\n}\n.pops-panel-textarea textarea {\n\twidth: 100%;\n\t/*vertical-align: bottom;*/\n\tposition: relative;\n\tdisplay: block;\n\tresize: none;\n\tpadding: 5px 11px;\n\t/*line-height: 1;*/\n\tbox-sizing: border-box;\n\tfont-size: inherit;\n\tfont-family: inherit;\n\tcolor: var(--pops-panel-components-textarea-text-color);\n\tbackground-color: var(--pops-panel-components-textarea-text-bg-color);\n\tbackground-image: none;\n\t-webkit-appearance: none;\n\tappearance: none;\n\tbox-shadow: none;\n\tborder-radius: 0;\n\ttransition: box-shadow 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n\tborder: 1px solid var(--pops-panel-components-textarea-bd-color);\n}\n.pops-panel-textarea textarea:hover {\n\tborder-color: var(--pops-panel-components-textarea-hover-bd-color);\n}\n.pops-panel-textarea:has(textarea:disabled):hover {\n\t--pops-panel-components-textarea-hover-bd-color: var(--pops-panel-components-textarea-bd-color);\n}\n.pops-panel-textarea-disable {\n\t--pops-panel-components-textarea-text-bg-color: var(--pops-components-is-disabled-bg-color) !important;\n\t--pops-panel-components-textarea-text-color: var(--pops-components-is-disabled-text-color);\n}\n.pops-panel-textarea-disable textarea {\n\tcursor: not-allowed;\n}\n.pops-panel-textarea textarea:focus {\n\toutline: 0;\n\tborder-color: var(--pops-panel-components-textarea-focus-bd-color);\n}\n/* textarea的CSS */\n\n/* select的CSS */\n.pops-panel-select {\n\t--pops-panel-components-select-text-color: #000000;\n\t--pops-panel-components-select-bd-color: rgb(184, 184, 184, var(--pops-bd-opacity));\n\t--pops-panel-components-select-hover-bd-color: rgb(184, 184, 184, var(--pops-bd-opacity));\n\t--pops-panel-components-select-bg-color: rgb(255, 255, 255, var(--pops-bg-opacity));\n}\n.pops-panel-select {\n\tborder: 0;\n}\n.pops-panel-select select {\n\theight: 32px;\n\tline-height: normal;\n\talign-content: center;\n\tmin-width: 200px;\n\tborder: 1px solid var(--pops-panel-components-select-bd-color);\n\tborder-radius: 5px;\n\ttext-align: center;\n\toutline: 0;\n\tcolor: var(--pops-panel-components-select-text-color);\n\tbackground-color: var(--pops-panel-components-select-bg-color);\n\tbox-shadow: none;\n}\n.pops-panel-select select:hover {\n\tborder: 1px solid var(--pops-panel-components-select-hover-bd-color);\n}\n.pops-panel-select-disable {\n\t--pops-panel-components-select-text-color: var(--pops-components-is-disabled-text-color);\n\t--pops-panel-components-select-bg-color: var(--pops-components-is-disabled-bg-color);\n}\n.pops-panel-select-disable select {\n\tcursor: not-allowed;\n}\n.pops-panel-select-disable select:hover {\n\tbox-shadow: none;\n\t--pops-panel-components-select-hover-bd-color: var(--pops-panel-components-select-bd-color);\n}\n.pops-panel-select select:focus {\n\tborder: 1px solid rgb(64, 158, 255, var(--pops-bd-opacity));\n\tbox-shadow: none;\n}\n/* select的CSS */\n\n/* select-multiple的CSS*/\n.pops-panel-select-multiple {\n\t--el-border-radius-base: 4px;\n\t--el-fill-color-blank: #ffffff;\n\t--el-transition-duration: 0.3s;\n\t--el-border-color: #cbcbcb;\n\t--el-text-color-placeholder: #a8abb2;\n\t--color: inherit;\n\t--el-select-input-color: #a8abb2;\n\t--el-select-input-font-size: 14px;\n\t--el-text-color-regular: #606266;\n\t--el-color-info: #909399;\n\t--el-color-info-light-9: #f4f4f5;\n\t--el-color-info-light-8: #e9e9eb;\n\t--el-color-primary-light-9: #ecf5ff;\n\t--el-color-primary-light-8: #d9ecff;\n\t--el-color-primary: #409eff;\n\t--el-color-white: #ffffff;\n\twidth: 200px;\n}\n.pops-panel-select-multiple .el-select__wrapper {\n\tdisplay: flex;\n\talign-items: center;\n\tposition: relative;\n\tbox-sizing: border-box;\n\tcursor: pointer;\n\ttext-align: left;\n\tfont-size: 14px;\n\tpadding: 4px 12px;\n\tgap: 6px;\n\tmin-height: 32px;\n\tline-height: normal;\n\talign-content: center;\n\tborder-radius: var(--el-border-radius-base);\n\tbackground-color: var(--el-fill-color-blank);\n\ttransition: var(--el-transition-duration);\n\ttransform: translateZ(0);\n\tborder: 1px solid var(--el-border-color);\n}\n.pops-panel-select-multiple .el-select__wrapper.is-focused {\n\t--el-border-color: var(--el-color-primary);\n}\n.pops-panel-select-multiple .el-select__selection {\n\tposition: relative;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\talign-items: center;\n\tflex: 1;\n\tmin-width: 0;\n\tgap: 6px;\n}\n.pops-panel-select-multiple .el-select__selected-item {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\t-webkit-user-select: none;\n\tuser-select: none;\n}\n.pops-panel-select-multiple .el-select__selected-item.el-select__choose_tag .el-tag {\n\tmax-width: 200px;\n}\n.pops-panel-select-multiple .el-select__input-wrapper {\n\tmax-width: 100%;\n}\n.pops-panel-select-multiple .el-select__selection.is-near {\n\tmargin-left: -8px;\n}\n.pops-panel-select-multiple .el-select__placeholder {\n\tposition: absolute;\n\tdisplay: block;\n\ttop: 50%;\n\ttransform: translateY(-50%);\n\twidth: 100%;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n\tcolor: var(--el-input-text-color, var(--el-text-color-regular));\n}\n.pops-panel-select-multiple .el-select__placeholder.is-transparent {\n\t-webkit-user-select: none;\n\tuser-select: none;\n\tcolor: var(--el-text-color-placeholder);\n}\n.pops-panel-select-multiple .el-select__prefix,\n.pops-panel-select-multiple .el-select__suffix {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-shrink: 0;\n\tgap: 6px;\n\tcolor: var(--el-input-icon-color, var(--el-text-color-placeholder));\n}\n.pops-panel-select-multiple .el-icon {\n\t--color: inherit;\n\theight: 1em;\n\twidth: 1em;\n\tline-height: normal;\n\talign-content: center;\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\talign-items: center;\n\tposition: relative;\n\tfill: currentColor;\n\tcolor: var(--color);\n\tfont-size: inherit;\n}\n.pops-panel-select-multiple .el-icon svg {\n\theight: 1em;\n\twidth: 1em;\n}\n.pops-panel-select-multiple .el-select__caret {\n\tcolor: var(--el-select-input-color);\n\tfont-size: var(--el-select-input-font-size);\n\ttransition: var(--el-transition-duration);\n\ttransform: rotate(0);\n\tcursor: pointer;\n}\n.pops-panel-select-multiple .el-tag {\n\t--el-tag-font-size: 12px;\n\t--el-tag-border-radius: 4px;\n\t--el-tag-border-radius-rounded: 9999px;\n}\n.pops-panel-select-multiple .el-tag {\n\tbackground-color: var(--el-tag-bg-color);\n\tborder-color: var(--el-tag-border-color);\n\tcolor: var(--el-tag-text-color);\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\talign-items: center;\n\tvertical-align: middle;\n\theight: 24px;\n\tpadding: 0 9px;\n\tfont-size: var(--el-tag-font-size);\n\tline-height: normal;\n\talign-content: center;\n\tborder-width: 1px;\n\tborder-style: solid;\n\tborder-radius: var(--el-tag-border-radius);\n\tbox-sizing: border-box;\n\twhite-space: nowrap;\n\t--el-icon-size: 14px;\n\t--el-tag-bg-color: var(--el-color-primary-light-9);\n\t--el-tag-border-color: var(--el-color-primary-light-8);\n\t--el-tag-hover-color: var(--el-color-primary);\n}\n.pops-panel-select-multiple .el-select__selection .el-tag {\n\tcursor: pointer;\n\tborder-color: transparent;\n}\n.pops-panel-select-multiple .el-tag.el-tag--info {\n\t--el-tag-bg-color: var(--el-color-info-light-9);\n\t--el-tag-border-color: var(--el-color-info-light-8);\n\t--el-tag-hover-color: var(--el-color-info);\n}\n.pops-panel-select-multiple .el-tag.el-tag--info {\n\t--el-tag-text-color: var(--el-color-info);\n}\n.pops-panel-select-multiple .el-tag.is-closable {\n\tpadding-right: 5px;\n}\n.pops-panel-select-multiple .el-select__selection .el-tag .el-tag__content {\n\tmin-width: 0;\n}\n.pops-panel-select-multiple .el-tag .el-tag__close {\n\tflex-shrink: 0;\n\tcolor: var(--el-tag-text-color);\n}\n.pops-panel-select-multiple .el-tag .el-tag__close:hover {\n\tcolor: var(--el-color-white);\n\tbackground-color: var(--el-tag-hover-color);\n}\n.pops-panel-select-multiple .el-tag .el-icon {\n\tborder-radius: 50%;\n\tcursor: pointer;\n\tfont-size: calc(var(--el-icon-size) - 2px);\n\theight: var(--el-icon-size);\n\twidth: var(--el-icon-size);\n}\n.pops-panel-select-multiple .el-tag .el-tag__close {\n\tmargin-left: 6px;\n}\n.pops-panel-select-multiple .el-select__tags-text {\n\tdisplay: block;\n\tline-height: normal;\n\talign-content: center;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n.pops-panel-select-multiple-disable {\n\t--el-fill-color-blank: #f5f7fa;\n\t--color: #a8abb2;\n\t--el-border-color: #cbcbcb;\n}\n.pops-panel-select-multiple-disable .el-tag.el-tag--info {\n\t--el-tag-bg-color: #e7e7e7;\n\t--el-tag-text-color: var(--pops-components-is-disabled-text-color);\n}\n.pops-panel-select-multiple-disable .el-select__selection .el-tag,\n.pops-panel-select-multiple-disable .el-tag .el-tag__close:hover,\n.pops-panel-select-multiple-disable .el-select__wrapper,\n.pops-panel-select-multiple-disable .el-select__caret {\n\tcursor: not-allowed;\n}\n/* select-multiple的CSS*/\n\n/* deepMenu的css */\n.pops-panel-deepMenu-nav-item {\n\tcursor: pointer;\n}\n.pops-panel-deepMenu-nav-item:active {\n\tbackground: var(--pops-panel-forms-container-deepMenu-item-active-bg);\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n}\nsection.pops-panel-container .pops-panel-forms-container-item ul li.pops-panel-deepMenu-nav-item:active {\n\tpadding: var(--pops-panel-forms-container-li-padding-top-bottom)\n\t\tvar(--pops-panel-forms-container-li-padding-left-right);\n\tmargin: 0px;\n}\n/* 去除上个兄弟item的底部边框颜色 */\nsection.pops-panel-container\n\t.pops-panel-forms-container-item\n\tul\n\tli:has(+ .pops-panel-deepMenu-nav-item:active) {\n\tborder-bottom: 1px solid transparent;\n}\n/* 第一个和最后一个跟随圆角 */\nsection.pops-panel-container\n\t.pops-panel-forms-container-item\n\tul\n\tli.pops-panel-deepMenu-nav-item:first-child:active {\n\tborder-top-left-radius: var(--pops-panel-forms-container-item-border-radius);\n\tborder-top-right-radius: var(--pops-panel-forms-container-item-border-radius);\n}\nsection.pops-panel-container\n\t.pops-panel-forms-container-item\n\tul\n\tli.pops-panel-deepMenu-nav-item:last-child:active {\n\tborder-bottom-left-radius: var(--pops-panel-forms-container-item-border-radius);\n\tborder-bottom-right-radius: var(--pops-panel-forms-container-item-border-radius);\n}\n.pops-panel-deepMenu-nav-item .pops-panel-deepMenu {\n\tdisplay: flex;\n\talign-items: center;\n\tcolor: #6c6c6c;\n\tfill: #6c6c6c;\n}\n.pops-panel-deepMenu-nav-item .pops-panel-deepMenu-arrowRight-icon {\n\twidth: 15px;\n\theight: 15px;\n\tdisplay: flex;\n\talign-items: center;\n}\nsection.pops-panel-deepMenu-container\n\t.pops-panel-container-header-ul\n\tli.pops-panel-deepMenu-container-header {\n\tdisplay: flex;\n\talign-items: center;\n\twidth: -webkit-fill-available;\n\twidth: -moz-available;\n\tpadding: var(--pops-panel-forms-header-padding-top-bottom)\n\t\tcalc(\n\t\t\tvar(--pops-panel-forms-margin-left-right) + var(--pops-panel-forms-container-li-padding-left-right) -\n\t\t\t\tvar(--pops-panel-forms-header-icon-size)\n\t\t);\n\tgap: 0px;\n}\n.pops-panel-deepMenu-container .pops-panel-deepMenu-container-left-arrow-icon {\n\twidth: var(--pops-panel-forms-header-icon-size);\n\theight: var(--pops-panel-forms-header-icon-size);\n\tdisplay: flex;\n\talign-items: center;\n\tcursor: pointer;\n}\n/* 修复safari上图标大小未正常显示 */\n.pops-panel-deepMenu-container .pops-panel-deepMenu-container-left-arrow-icon > svg {\n\twidth: inherit;\n\theight: inherit;\n}\n/* deepMenu的css */\n\n/* 文字对齐 */\n.pops-panel-item-left-desc-text:has(code) {\n\tdisplay: flex;\n\talign-items: baseline;\n\tflex-wrap: wrap;\n}\n\n@media (prefers-color-scheme: dark) {\n\t.pops[type-value=\"panel\"] {\n\t\t--pops-bg-color: #000000;\n\t\t--pops-color: #f2f2f2;\n\t\t--panel-title-bg-color: #000000;\n\t\t--panel-aside-bg-color: #262626;\n\t\t--pops-panel-forms-container-item-left-desc-text-color: #6c6c6c;\n\t\t--pops-panel-forms-container-item-bg-color: #262626;\n\t\t--pops-panel-forms-container-item-title-color: #c1c1c1;\n\n\t\t--pops-panel-forms-container-li-border-color: rgb(51, 51, 51, var(--pops-bd-opacity));\n\t\t--pops-panel-forms-container-deepMenu-item-active-bg: #333333;\n\t}\n\t.pops[type-value=\"panel\"] .pops-panel-deepMenu-container .pops-panel-deepMenu-container-left-arrow-icon {\n\t\tfill: #f2f2f2;\n\t}\n\n\t/* switch的CSS */\n\t.pops-panel-switch {\n\t\t--panel-switch-core-bd-color: rgb(220, 223, 230, var(--pops-bd-opacity));\n\t\t--panel-switch-core-bg-color: rgb(220, 223, 230, var(--pops-bg-opacity));\n\t\t--panel-switch-circle-color: #dcdfe6;\n\t\t--panel-switch-circle-bg-color: rgb(255, 255, 255, var(--pops-bg-opacity));\n\t\t--panel-switch-checked-circle-color: #409eff;\n\t\t--panel-switch-checked-core-bd-color: rgb(64, 158, 255, var(--pops-bd-opacity));\n\t\t--panel-switch-checked-core-bg-color: rgb(64, 158, 255, var(--pops-bg-opacity));\n\t}\n\t/* select的CSS */\n\t.pops-panel-select {\n\t\t--pops-panel-components-select-text-color: #f2f2f2;\n\t\t--pops-panel-components-select-bd-color: rgb(51, 51, 51, var(--pops-bd-opacity));\n\t\t--pops-panel-components-select-bg-color: #141414;\n\t}\n\t/* select-multiple的CSS*/\n\t.pops-panel-select-multiple {\n\t\t--el-fill-color-blank: #141414;\n\t\t--el-border-color: #4c4d4f;\n\t\t--el-text-color-placeholder: #a8abb2;\n\t\t--el-select-input-color: #a8abb2;\n\t\t--el-text-color-regular: #606266;\n\t\t--el-color-info: #909399;\n\t\t--el-color-info-light-8: #e9e9eb;\n\t\t--el-color-primary-light-9: #ecf5ff;\n\t\t--el-color-primary-light-8: #d9ecff;\n\t\t--el-color-primary: #409eff;\n\t\t--el-color-white: #ffffff;\n\t}\n\t.pops-panel-select-multiple .el-tag {\n\t\t--el-color-info-light-9: #202121;\n\t}\n\t.pops-panel-select-multiple-disable {\n\t\t--el-border-color: rgb(51, 51, 51, var(--pops-bd-opacity));\n\t}\n\t.pops-panel-select-multiple-disable .el-tag.el-tag--info {\n\t\t--el-tag-bg-color: #2f2f2f;\n\t}\n\t/* select-multiple的CSS*/\n\t/* slider的CSS */\n\t.pops-slider {\n\t\t--pops-slider-border-color-light: #414243;\n\t}\n\t/* input的CSS */\n\t.pops-panel-input {\n\t\t--pops-panel-components-input-text-color: #f2f2f2;\n\t\t--pops-panel-components-input-bd-color: #4f5052;\n\t\t--pops-panel-components-input-bg-color: #141414;\n\t\t--pops-panel-components-input-hover-bd-color: #6f7175;\n\t\t--pops-panel-components-input-focus-bd-color: #409eff;\n\t\t--pops-panel-components-input-suffix-color: #a8abb2;\n\t}\n\t/* textarea的CSS */\n\t.pops-panel-textarea {\n\t\t--pops-panel-components-textarea-text-color: #f2f2f2;\n\t\t--pops-panel-components-textarea-text-bg-color: #141414;\n\t\t--pops-panel-components-textarea-bd-color: #4f5052;\n\t\t--pops-panel-components-textarea-hover-bd-color: #6f7175;\n\t\t--pops-panel-components-textarea-focus-bd-color: #409eff;\n\t}\n\t.pops-panel-textarea-disable {\n\t\t--pops-panel-components-textarea-text-color: var(--pops-components-is-disabled-text-color);\n\t\t--pops-panel-components-textarea-text-bg-color: var(--pops-components-is-disabled-bg-color);\n\t}\n\t/* slider */\n\t.pops-slider {\n\t\t--pops-slider-text-color-placeholder: #8d9095;\n\t}\n}\n";
2782
2782
 
2783
- var rightClickMenuCSS = ".pops-rightClickMenu {\n\t--pops-right-context-color: #000000;\n\t--pops-right-context-bg-color: #ffffff;\n\t--pops-right-context-z-index: 10000;\n\t--pops-right-context-menu-shadow-color: #cacaca;\n\t--pops-right-context-menu-row-visited-color: #dfdfdf;\n\t--pops-right-context-menu-row-hover-color: #dfdfdf;\n}\n.pops-rightClickMenu * {\n\t-webkit-box-sizing: border-box;\n\tbox-sizing: border-box;\n\tmargin: 0;\n\tpadding: 0;\n\t-webkit-tap-highlight-color: transparent;\n\tscrollbar-width: thin;\n}\n.pops-rightClickMenu {\n\tposition: fixed;\n\tz-index: var(--pops-right-context-z-index);\n\ttext-align: center;\n\tborder-radius: 3px;\n\tfont-size: 16px;\n\tfont-weight: 500;\n\tcolor: var(--pops-right-context-color);\n\tbackground-color: var(--pops-right-context-bg-color);\n\tbox-shadow: 0px 1px 6px 1px var(--pops-right-context-menu-shadow-color);\n}\n.pops-rightClickMenu-anim-grid {\n\tdisplay: grid;\n\ttransition: 0.3s;\n\tgrid-template-rows: 0fr;\n}\n.pops-rightClickMenu-anim-show {\n\tgrid-template-rows: 1fr;\n}\n.pops-rightClickMenu-is-visited {\n\tbackground: var(--pops-right-context-menu-row-visited-color);\n}\ni.pops-rightClickMenu-icon {\n\theight: 1em;\n\twidth: 1em;\n\tline-height: normal;\n\talign-content: center;\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\talign-items: center;\n\tposition: relative;\n\tfill: currentColor;\n\tcolor: inherit;\n\tfont-size: inherit;\n\tmargin-right: 6px;\n}\ni.pops-rightClickMenu-icon[is-loading=\"true\"] {\n\tanimation: rotating 2s linear infinite;\n}\n.pops-rightClickMenu li:hover {\n\tbackground: var(--pops-right-context-menu-row-hover-color);\n\tcursor: pointer;\n}\n.pops-rightClickMenu ul {\n\tmargin: 0;\n\tpadding: 0;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: flex-start;\n\tjustify-content: center;\n\toverflow: hidden;\n}\n.pops-rightClickMenu ul li {\n\tpadding: 5px 10px;\n\tmargin: 5px 5px;\n\tborder-radius: 3px;\n\tdisplay: flex;\n\twidth: -webkit-fill-available;\n\twidth: -moz-available;\n\ttext-align: left;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\talign-items: center;\n}\n\n@media (prefers-color-scheme: dark) {\n\t.pops-rightClickMenu {\n\t\t--pops-right-context-menu-shadow-color: #3c3c3c;\n\t}\n}\n";
2783
+ var rightClickMenuCSS = ".pops-rightClickMenu {\n\t--pops-right-context-color: #000000;\n\t--pops-right-context-bg-color: rgb(255, 255, 255, 0.733);\n\t--pops-right-context-backdrop-filter: blur(10px);\n\t--pops-right-context-z-index: 10000;\n\t--pops-right-context-bd-radius: 6px;\n\t--pops-right-context-menu-shadow-color: rgb(114, 114, 114, 0.251);\n\t--pops-right-context-menu-row-bd-radius: 6px;\n\t--pops-right-context-menu-row-visited-color: rgb(0, 0, 0, 0.067);\n\t--pops-right-context-menu-row-hover-color: rgb(0, 0, 0, 0.067);\n}\n.pops-rightClickMenu * {\n\t-webkit-box-sizing: border-box;\n\tbox-sizing: border-box;\n\tmargin: 0;\n\tpadding: 0;\n\t-webkit-tap-highlight-color: transparent;\n\tscrollbar-width: thin;\n}\n.pops-rightClickMenu {\n\tposition: fixed;\n\tz-index: var(--pops-right-context-z-index);\n\ttext-align: center;\n\tborder-radius: var(--pops-right-context-bd-radius);\n\tfont-size: 16px;\n\tfont-weight: 500;\n\tcolor: var(--pops-right-context-color);\n\tbackground: var(--pops-right-context-bg-color);\n\tbox-shadow: 0 0.25rem 0.5rem 0.125rem var(--pops-right-context-menu-shadow-color);\n\t-webkit-backdrop-filter: var(--pops-right-context-backdrop-filter);\n\tbackdrop-filter: var(--pops-right-context-backdrop-filter);\n}\n/* scale动画 */\n.pops-rightClickMenu-anim-scale {\n\ttransition:\n\t\topacity 150ms cubic-bezier(0.2, 0, 0.2, 1),\n\t\ttransform 150ms cubic-bezier(0.2, 0, 0.2, 1);\n\ttransform: scale(0.85);\n}\n.pops-rightClickMenu-anim-scale-open {\n\ttransform: scale(1);\n}\n.pops-rightClickMenu-anim-scale-not-open {\n\topacity: 0;\n}\n/* 展开动画 */\n.pops-rightClickMenu-anim-grid {\n\tdisplay: grid;\n\ttransition: 0.3s;\n\tgrid-template-rows: 0fr;\n}\n.pops-rightClickMenu-anim-show {\n\tgrid-template-rows: 1fr;\n}\n.pops-rightClickMenu-is-visited {\n\tbackground: var(--pops-right-context-menu-row-visited-color);\n}\ni.pops-rightClickMenu-icon {\n\theight: 1em;\n\twidth: 1em;\n\tline-height: normal;\n\talign-content: center;\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\talign-items: center;\n\tposition: relative;\n\tfill: currentColor;\n\tcolor: inherit;\n\tfont-size: inherit;\n\tmargin-right: 6px;\n}\ni.pops-rightClickMenu-icon[is-loading=\"true\"] {\n\tanimation: rotating 2s linear infinite;\n}\n.pops-rightClickMenu li:hover {\n\tbackground: var(--pops-right-context-menu-row-hover-color);\n\tcursor: pointer;\n}\n.pops-rightClickMenu ul {\n\tmargin: 0;\n\tpadding: 0;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: flex-start;\n\tjustify-content: center;\n\toverflow: hidden;\n}\n.pops-rightClickMenu ul li {\n\tpadding: 5px 10px;\n\tmargin: 5px 5px;\n\tborder-radius: var(--pops-right-context-menu-row-bd-radius);\n\tdisplay: flex;\n\twidth: -webkit-fill-available;\n\twidth: -moz-available;\n\ttext-align: left;\n\tuser-select: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\talign-items: center;\n}\n\n@media (prefers-color-scheme: dark) {\n\t/*.pops-rightClickMenu {\n\t\t--pops-right-context-menu-shadow-color: #3c3c3c;\n\t}*/\n}\n@media (hover: hover) {\n\t.pops-rightClickMenu ul li:active {\n\t\ttransform: scale(0.98);\n\t}\n}\n";
2784
2784
 
2785
2785
  const PopsCSS = {
2786
2786
  /** 主CSS */
@@ -10296,6 +10296,7 @@ define((function () { 'use strict';
10296
10296
  useShadowRoot: true,
10297
10297
  className: "",
10298
10298
  isAnimation: true,
10299
+ useScaleAnimation: true,
10299
10300
  only: false,
10300
10301
  zIndex: 10000,
10301
10302
  preventDefault: true,
@@ -10461,28 +10462,38 @@ define((function () { 'use strict';
10461
10462
  },
10462
10463
  /**
10463
10464
  * 自动判断是否存在动画,存在动画就执行关闭动画并删除
10464
- * @param element
10465
+ * @param $menu
10465
10466
  */
10466
- animationCloseMenu(element) {
10467
+ animationCloseMenu($menu) {
10467
10468
  /**
10468
10469
  * 动画结束触发的事件
10469
10470
  */
10470
- function transitionEndEvent(event) {
10471
- popsDOMUtils.off(element, popsDOMUtils.getTransitionEndNameList(), transitionEndEvent, {
10471
+ let transitionEndEvent = (event) => {
10472
+ popsDOMUtils.off($menu, popsDOMUtils.getTransitionEndNameList(), transitionEndEvent, {
10472
10473
  capture: true,
10473
10474
  });
10474
- element.remove();
10475
+ $menu.remove();
10476
+ };
10477
+ popsDOMUtils.containsClassName;
10478
+ if (popsDOMUtils.containsClassName($menu, `pops-${popsType}-anim-show`)) {
10479
+ /* 有动画 */
10480
+ popsDOMUtils.on($menu, popsDOMUtils.getTransitionEndNameList(), transitionEndEvent, {
10481
+ capture: true,
10482
+ });
10483
+ popsDOMUtils.removeClassName($menu, `pops-${popsType}-anim-show`);
10475
10484
  }
10476
- if (element.classList.contains(`pops-${popsType}-anim-show`)) {
10485
+ else if (popsDOMUtils.containsClassName($menu, `pops-${popsType}-anim-scale`) &&
10486
+ popsDOMUtils.containsClassName($menu, `pops-${popsType}-anim-scale-open`)) {
10477
10487
  /* 有动画 */
10478
- popsDOMUtils.on(element, popsDOMUtils.getTransitionEndNameList(), transitionEndEvent, {
10488
+ popsDOMUtils.on($menu, popsDOMUtils.getTransitionEndNameList(), transitionEndEvent, {
10479
10489
  capture: true,
10480
10490
  });
10481
- element.classList.remove(`pops-${popsType}-anim-show`);
10491
+ popsDOMUtils.removeClassName($menu, `pops-${popsType}-anim-scale-open`);
10492
+ popsDOMUtils.addClassName($menu, `pops-${popsType}-anim-scale-not-open`);
10482
10493
  }
10483
10494
  else {
10484
10495
  /* 无动画 */
10485
- element.remove();
10496
+ $menu.remove();
10486
10497
  }
10487
10498
  },
10488
10499
  /**
@@ -10493,10 +10504,11 @@ define((function () { 'use strict';
10493
10504
  if (rootElement == null) {
10494
10505
  return;
10495
10506
  }
10496
- if (rootElement?.["__menuData__"]?.root) {
10497
- rootElement = rootElement?.["__menuData__"]?.root;
10507
+ const rootElementMenuData = Reflect.get(rootElement, "__menuData__");
10508
+ if (rootElementMenuData?.root) {
10509
+ rootElement = rootElementMenuData.root;
10498
10510
  }
10499
- let childMenuList = rootElement["__menuData__"].child;
10511
+ let childMenuList = rootElementMenuData.child;
10500
10512
  childMenuList.forEach((childMenuElement) => {
10501
10513
  this.animationCloseMenu(childMenuElement);
10502
10514
  });
@@ -10507,12 +10519,10 @@ define((function () { 'use strict';
10507
10519
  * 获取菜单容器
10508
10520
  * @param isChildren 是否是rightClickMenu的某一项的子菜单
10509
10521
  */
10510
- getMenuContainerElement(isChildren) {
10522
+ createMenuContainerElement(isChildren) {
10511
10523
  let $menu = popsDOMUtils.createElement("div", {
10512
10524
  className: `pops-${popsType}`,
10513
- innerHTML: /*html*/ `
10514
- <ul></ul>
10515
- `,
10525
+ innerHTML: /*html*/ `<ul class="pops-${popsType}-wrapper"></ul>`,
10516
10526
  });
10517
10527
  let zIndex = this.getMenuZIndex();
10518
10528
  if (zIndex > 10000) {
@@ -10525,6 +10535,11 @@ define((function () { 'use strict';
10525
10535
  if (config.isAnimation) {
10526
10536
  popsDOMUtils.addClassName($menu, `pops-${popsType}-anim-grid`);
10527
10537
  }
10538
+ // 添加放大动画
10539
+ if (config.useScaleAnimation) {
10540
+ popsDOMUtils.addClassName($menu, `pops-${popsType}-anim-scale`);
10541
+ popsDOMUtils.addClassName($menu, `pops-${popsType}-anim-scale-not-open`);
10542
+ }
10528
10543
  return $menu;
10529
10544
  },
10530
10545
  /**
@@ -10630,35 +10645,22 @@ define((function () { 'use strict';
10630
10645
  * @param menuListenerRootNode 右键菜单监听的元素
10631
10646
  */
10632
10647
  showMenu(menuEvent, _config_, menuListenerRootNode) {
10633
- let menuElement = this.getMenuContainerElement(false);
10648
+ let menuElement = this.createMenuContainerElement(false);
10634
10649
  Reflect.set(menuElement, "__menuData__", {
10635
10650
  child: [],
10636
10651
  });
10652
+ // 添加子元素
10637
10653
  PopsContextMenu.addMenuLiELement(menuEvent, menuElement, menuElement, _config_, menuListenerRootNode);
10638
- /* 先隐藏 */
10639
- popsDOMUtils.css(menuElement, {
10640
- display: "none",
10641
- });
10654
+ // 添加到页面
10642
10655
  popsDOMUtils.append($shadowRoot, menuElement);
10643
- /* 添加到页面 */
10656
+ // 判断容器是否存在
10644
10657
  if (!document.contains($shadowContainer)) {
10645
10658
  if (typeof config.beforeAppendToPageCallBack === "function") {
10646
10659
  config.beforeAppendToPageCallBack($shadowRoot, $shadowContainer);
10647
10660
  }
10648
10661
  popsDOMUtils.appendBody($shadowContainer);
10649
10662
  }
10650
- let offset = this.getOffset(menuElement, {
10651
- x: menuEvent.clientX,
10652
- y: menuEvent.clientY,
10653
- }, null);
10654
- popsDOMUtils.css(menuElement, {
10655
- ...offset,
10656
- display: "",
10657
- });
10658
- /* 过渡动画 */
10659
- if (config.isAnimation) {
10660
- popsDOMUtils.addClassName(menuElement, `pops-${popsType}-anim-show`);
10661
- }
10663
+ this.handlerShowMenuCSS(menuElement, menuEvent);
10662
10664
  return menuElement;
10663
10665
  },
10664
10666
  /**
@@ -10671,7 +10673,7 @@ define((function () { 'use strict';
10671
10673
  * @param menuListenerRootNode 右键菜单监听的元素
10672
10674
  */
10673
10675
  showClildMenu(menuEvent, posInfo, _config_, rootElement, targetLiElement, menuListenerRootNode) {
10674
- let menuElement = this.getMenuContainerElement(true);
10676
+ let menuElement = this.createMenuContainerElement(true);
10675
10677
  Reflect.set(menuElement, "__menuData__", {
10676
10678
  parent: targetLiElement,
10677
10679
  root: rootElement,
@@ -10679,27 +10681,40 @@ define((function () { 'use strict';
10679
10681
  // 根菜单数据
10680
10682
  let rootElementMenuData = Reflect.get(rootElement, "__menuData__");
10681
10683
  rootElementMenuData.child.push(menuElement);
10684
+ // 添加子元素
10682
10685
  PopsContextMenu.addMenuLiELement(menuEvent, rootElement, menuElement, _config_, menuListenerRootNode);
10683
- /* 先隐藏 */
10684
- popsDOMUtils.css(menuElement, {
10685
- display: "none",
10686
- });
10687
- /* 添加到页面 */
10686
+ // 添加到页面
10688
10687
  popsDOMUtils.append($shadowRoot, menuElement);
10689
10688
  let $parentMenu = targetLiElement.closest(".pops-rightClickMenu");
10690
- let offset = this.getOffset(menuElement, {
10691
- x: posInfo.clientX,
10692
- y: posInfo.clientY,
10693
- }, {
10689
+ this.handlerShowMenuCSS(menuElement, posInfo, {
10694
10690
  $menu: $parentMenu,
10695
10691
  $parentItem: targetLiElement,
10696
10692
  });
10697
- popsDOMUtils.css(menuElement, { ...offset, display: "" });
10693
+ return menuElement;
10694
+ },
10695
+ /**
10696
+ * 处理菜单显示的css样式(添加到页面后)
10697
+ * @param $menu 菜单元素
10698
+ * @param posInfo 菜单位置信息
10699
+ * @param parentInfo 配置子菜单的父级信息
10700
+ */
10701
+ handlerShowMenuCSS($menu, posInfo, parentInfo) {
10702
+ let offset = this.getOffset($menu, {
10703
+ x: posInfo.clientX,
10704
+ y: posInfo.clientY,
10705
+ }, parentInfo);
10706
+ // 显示
10707
+ popsDOMUtils.css($menu, {
10708
+ ...offset,
10709
+ });
10698
10710
  /* 过渡动画 */
10699
10711
  if (config.isAnimation) {
10700
- popsDOMUtils.addClassName(menuElement, `pops-${popsType}-anim-show`);
10712
+ popsDOMUtils.addClassName($menu, `pops-${popsType}-anim-show`);
10713
+ }
10714
+ if (config.useScaleAnimation) {
10715
+ popsDOMUtils.removeClassName($menu, `pops-${popsType}-anim-scale-not-open`);
10716
+ popsDOMUtils.addClassName($menu, `pops-${popsType}-anim-scale-open`);
10701
10717
  }
10702
- return menuElement;
10703
10718
  },
10704
10719
  /**
10705
10720
  * 获取菜单项的元素
@@ -11439,7 +11454,7 @@ define((function () { 'use strict';
11439
11454
  /** 配置 */
11440
11455
  config = {
11441
11456
  /** 版本号 */
11442
- version: "2025.8.5",
11457
+ version: "2025.8.17",
11443
11458
  cssText: PopsCSS,
11444
11459
  /** icon图标的svg代码 */
11445
11460
  iconSVG: PopsIcon.$data,