@ezuikit/player-theme 3.1.3-beta.3 → 3.1.4-beta.1

package/dist/style.css

@@ -17,13 +17,12 @@ body.ezplayer-body-mobile-noscroll{background-color:#000!important;height:100vh;
 :root{--emodal-z-index:1000;--emodal-bg:#fff;--emodal-color:rgba(0,0,0,.88);--emodal-border-radius:2px;--emodal-shadow:0 6px 16px 0 rgba(0,0,0,.08),0 3px 6px -4px rgba(0,0,0,.12),0 9px 28px 8px rgba(0,0,0,.05);--emodal-mask-bg:rgba(0,0,0,.45);--emodal-header-height:48px;--emodal-title-color:rgba(0,0,0,.88);--emodal-border-color:rgba(5,5,5,.06);--emodal-close-color:rgba(0,0,0,.45);--emodal-close-hover-color:rgba(0,0,0,.88);--emodal-close-hover-bg:rgba(0,0,0,.06)}.emodal-mask{background-color:var(--emodal-mask-bg,rgba(0,0,0,.45));inset:0;position:fixed;z-index:var(--emodal-z-index,1000)}.emodal-wrap{background-color:var(--emodal-bg,#fff);border-radius:var(--emodal-border-radius,2px);box-shadow:var(--emodal-shadow,0 6px 16px 0 rgba(0,0,0,.08));color:var(--emodal-color,rgba(0,0,0,.88));flex-direction:column;left:0;max-height:100vh;max-width:100vw;overflow:hidden;position:fixed;top:0;z-index:calc(var(--emodal-z-index, 1000) + 1)}.emodal-header,.emodal-wrap{box-sizing:border-box;display:flex}.emodal-header{align-items:center;border-bottom:1px solid var(--emodal-border-color,rgba(5,5,5,.06));flex:0 0 auto;justify-content:space-between;min-height:var(--emodal-header-height,48px);padding:0 16px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.emodal-draggable .emodal-header{cursor:move}.emodal-title{color:var(--emodal-title-color,rgba(0,0,0,.88));flex:1 1 auto;font-size:14px;font-weight:600;line-height:1.5;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.emodal-close{align-items:center;background:transparent;border:none;border-radius:4px;color:var(--emodal-close-color,rgba(0,0,0,.45));cursor:pointer;display:inline-flex;flex:0 0 auto;height:28px;justify-content:center;margin-left:12px;padding:0;transition:color .2s,background-color .2s;width:28px}.emodal-close:hover{background-color:var(--emodal-close-hover-bg,rgba(0,0,0,.06));color:var(--emodal-close-hover-color,rgba(0,0,0,.88))}.emodal-close svg{display:block;height:16px;width:16px}.emodal-body{box-sizing:border-box;flex:1 1 auto;overflow:auto}.emodal-hidden{display:none!important}.emodal-dragging{cursor:move!important;-webkit-user-select:none!important;-moz-user-select:none!important;user-select:none!important}
 .evscroll-wrapper{overflow-x:hidden;overflow-y:auto;position:relative;-webkit-overflow-scrolling:touch}.evscroll-content{position:relative;width:100%}.evscroll-viewport{top:0}.evscroll-item,.evscroll-viewport{left:0;position:absolute;width:100%}.evscroll-item{box-sizing:border-box}.evscroll-wrapper::-webkit-scrollbar{height:6px;width:6px}.evscroll-wrapper::-webkit-scrollbar-thumb{background:rgba(0,0,0,.2);border-radius:3px}.evscroll-wrapper::-webkit-scrollbar-track{background:transparent}
 .ez-rec-list-modal-list{box-sizing:border-box;height:100%;position:relative;width:100%}.ez-rec-list-modal-empty{align-items:center;color:rgba(0,0,0,.35);display:flex;font-size:14px;inset:0;justify-content:center;position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:1}.ez-rec-list-modal-group{align-items:flex-end;box-sizing:border-box;display:flex;gap:6px;height:100%;line-height:1;padding:0 10px 8px 12px}.ez-rec-list-modal-group-title{color:rgba(0,0,0,.88);font-size:14px;font-weight:600;height:20px;line-height:20px}.ez-rec-list-modal-group-count{align-items:center;background-color:#369fff;border-radius:9px;box-sizing:border-box;color:#fff;display:inline-flex;font-size:12px;height:18px;justify-content:center;line-height:18px;min-width:18px;padding:0 5px}.ez-rec-list-modal-row{align-items:stretch;box-sizing:border-box;display:flex;gap:8px;height:100%;padding:0 10px 8px 12px}.ez-rec-list-modal-card{cursor:pointer;flex:1 1 0;max-width:calc(50% - 4px);min-width:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.ez-rec-list-modal-card-active .ez-rec-list-modal-card-thumb{box-shadow:0 0 0 1px var(--ez-rec-list-modal-card-active-gap,#fff),0 0 0 3px var(--ez-rec-list-modal-card-active,#369fff)}.ez-rec-list-modal-card-playing{align-items:flex-end;bottom:4px;color:#fff;display:none;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6));left:6px;pointer-events:none;position:absolute;z-index:2}.ez-rec-list-modal-card-playing svg{display:block;height:16px;width:16px}.ez-rec-list-modal-card-playing svg rect{animation:ez-rec-list-modal-eq .9s ease-in-out infinite;transform-box:fill-box;transform-origin:bottom}.ez-rec-list-modal-card-playing svg rect:nth-child(2){animation-delay:.15s}.ez-rec-list-modal-card-playing svg rect:nth-child(3){animation-delay:.3s}.ez-rec-list-modal-card-active .ez-rec-list-modal-card-playing{display:inline-flex}@media (prefers-reduced-motion:reduce){.ez-rec-list-modal-card-playing svg rect{animation:none}}.ez-rec-list-modal-card-thumb{background-color:#ddd;border-radius:8px;height:100%;overflow:hidden;position:relative;width:100%}.ez-rec-list-modal-card-thumb:before{background:linear-gradient(180deg,rgba(0,0,0,.45),transparent);content:"";height:38px;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:1}.ez-rec-list-modal-card-img{height:100%;left:0;-o-object-fit:cover;object-fit:cover;opacity:0;position:absolute;top:0;transition:opacity .25s ease;width:100%;z-index:0}.ez-rec-list-modal-card-placeholder{align-items:center;background:linear-gradient(180deg,var(--ez-rec-list-modal-item-cover-placeholder-start,#b7c3cf),var(--ez-rec-list-modal-item-cover-placeholder-end,#d4d1d1) 100%);color:#fff;display:flex;font-size:20px;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1}.ez-rec-list-modal-card-start{left:6px}.ez-rec-list-modal-card-duration,.ez-rec-list-modal-card-start{color:#fff;font-size:12px;line-height:14px;position:absolute;text-shadow:0 1px 2px rgba(0,0,0,.5);top:5px;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:2}.ez-rec-list-modal-card-duration{right:6px}.ez-rec-list-modal-card-icon{align-items:center;bottom:4px;color:#fff;display:inline-flex;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6));justify-content:center;pointer-events:none;position:absolute;right:5px;z-index:2}.ez-rec-list-modal-card-icon svg{display:block;height:14px;width:14px}.ez-rec-list-modal-title{align-items:center;display:flex;gap:12px;min-width:0}.ez-rec-list-modal-title-text{flex:0 0 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ez-lazy-image.ez-lazy-image-loaded{opacity:1}.ez-lazy-image.ez-lazy-image-error{opacity:0}.ez-rec-list-modal-checkbox{align-items:center;color:var(--ez-rec-list-modal-checkbox-label,rgba(0,0,0,.65));cursor:pointer;display:inline-flex;font-size:13px;gap:6px;line-height:1;margin:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.ez-rec-list-modal-checkbox-input{border:0;height:1px;margin:0;opacity:0;padding:0;pointer-events:none;position:absolute;width:1px}.ez-rec-list-modal-checkbox-box{background-color:#fff;border:1px solid var(--ez-rec-list-modal-checkbox-border,#c0c4cc);border-radius:4px;box-sizing:border-box;flex:0 0 auto;height:var(--ez-rec-list-modal-checkbox-size,16px);position:relative;transition:background-color .2s ease,border-color .2s ease;width:var(--ez-rec-list-modal-checkbox-size,16px)}.ez-rec-list-modal-checkbox-check{color:#fff;display:block;inset:0;opacity:0;position:absolute;transform:scale(.6);transition:opacity .15s ease,transform .15s ease}.ez-rec-list-modal-checkbox-check svg{display:block;height:100%;width:100%}.ez-rec-list-modal-checkbox-checked .ez-rec-list-modal-checkbox-box{background-color:var(--ez-rec-list-modal-checkbox-active,#2f6fdb);border-color:var(--ez-rec-list-modal-checkbox-active,#2f6fdb)}.ez-rec-list-modal-checkbox-checked .ez-rec-list-modal-checkbox-check{opacity:1;transform:scale(1)}.ez-rec-list-modal-checkbox-disabled{cursor:not-allowed;opacity:.5}.ez-rec-list-modal-checkbox-input:focus-visible+.ez-rec-list-modal-checkbox-box{box-shadow:0 0 0 2px rgba(47,111,219,.3)}@keyframes ez-rec-list-modal-eq{0%,to{transform:scaleY(.4)}50%{transform:scaleY(1)}}
-.ez-segment-progress{align-items:center;box-sizing:border-box;display:flex;padding:8px 10px;-moz-user-select:none;user-select:none;-webkit-user-select:none;width:100%;-webkit-tap-highlight-color:transparent}.ez-segment-progress-time{color:var(--ez-segment-progress-text-color,hsla(0,0%,100%,.9));flex:none;font-size:12px;font-variant-numeric:tabular-nums;line-height:1}.ez-segment-progress-time-current{margin-right:8px}.ez-segment-progress-time-total{margin-left:8px}.ez-segment-progress-track{background:var(--ez-segment-progress-track-color,hsla(0,0%,100%,.35));border-radius:2px;cursor:pointer;flex:1 1 auto;height:3px;position:relative;touch-action:none}.ez-segment-progress-track:before{bottom:-12px;content:"";left:0;position:absolute;right:0;top:-12px}.ez-segment-progress-track:focus-visible{outline:2px solid var(--ez-segment-progress-played-color,#1890ff);outline-offset:4px}.ez-segment-progress-played{background:var(--ez-segment-progress-played-color,#1890ff);border-radius:2px;height:100%;left:0;pointer-events:none;position:absolute;top:0;width:0}.ez-segment-progress-thumb{background:var(--ez-segment-progress-thumb-color,#fff);border-radius:50%;box-shadow:0 0 2px rgba(0,0,0,.35);height:10px;left:0;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .1s,height .1s;width:10px}.ez-segment-progress-dragging .ez-segment-progress-thumb{height:14px;width:14px}.ez-segment-progress-disabled{opacity:.5}.ez-segment-progress-disabled .ez-segment-progress-track{cursor:not-allowed}
 .ezplayer .ezplayer-progress{align-items:center;background-color:var(--ezplayer-panel-bg-color,rgba(0,0,0,.7));border-radius:var(--ezplayer-border-radius,8px);box-sizing:border-box;cursor:default;display:flex;flex-direction:column;justify-content:center;padding:30px 9px 11px;position:relative;width:38px}.ezplayer .ezplayer-progress,.ezplayer .ezplayer-progress-text{-webkit-user-select:none;-moz-user-select:none;user-select:none}.ezplayer .ezplayer-progress-text{font-size:12px;height:17px;left:0;line-height:17px;position:absolute;text-align:center;top:8px;width:100%}.ezplayer .ezplayer-progress-minus,.ezplayer .ezplayer-progress-plus{display:flex;height:25px;justify-content:center}.ezplayer .ezplayer-progress-minus .ezplayer-icon,.ezplayer .ezplayer-progress-plus .ezplayer-icon{color:#fff;cursor:pointer;display:inline-block;font-size:20px;height:20px;text-align:center;transition:color .3s ease,border-color .3s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:20px}.ezplayer .ezplayer-progress-minus .ezplayer-icon:active,.ezplayer .ezplayer-progress-plus .ezplayer-icon:active{color:var(--ezplayer-primary-color,#407aff)}@media (hover:hover){.ezplayer .ezplayer-progress-minus .ezplayer-icon:hover,.ezplayer .ezplayer-progress-plus .ezplayer-icon:hover{color:var(--ezplayer-primary-color,#407aff)}}.ezplayer .ezplayer-progress-plus{padding-bottom:5px}.ezplayer .ezplayer-progress-minus{padding-top:5px}.ezplayer .ezplayer-progress-slider{background-color:hsla(0,0%,100%,.75);border-radius:2px;cursor:pointer;flex:1 1 auto;position:relative;width:4px}.ezplayer .ezplayer-progress-slider-fill{background-color:var(--ezplayer-primary-color,#407aff);border-radius:4px;bottom:0;height:0;left:0;position:absolute;width:100%}.ezplayer .ezplayer-progress-slider-handle{align-items:center;background-color:var(--ezplayer-primary-color,#407aff);border-radius:50%;cursor:pointer;display:inline-flex;height:12px;justify-content:center;left:50%;position:absolute;top:0;transform:translate(-50%,-50%);width:12px}.ezplayer .ezplayer-progress-slider-handle:hover{box-shadow:0 0 2px var(--ezplayer-primary-color,#407aff)}.ezplayer .ezplayer-progress-slider-handle:before{background-color:#fff;border-radius:50%;content:"";display:inline;height:6px;width:6px}
 .ezplayer-icon{align-items:center;color:inherit;display:inline-flex;font-size:var(--ezplayer-icon-font-size,24px);font-style:normal;line-height:0;text-align:center;text-rendering:optimizeLegibility;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
 .ezplayer-select-panel{background-color:var(--ezplayer-panel-bg-color,rgba(0,0,0,.7));border-radius:var(--ezplayer-border-radius,8px);color:var(--ezplayer-default-color,#fff);display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto;position:relative}.ezplayer-select-btn{width:50px}.ezplayer-select-btn span{display:inline-block;font-size:12px;font-size:calc(var(--ezplayer-font-size, 14px) - 2px);line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ezplayer-select-list{align-items:center;display:flex;flex-direction:column;font-size:var(--ezplayer-font-size,14px);list-style:none;margin:0;padding:12px 0!important;width:100%}.ezplayer-select-option{box-sizing:border-box;cursor:pointer;display:inline-flex;height:28px;justify-content:center;line-height:18px;list-style:none;padding:5px 20px!important;transition:color .3s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}.ezplayer-select-option span{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ezplayer-select-option:hover{color:var(--ezplayer-active-color)}.ezplayer-select-cancel,.ezplayer-select-close{display:none}.ezplayer-select-cancel{font-size:var(--ezplayer-font-size,14px)}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-panel{background-color:transparent;max-width:400px;padding-bottom:calc(54px + env(safe-area-inset-bottom));width:90%}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-list{align-items:center;background-color:#fff;border-radius:var(--ezplayer-border-radius,8px);display:flex;flex-direction:column;font-size:var(--ezplayer-font-size,14px);max-height:70vh;max-height:calc(90vh - 108px);overflow-x:hidden;overflow-y:auto;padding:20px 0!important}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-cancel,.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-option{align-items:center;box-sizing:border-box;color:#2c2c2c;display:inline-flex;height:36px;justify-content:center;line-height:26px;padding:5px 20px!important}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-option{--webkit-tap-highlight-color:transparent!important}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-option:hover{color:#2c2c2c}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-option:active{background-color:#f8f8f8}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-cancel{background-color:#fff;border-radius:var(--ezplayer-border-radius,8px);display:flex;height:54px;margin-top:8px}.ezplayer-mobile .epicker-mobile.ezplayer-select-picker .ezplayer-select-cancel:active{color:var(--ezplayer-active-color)}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .epicker-body{bottom:0;left:unset;right:0;top:0;width:240px}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-panel{align-items:center;background-color:var(--ezplayer-panel-bg-color,rgba(0,0,0,.7));border-bottom-right-radius:0;border-top-right-radius:0;height:100%;justify-content:center;padding-bottom:env(safe-area-inset-bottom);width:100%}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-list{background-color:transparent;border-radius:0;color:#fff;height:auto;margin:0;max-height:100%;width:100%}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-option,.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-option:hover{color:#fff}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-option:active{background-color:transparent;color:var(--ezplayer-active-color)}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-cancel{display:none}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-close{display:inline-flex;left:10px;position:absolute;top:10px}.ezplayer-mobile.ezplayer-fullscreen .epicker-mobile.ezplayer-select-picker .ezplayer-select-close:active{color:var(--ezplayer-active-color)}
 .ezplayer-control-fullscreen .ezplayer-icon-exit-fullscreen,.ezplayer-control-global-fullscreen .ezplayer-icon-exit-global-fullscreen{display:none}.ezplayer-fullscreen .ezplayer-icon-exit-fullscreen{display:inline-flex}.ezplayer-fullscreen .ezplayer-icon-fullscreen{display:none}.ezplayer-global-fullscreen .ezplayer-icon-exit-global-fullscreen{display:inline-flex}.ezplayer-global-fullscreen .ezplayer-icon-global-fullscreen{display:none}
 .ezplayer-loading{background-color:rgba(0,0,0,.5);bottom:0;color:#fff;display:none;font-size:14px;height:100%;left:0;position:absolute;right:0;top:0;transition:transform .3s cubic-bezier(.78,.14,.15,.86);vertical-align:middle;width:100%;z-index:4}.ezplayer-loading-dot{display:inline-block;font-size:25px;height:25px;position:relative;width:25px}.ezplayer-loading-dot-item{background-color:#fff;border-radius:2px;display:block;height:10px;position:absolute;transform-origin:50% 50%;width:10px}.ezplayer-loading-dot-item:first-child{animation:animationShape1 2s linear 0s infinite normal;left:0;opacity:1;top:0}.ezplayer-loading-dot-item:nth-child(2){animation:animationShape2 2s linear 0s infinite normal;left:15px;opacity:.8;top:0}.ezplayer-loading-dot-item:nth-child(3){animation:animationShape3 2s linear 0s infinite normal;left:0;opacity:.5;top:15px}.ezplayer-loading-dot-item:nth-child(4){animation:animationShape4 2s linear 0s infinite normal;left:15px;opacity:.3;top:15px}.ezplayer-loading-dot-load{animation:rotation 1s infinite}@media (-ms-high-contrast:active),(-ms-high-contrast:none){.ezplayer-load-blur{background:#fff;opacity:.5}}@keyframes ezdSpinMove{to{opacity:1}}@keyframes ezdRotate{to{transform:rotate(405deg)}}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes animationShape1{0%{transform:translate(0)}25%{transform:translateY(15px)}50%{transform:translate(15px,15px)}75%{transform:translate(15px)}to{transform:translate(translate)}}@keyframes animationShape2{0%{transform:translate(0)}25%{transform:translate(-15px)}50%{transform:translate(-15px,15px)}75%{transform:translateY(15px)}}@keyframes animationShape3{0%{transform:translate(0)}25%{transform:translate(15px)}50%{transform:translate(15px,-15px)}75%{transform:translateY(-15px)}}@keyframes animationShape4{0%{transform:translate(0)}25%{transform:translateY(-15px)}50%{transform:translate(-15px,-15px)}75%{transform:translate(-15px)}}.ezplayer-loading-text{margin-top:20px}
-.ezplayer-message{background-color:rgba(0,0,0,.4);bottom:0;color:#fff;display:none;font-size:16px;height:100%;left:0;overflow:hidden;position:absolute;right:0;top:0;width:100%;z-index:5}.ezplayer-message-content{align-items:center;display:flex;flex-direction:column;justify-content:center}.ezplayer-message-msg{display:-webkit-box;-webkit-line-clamp:2;margin-top:15px;max-width:500px;overflow:hidden;word-break:break-all;-webkit-box-orient:vertical;padding:0 20px}.ezplayer-message-error{color:#ff4d4f}.ezplayer-toast{background-color:rgba(0,0,0,.8);border-radius:var(--ezplayer-border-radius,8px);box-shadow:0 9px 28px 8px rgba(0,0,0,.05),0 3px 16px 0 rgba(0,0,0,.03),0 3px 7px -4px rgba(0,0,0,.05);color:#fff;display:flex;font-size:14px;left:50%;line-height:22px;max-width:450px;overflow:hidden;padding:9px 16px;position:absolute;top:50px;transform:translateX(-50%);z-index:6}.ezplayer-toast-content{padding-left:24px;position:relative}.ezplayer-toast .ezplayer-icon{font-size:16px;left:0;position:absolute;top:3px}.ezplayer-toast .ezplayer-icon-info-circle{color:var(--ezplayer-default-color,#fff)}.ezplayer-toast .ezplayer-icon-warn-circle{color:#faad14}.ezplayer-toast .ezplayer-icon-close-circle{color:#ff4d4f}.ezplayer-mobile .ezplayer-toast{font-size:12px;line-height:20px}.ezplayer-mobile .ezplayer-toast-content{padding-left:20px}.ezplayer-mobile .ezplayer-toast .ezplayer-icon{font-size:14px}
+.ezplayer-message{background-color:rgba(0,0,0,.4);bottom:0;color:#fff;display:none;font-size:16px;height:100%;left:0;overflow:hidden;position:absolute;right:0;top:0;width:100%;z-index:5}.ezplayer-message-content{align-items:center;display:flex;flex-direction:column;justify-content:center}.ezplayer-message-msg{display:-webkit-box;margin-top:15px;max-width:500px;overflow:hidden;word-break:break-all;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:0 20px}.ezplayer-message-error{color:#ff4d4f}.ezplayer-toast{background-color:rgba(0,0,0,.8);border-radius:var(--ezplayer-border-radius,8px);box-shadow:0 9px 28px 8px rgba(0,0,0,.05),0 3px 16px 0 rgba(0,0,0,.03),0 3px 7px -4px rgba(0,0,0,.05);color:#fff;display:flex;font-size:14px;left:50%;line-height:22px;max-width:450px;overflow:hidden;padding:9px 16px;position:absolute;top:50px;transform:translateX(-50%);z-index:6}.ezplayer-toast-content{padding-left:24px;position:relative}.ezplayer-toast .ezplayer-icon{font-size:16px;left:0;position:absolute;top:3px}.ezplayer-toast .ezplayer-icon-info-circle{color:var(--ezplayer-default-color,#fff)}.ezplayer-toast .ezplayer-icon-warn-circle{color:#faad14}.ezplayer-toast .ezplayer-icon-close-circle{color:#ff4d4f}.ezplayer-mobile .ezplayer-toast{font-size:12px;line-height:20px}.ezplayer-mobile .ezplayer-toast-content{padding-left:20px}.ezplayer-mobile .ezplayer-toast .ezplayer-icon{font-size:14px}
 .ezplayer-poster{bottom:0;display:none;height:100%;left:0;overflow:hidden;position:absolute;right:0;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;z-index:2}.ezplayer-poster img{border:0;font-size:0;height:100%;outline:none;pointer-events:none;width:100%}
 .ezplayer-icon-volume{position:relative}.ezplayer-icon-volume svg .ezplayer-icon-volume-high,.ezplayer-icon-volume svg .ezplayer-icon-volume-low,.ezplayer-icon-volume svg .ezplayer-icon-volume-muted{display:none}.ezplayer-icon-volume.ezplayer-icon-volume-high svg .ezplayer-icon-volume-high,.ezplayer-icon-volume.ezplayer-icon-volume-high svg .ezplayer-icon-volume-low,.ezplayer-icon-volume.ezplayer-icon-volume-low svg .ezplayer-icon-volume-low,.ezplayer-icon-volume.ezplayer-icon-volume-muted svg .ezplayer-icon-volume-muted,.ezplayer-icon-volume.ezplayer-icon-volume-zero svg .ezplayer-icon-volume-muted{display:inline}.ezplayer-volume-progress{height:126px}
 .ezplayer-control-rec{box-sizing:border-box;display:inline-flex;flex-direction:row}.ezplayer-control-rec .ezplayer-icon-cloud-rec,.ezplayer-control-rec .ezplayer-icon-cloud-record,.ezplayer-control-rec .ezplayer-icon-sdk{color:#d4d7dd;cursor:pointer;margin-left:5px}.ezplayer-mobile-extend .ezplayer-control-rec{background-color:#f4f6fc;border:1px solid #ededed;border-radius:18px;height:30px}.ezplayer-mobile-extend .ezplayer-icon-cloud-rec,.ezplayer-mobile-extend .ezplayer-icon-cloud-record,.ezplayer-mobile-extend .ezplayer-icon-sdk{cursor:pointer;font-size:20px;margin-left:1px;padding:2px 7px}.ezplayer-mobile-extend .ezplayer-icon-cloud-rec.ezplayer-active,.ezplayer-mobile-extend .ezplayer-icon-cloud-record.ezplayer-active,.ezplayer-mobile-extend .ezplayer-icon-sdk.ezplayer-active{background-color:#fff;border-radius:12px;box-shadow:0 1px 4px 0 hsla(0,0%,68%,.2)}.ezplayer-mobile .ezplayer-icon-cloud-rec,.ezplayer-mobile .ezplayer-icon-cloud-record,.ezplayer-mobile .ezplayer-icon-sdk{margin-left:10px}
@@ -36,7 +35,7 @@ body.ezplayer-body-mobile-noscroll{background-color:#000!important;height:100vh;
 .ezplayer-control-rec-dropdown .ezplayer-rec-dropdown-btn{cursor:pointer;font-size:14px;line-height:20px;padding:2px 6px;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.ezplayer-control-rec-dropdown.ezplayer-active .ezplayer-rec-dropdown-btn{color:var(--ezplayer-active-color,#407aff)}.ezplayer-rec-dropdown-picker .ezplayer-rec-dropdown-panel{background-color:var(--ezplayer-panel-bg-color,rgba(0,0,0,.7));border-radius:var(--ezplayer-border-radius,8px);color:var(--ezplayer-default-color,#fff);padding:8px 0}.ezplayer-rec-dropdown-picker .ezplayer-rec-dropdown-list{list-style:none;margin:0;padding:0}.ezplayer-rec-dropdown-picker .ezplayer-rec-dropdown-item{cursor:pointer;font-size:14px;line-height:20px;padding:6px 20px;transition:color .2s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.ezplayer-rec-dropdown-picker .ezplayer-rec-dropdown-item.ezplayer-active,.ezplayer-rec-dropdown-picker .ezplayer-rec-dropdown-item:hover{color:var(--ezplayer-active-color,#407aff)}
 .ezplayer-control-rec-list .ezplayer-rec-list-btn{cursor:pointer;font-size:14px;line-height:20px;padding:2px 6px;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.ezplayer-control-rec-list.ezplayer-active .ezplayer-rec-list-btn{color:var(--ezplayer-active-color,#407aff)}.ezplayer-mobile-extend .ezplayer-control-rec-list{display:none}
 .ezplayer-control-alarm-message .ezplayer-alarm-message-btn{cursor:pointer;font-size:14px;line-height:20px;padding:2px 6px;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.ezplayer-mobile-extend .ezplayer-control-alarm-message{align-items:center;background-color:#f4f6fc;border:1px solid #ededed;border-radius:50%;box-sizing:border-box;cursor:pointer;display:inline-flex;font-size:18px;height:30px;justify-content:center;margin-left:8px;width:30px}
-.ezplayer-record-timer .ezplayer-icon-record-circle{font-size:14px}.ezplayer-record-timer{align-items:center;background-color:#ff4c5c;border-radius:24px;color:#fff;display:inline-flex;flex-direction:row;left:50%;padding:2px 6px;position:absolute;top:60px;transform:translateX(-50%);-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:3}.ezplayer-record-timer-time{font-weight:400;letter-spacing:1px;line-height:20px;margin-left:2px}
+.ezplayer-record-timer{align-items:center;background-color:#ff4c5c;border-radius:24px;color:#fff;display:inline-flex;flex-direction:row;left:50%;padding:2px 6px;position:absolute;top:60px;transform:translateX(-50%);-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:3}.ezplayer-record-timer .ezplayer-icon-record-circle{font-size:14px}.ezplayer-record-timer-time{font-weight:400;letter-spacing:1px;line-height:20px;margin-left:2px}
 .ezplayer-select-definition .ezplayer-select-panel{width:100px}.ezplayer-control-definition .ezplayer-select-btn{width:75px}
 
 .ezplayer-control-device{width:100%}.ezplayer-control-device span{display:inline;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

package/dist/style.js

@@ -1,6 +1,7 @@
 /*
-* @ezuikit/player-theme v3.1.3-beta.3
-* Copyright (c) 2026-08-19 18:26:29 Ezviz-OpenBiz
+* @ezuikit/player-theme v3.1.4-beta.1
+* Copyright (c) 2026-08-24 09:15:26 Ezviz-OpenBiz
 * Released under the MIT License.
 */
+import '@ezuikit/control-segment-progress/dist/style';
 require("./style.css");

package/dist/types/index.d.ts

@@ -1512,13 +1512,17 @@ declare class Theme extends EventEmitter {
         readonly recTypeChange: "recTypeChange";
         readonly definitionChange: "definitionChange";
         readonly speedChange: "speedChange";
-        readonly recordingChange: "recordingChange"; /** 封面控件 @since 0.0.1 @private */
+        readonly recordingChange: "recordingChange";
         readonly talkingChange: "talkingChange";
         readonly talkVolumeChange: "talkVolumeChange";
         readonly broadcastChange: "broadcastChange";
         readonly aichatChange: "aichatChange";
         readonly liveChange: "liveChange";
-        readonly recDropdownChange: "recDropdownChange";
+        readonly recDropdownChange: "recDropdownChange"; /**
+         * 更多控件（header more）
+         * @since 0.0.1
+         * @private
+         */
         readonly recListChange: "recListChange";
         readonly alarmMessageChange: "alarmMessageChange";
         readonly setLoggerOptions: "setLoggerOptions";
@@ -1527,10 +1531,7 @@ declare class Theme extends EventEmitter {
         readonly setVideoLevelList: "setVideoLevelList";
         readonly currentVideoLevel: "currentVideoLevel";
         readonly currentVideoLevelAuto: "currentVideoLevelAuto";
-        readonly setAllDayRecTimes: "setAllDayRecTimes"; /**
-         * 移动端扩展容器, 扩展的控件渲染在指定容器以外， 仅只用端适用， 为了可以放置大的控件和方便开发接入
-         * @private
-         */
+        readonly setAllDayRecTimes: "setAllDayRecTimes";
         readonly getOSDTime: "getOSDTime";
         readonly playbackEnd: "playbackEnd";
         readonly control: {
@@ -1544,8 +1545,8 @@ declare class Theme extends EventEmitter {
             readonly volumeDestroy: "Control.volumeDestroy";
             readonly controlsBarOpenChange: "Control.controlsBarOpenChange";
             readonly headerMoreShowControlsChange: "Control.headerMoreShowControlsChange";
-            readonly headerMorePanelOpenChange: "Control.headerMorePanelOpenChange"; /** 电子放大倍数 @private */
-            readonly footerMoreShowControlsChange: "Control.footerMoreShowControlsChange";
+            readonly headerMorePanelOpenChange: "Control.headerMorePanelOpenChange";
+            readonly footerMoreShowControlsChange: "Control.footerMoreShowControlsChange"; /** 录制中 @private */
             readonly footerMorePanelOpenChange: "Control.footerMorePanelOpenChange";
             readonly deviceDestroy: "Control.deviceDestroy";
             readonly recTypeChange: "Control.recTypeChange";
@@ -1752,7 +1753,7 @@ declare class Theme extends EventEmitter {
             DEVICE_ENCRYPTED: string;
             NO_RECORD: string;
             PLAY_FAILED: string;
-            PLAY_SUCCESS: string; /** 语言包 @since 0.0.1 */
+            PLAY_SUCCESS: string;
             STOP_SUCCESS: string;
             CHANGE_PLAYURL_SUCCESS: string;
             CHANGE_PLAYURL_FAILED: string;
@@ -1767,14 +1768,14 @@ declare class Theme extends EventEmitter {
             MAX_SPEED_LIMIT: string;
             MIN_SPEED_LIMIT: string;
             SEEK_CANNOT_CROSS_DAYS: string;
-            /** 所有控件列表, 所有控件名称规则（`${iconId}Control`）， 如音量控件 this.controls["volumeControl"]  @since 0.0.1 */
             SEEK_TIMEFORMAT_ERROR: string;
+            /** 所有控件列表, 所有控件名称规则（`${iconId}Control`）， 如音量控件 this.controls["volumeControl"]  @since 0.0.1 */
             PAUSE: string;
             PAUSE_FAILED: string;
             RESUME: string;
             RESUME_FAILED: string;
             CALL_END: string;
-            USER_DO_NOT_OWN_DEVICE: string; /** 加载控件 @since 0.0.1  @private */
+            USER_DO_NOT_OWN_DEVICE: string;
             NO_CLOUD_RECORD: string;
             CHANGE_VIDEO_LEVEL: string;
             CHANGE_VIDEO_LEVEL_FAIL: string;
@@ -1790,13 +1791,13 @@ declare class Theme extends EventEmitter {
             VIDEO_LEVEL_3K: string;
             VIDEO_LEVEL_4k: string;
             RESET_THEME: string;
+            BTN_PLAY: string;
+            BTN_PAUSE: string;
             /**
              * 更多控件（header more）
              * @since 0.0.1
              * @private
              */
-            BTN_PLAY: string;
-            BTN_PAUSE: string;
             BTN_VOLUME: string;
             BTN_MUTED: string;
             BTN_RECORDVIDEO: string;
@@ -1806,9 +1807,9 @@ declare class Theme extends EventEmitter {
             BTN_AICHAT: string;
             BTN_LIVE: string;
             BTN_REC_DROPDOWN: string;
-            BTN_ALARM_MESSAGE: string;
-            REC_DROPDOWN_CLOUD_REC: string; /** 低部控件 @since 0.0.1 @private */
-            REC_DROPDOWN_CLOUD_RECORD: string;
+            BTN_ALARM_MESSAGE: string; /** 头部控件 @since 0.0.1 @private */
+            REC_DROPDOWN_CLOUD_REC: string;
+            REC_DROPDOWN_CLOUD_RECORD: string; /** 低部控件 @since 0.0.1 @private */
             REC_DROPDOWN_LOCAL_REC: string;
             BTN_ZOOM: string;
             BTN_3D_ZOOM: string;
@@ -1836,7 +1837,7 @@ declare class Theme extends EventEmitter {
             RECORD_TIPS: string;
             RECORDS: string;
             OPEN_SOUND: string;
-            CLOSE_SOUND: string; /** 容器的宽 */
+            CLOSE_SOUND: string;
             SOUND_OPENED: string;
             ZOOM: string;
             START_ZOOM: string;
@@ -1856,10 +1857,11 @@ declare class Theme extends EventEmitter {
             DEVICE_NOT_SUPPORT_3D_ZOOM: string;
             '3D_ZOOM_ACTIVED': string;
             '3D_ZOOM_NOT_ACTIVED': string;
-            '3D_ZOOM_CLOSED': string;
+            '3D_ZOOM_CLOSED': string; /** 录制中 @private */
             CHANGE_ZOOM_TYPE: string;
             FULLSCREEN: string;
             FULLSCREEN_EXIT: string;
+            /** 倍速 @private */
             GET_WEB_FULLSCREEN_STATUS: string;
             WEB_FULLSCREEN: string;
             WEB_FULLSCREEN_EXIT: string;
@@ -1873,32 +1875,22 @@ declare class Theme extends EventEmitter {
             PTZ_FAST: string;
             PTZ_MID: string;
             PTZ_SLOW: string;
-            PTZ_SPEED: string; /**
-            //  * 记录回放的月份
-            //  *
-            //  * key: {序列号}_{通道号}_{rec | cloud | cloudRecord}   比如：BC7799091_1_rec  BC7799091_1_cloud BC7799091_1_cloudRecord
-            //  *
-            //  * value: 月份列表  比如 ["2025-12-01", "2025-12-02"]
-            //  * @private
-            //  */
-            /**
-             * 录像回放的月份列表 @private
-             */
+            PTZ_SPEED: string;
             DEVICE_ZOOM: string;
+            DEVICE_FOCUS: string;
             /**
              * 录像回放的月份列表 @private
              */
-            DEVICE_FOCUS: string;
             NOT_SUPPORT_DEVICE_ZOOM: string;
             NOT_SUPPORT_FOCUS: string;
             MIRROR: string;
-            /**
-             * 录像回放的月份列表 @private
-             */
             MIRROR_TYPE_ERROR: string;
             CHANGE_FEC_TYPE: string;
             DEVICE_NOT_SUPPORT: string;
             TYPE_NOT_SUPPORT: string;
+            /**
+             * 录像回放的月份列表 @private
+             */
             FEC_SUPPORT_VERSION: string;
             NO_CANVAS_ID: string;
             SET_FEC_PARAMS: string;
@@ -1908,7 +1900,11 @@ declare class Theme extends EventEmitter {
             GET_FEC_PARAMS_SUPPORT_VERSION: string;
             SET_WATERMARK: string;
             FETCH_THEME_FAILED: string;
-            cancel: string;
+            cancel: string; /**
+             * 模板请求（getDetail）的中止控制器。
+             * 重新渲染或销毁时中止在途请求，避免请求返回后在已销毁/已切换的 theme 上继续操作。
+             * @private
+             */
             ok: string;
             close: string;
             BTN_REC_LIST_TITLE: string;
@@ -1948,40 +1944,6 @@ declare class Theme extends EventEmitter {
             395506: string;
             395507: string;
             395530: string;
-            /**
-             * 播放器主题
-             * @class Theme
-             * @category Theme
-             * @remarks
-             * 萤石播放器主题，主要用于播放器的 UI 展示和交互，支持 flv, hls, mp4, ezopen 等流类型。
-             * 提供了丰富的控件和配置选项，支持多语言和自定义样式。
-             *
-             * @example
-             * ```ts
-             * // import css file
-             * import "@ezuikit/player-theme/dist/style.js"
-             * import Theme from '@ezuikit/player-theme';
-             *
-             * // class Player extends Theme {}
-             *
-             * const theme = new Theme({
-             *  container: () => document.querySelector('.player'),
-             *  type: 'flv',
-             * });
-             * ```
-             *
-             * ```html
-             * <!-- html script, static in `@ezuikit/player-theme/dist` -->
-             * <link rel="stylesheet" href="./assets/@ezuikit/player-theme/dist/style.css" />
-             * <script src="./assets/@ezuikit/player-theme/dist/index.umd.js"></script>
-             * <script>
-             *  const theme = new Theme({
-             *      container: () => document.querySelector('.player'),
-             *      type: 'flv',
-             *  });
-             * </script>
-             * ```
-             */
             395544: string;
             395545: string;
             395546: string;
@@ -2003,6 +1965,7 @@ declare class Theme extends EventEmitter {
             395602: string;
             395610: string;
             395620: string;
+            /** 消息提示控件 @since 0.0.1 @private */
             395701: string;
             395702: string;
             395703: string;
@@ -2030,7 +1993,7 @@ declare class Theme extends EventEmitter {
             396511: string;
             396512: string;
             396513: string;
-            396514: string;
+            396514: string; /** 回放片段列表 */
             396515: string;
             396516: string;
             396517: string;
@@ -2038,14 +2001,15 @@ declare class Theme extends EventEmitter {
             396519: string;
             396520: string;
             396700: string;
-            /**
-             * 录像回放的月份列表 @private
-             */
             396701: string;
             397001: string;
             397002: string;
             397003: string;
-            397004: string;
+            397004: string; /**
+             * 模板请求（getDetail）的中止控制器。
+             * 重新渲染或销毁时中止在途请求，避免请求返回后在已销毁/已切换的 theme 上继续操作。
+             * @private
+             */
             397005: string;
             397006: string;
             397007: string;
@@ -2123,15 +2087,16 @@ declare class Theme extends EventEmitter {
             VIDEO_LEVEL_HEIGH: string;
             VIDEO_LEVEL_SUPER: string;
             VIDEO_LEVEL_EXTREME: string;
-            /**
-             * 视频信息
+            VIDEO_LEVEL_3K: string;
+            VIDEO_LEVEL_4k: string; /**
+             * 视频分辨率 宽
+             *
              * @version 3.1.2
+             *
              * ```ts
-             * theme.videoInfo // ThemeVideoInfo
+             * theme.videoWidth // number
              * ```
              */
-            VIDEO_LEVEL_3K: string;
-            VIDEO_LEVEL_4k: string;
             RESET_THEME: string;
             BTN_PLAY: string;
             BTN_PAUSE: string;
@@ -2204,14 +2169,7 @@ declare class Theme extends EventEmitter {
             WEB_FULLSCREEN: string;
             WEB_FULLSCREEN_EXIT: string;
             DESTROY: string;
-            GET_CAPACITY: string; /**
-             * 静音
-             * @example
-             * ```ts
-             * // 事件监听
-             * theme.on(Theme.EVENTS.volumechange, (volume: number, muted: boolean) => {})
-             * ```
-             */
+            GET_CAPACITY: string;
             GET_PTZ_STATUS: string;
             GET_PTZ_STATUS_FAILED: string;
             MOBILE_HIDE_PTZ: string;
@@ -2741,7 +2699,7 @@ declare class Theme extends EventEmitter {
      * @param url 录像 url
      * @returns {"rec" | "cloudRecord" | "cloudRec" | ""} 录像类型， rec: 录像， cloudRec: 云录像， cloudRecord: 云录制
      */
-    protected _getRecType(url: string): "" | "cloudRec" | "cloudRecord" | "rec";
+    protected _getRecType(url: string): "" | "rec" | "cloudRec" | "cloudRecord";
     private resetControl;
     /**
      * 窗口全屏后旋转 90度判断， 然后设置控件已经旋转 90度， 为了解决控件交互问题

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ezuikit/player-theme",
-  "version": "3.1.3-beta.3",
+  "version": "3.1.4-beta.1",
   "description": "player theme",
   "title": "theme",
   "main": "dist/index.cjs",