@glitchlab/vue-video-player 1.5.0 → 1.6.0
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/README.md +112 -15
- package/dist/HLSPlayer.vue.d.ts +4 -0
- package/dist/HLSPlayer.vue.d.ts.map +1 -1
- package/dist/VideoPlayer.vue.d.ts +9 -0
- package/dist/VideoPlayer.vue.d.ts.map +1 -1
- package/dist/components/ControlBar.vue.d.ts +24 -0
- package/dist/components/ControlBar.vue.d.ts.map +1 -1
- package/dist/components/{IconQuality.vue.d.ts → IconAlert.vue.d.ts} +1 -1
- package/dist/components/IconAlert.vue.d.ts.map +1 -0
- package/dist/components/IconCheck.vue.d.ts +16 -0
- package/dist/components/IconCheck.vue.d.ts.map +1 -0
- package/dist/components/IconChevronRight.vue.d.ts +16 -0
- package/dist/components/IconChevronRight.vue.d.ts.map +1 -0
- package/dist/components/IconGear.vue.d.ts +16 -0
- package/dist/components/IconGear.vue.d.ts.map +1 -0
- package/dist/components/IconRefresh.vue.d.ts +16 -0
- package/dist/components/{IconQuality.vue.d.ts.map → IconRefresh.vue.d.ts.map} +1 -1
- package/dist/components/SettingsMenu.vue.d.ts +61 -0
- package/dist/components/SettingsMenu.vue.d.ts.map +1 -0
- package/dist/index.cjs +3 -3
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.mjs +1767 -1276
- package/dist/index.mjs.map +1 -1
- package/dist/style.css +1 -1
- package/dist/utils/caption-style.d.ts +17 -0
- package/dist/utils/caption-style.d.ts.map +1 -0
- package/dist/utils/preferences.d.ts +26 -0
- package/dist/utils/preferences.d.ts.map +1 -0
- package/dist/utils/theme.d.ts +15 -0
- package/dist/utils/theme.d.ts.map +1 -0
- package/dist/utils/types.d.ts +46 -0
- package/dist/utils/types.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/style.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* @glitchlab/vue-video-player styles
|
|
3
3
|
* Scoped under .gvp-root — no global resets, no theme tokens, safe for any host.
|
|
4
|
-
*/.gvp-root{position:relative;overflow:hidden;border-radius:1.5rem;background-color:#1717174d;box-shadow:0 25px 50px -12px #00000040;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px;margin-left:auto;margin-right:auto;width:100%;box-sizing:border-box}.gvp-root *,.gvp-root *:before,.gvp-root *:after{box-sizing:border-box}.gvp-root:fullscreen,.gvp-root:-webkit-full-screen{width:100vw!important;max-width:none;height:100vh;aspect-ratio:auto!important;border-radius:0}.gvp-root:fullscreen .gvp-video,.gvp-root:-webkit-full-screen .gvp-video{object-fit:contain}.gvp-video{height:100%;width:100%;object-fit:cover;display:block}.gvp-youtube{border:0;object-fit:contain}.gvp-vignette{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(to top right,#00000059,#0000,#00000059)}.gvp-bottom-fade{pointer-events:none;position:absolute;bottom:0;left:0;right:0;height:4rem;background-image:linear-gradient(to top,rgb(0 0 0 / .35),transparent)}.gvp-toggle{position:absolute;left:1rem;top:1rem;z-index:10}.gvp-toggle-pill{display:flex;align-items:center;overflow:hidden;border-radius:1rem;background-color:#fffffff2;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:1px solid rgb(0 0 0 / .05);outline-offset:-1px}.gvp-toggle-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;cursor:pointer;background:transparent;border:0;color:#737373;transition:color .15s ease;font-family:inherit}.gvp-toggle-btn:hover{color:#404040}.gvp-toggle-btn.is-active{color:#5b21b6}.gvp-toggle-divider{height:1.75rem;width:1px;background-color:#e5e5e5}.gvp-close{position:absolute;right:1rem;top:1rem;display:grid;place-items:center;height:2.5rem;width:2.5rem;border:0;border-radius:9999px;background-color:#00000059;color:#fff;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;cursor:pointer;z-index:10;transition:background-color .15s ease}.gvp-close:hover{background-color:#00000080}.gvp-play-wrap{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;z-index:10}.gvp-play{position:relative;display:grid;place-items:center;height:3.5rem;width:3.5rem;border:0;border-radius:9999px;cursor:pointer;outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;background-color:#5b21b680;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;transition:background-color .2s ease,opacity .2s ease;color:#fff}.gvp-play:hover{background-color:#5b21b6e6}.gvp-tooltip{position:absolute;top:-3rem;left:50%;transform:translate(-50%);white-space:nowrap;border-radius:.75rem;background-color:#000000b3;padding:.375rem .75rem;font-size:.75rem;line-height:1rem;color:#fff;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.gvp-audio{position:absolute;right:1rem;bottom:1rem;z-index:10}.gvp-audio-btn{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .625rem;border:0;border-radius:.625rem;background-color:#00000073;color:#fff;font-size:.8125rem;font-weight:500;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;transition:background-color .15s ease;font-family:inherit;max-width:12rem}.gvp-audio-btn:hover{background-color:#0009}.gvp-audio-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gvp-audio-menu{position:absolute;right:0;bottom:calc(100% + .375rem);margin:0;padding:.25rem;list-style:none;min-width:100%;max-height:12rem;overflow-y:auto;border-radius:.625rem;background-color:#000000bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;box-shadow:0 10px 15px -3px #0000004d}.gvp-audio-menu-item{display:block;width:100%;text-align:left;border:0;background:transparent;color:#fff;font-size:.8125rem;padding:.375rem .625rem;border-radius:.375rem;cursor:pointer;white-space:nowrap;font-family:inherit}.gvp-audio-menu-item:hover{background-color:#ffffff1f}.gvp-audio-menu-item.is-active{background-color:#5b21b699}.gvp-icon{display:block}.gvp-controls{position:absolute;left:0;right:0;bottom:0;padding:1.5rem 1rem .625rem;background-image:linear-gradient(to top,rgb(0 0 0 / .55),transparent);color:#fff;z-index:5;opacity:1;transition:opacity .2s ease;pointer-events:auto}.gvp-controls.is-hidden{opacity:0;pointer-events:none}.gvp-controls-row{display:flex;align-items:center;gap:.75rem}.gvp-click-layer{position:absolute;top:0;right:0;bottom:0;left:0;border:0;background:transparent;cursor:pointer;z-index:2;padding:0;margin:0;color:inherit;font:inherit}.gvp-click-layer:focus-visible{outline:2px solid rgb(255 255 255 / .5);outline-offset:-2px}.gvp-ctrl-btn{display:inline-grid;place-items:center;width:2rem;height:2rem;border:0;border-radius:.5rem;background:transparent;color:#fff;cursor:pointer;transition:background-color .15s ease,color .15s ease;font-family:inherit;flex-shrink:0}.gvp-ctrl-btn:hover{background-color:#ffffff26}.gvp-ctrl-btn:focus-visible{outline:2px solid rgb(255 255 255 / .6);outline-offset:1px}.gvp-ctrl-btn:disabled{opacity:.35;cursor:not-allowed}.gvp-ctrl-btn:disabled:hover{background-color:transparent}.gvp-ctrl-btn.is-active{color:#a78bfa}.gvp-seek{position:relative;flex:1 1 auto;min-width:0;height:1.25rem;display:flex;align-items:center}.gvp-seek-track{position:relative;width:100%;height:.25rem;background-color:#ffffff40;border-radius:9999px;overflow:hidden}.gvp-seek-buffered{position:absolute;top:0;right:0;bottom:0;left:0;width:0;background-color:#ffffff59;transition:width .1s linear}.gvp-seek-progress{position:absolute;top:0;right:0;bottom:0;left:0;width:0;background-color:#5b21b6;transition:width .1s linear}.gvp-seek-input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent;opacity:0}.gvp-seek-input:disabled{cursor:not-allowed}.gvp-seek-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:.875rem;height:.875rem;border-radius:9999px;background:#fff;border:0;cursor:pointer}.gvp-seek-input::-moz-range-thumb{width:.875rem;height:.875rem;border-radius:9999px;background:#fff;border:0;cursor:pointer}.gvp-seek:hover .gvp-seek-input{opacity:1}.gvp-seek-preview{position:absolute;bottom:1.5rem;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:.25rem;pointer-events:none;z-index:2}.gvp-seek-preview-thumb{background-repeat:no-repeat;border-radius:.25rem;border:2px solid rgb(255 255 255 / .9);box-shadow:0 2px 8px #00000080}.gvp-seek-preview-time{font-size:.6875rem;font-variant-numeric:tabular-nums;color:#fff;background-color:#000c;padding:.0625rem .375rem;border-radius:.25rem}.gvp-seek-preview-chapter{font-size:.6875rem;font-weight:600;color:#fff;background-color:#000c;padding:.0625rem .375rem;border-radius:.25rem;max-width:12rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gvp-seek-preview:not(.has-thumb) .gvp-seek-preview-time,.gvp-seek-preview:not(.has-thumb) .gvp-seek-preview-chapter{background-color:#000000e6}.gvp-seek-chapter-tick{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background-color:#0000008c;pointer-events:none}.gvp-time{font-size:.75rem;color:#ffffffe6;font-variant-numeric:tabular-nums;flex-shrink:0;white-space:nowrap}.gvp-volume{display:inline-flex;align-items:center;flex-shrink:0}.gvp-volume-slider-wrap{position:relative;height:1.25rem;display:flex;align-items:center;width:0;overflow:hidden;transition:width .2s ease,margin-left .2s ease;margin-left:0}.gvp-volume.is-expandable:hover .gvp-volume-slider-wrap,.gvp-volume.is-expandable:focus-within .gvp-volume-slider-wrap{width:4.5rem;margin-left:.25rem}.gvp-volume-track{position:relative;width:100%;height:.25rem;background-color:#ffffff40;border-radius:9999px;overflow:hidden}.gvp-volume-fill{position:absolute;top:0;right:0;bottom:0;left:0;width:0;background-color:#fff;transition:width 80ms linear}.gvp-volume-input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent;opacity:0}.gvp-volume-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:.75rem;height:.75rem;border-radius:9999px;background:#fff;border:0;cursor:pointer}.gvp-volume-input::-moz-range-thumb{width:.75rem;height:.75rem;border-radius:9999px;background:#fff;border:0;cursor:pointer}.gvp-volume:hover .gvp-volume-input,.gvp-volume:focus-within .gvp-volume-input{opacity:1}.gvp-speed{position:absolute;left:1rem;bottom:1rem;z-index:10}.gvp-controls-row .gvp-speed{position:relative;left:auto;bottom:auto;z-index:auto;flex-shrink:0}.gvp-speed-btn{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .625rem;border:0;border-radius:.625rem;background-color:#00000073;color:#fff;font-size:.8125rem;font-weight:500;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;transition:background-color .15s ease;font-family:inherit}.gvp-speed-btn:hover{background-color:#0009}.gvp-controls-row .gvp-speed-btn{background-color:transparent;outline:none;border-radius:.5rem;gap:.2rem;width:auto;padding:0 .375rem;height:2rem}.gvp-controls-row .gvp-speed-btn:hover{background-color:#ffffff26}.gvp-speed-label{font-size:.8125rem;font-weight:600;font-variant-numeric:tabular-nums}.gvp-controls-row .gvp-speed-label{font-size:.7rem;line-height:1}.gvp-speed-menu{position:absolute;left:0;bottom:calc(100% + .375rem);z-index:20;margin:0;padding:.25rem;list-style:none;min-width:6rem;border-radius:.625rem;background-color:#000000bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;box-shadow:0 10px 15px -3px #0000004d}.gvp-speed-menu-item{display:block;width:100%;text-align:left;border:0;background:transparent;color:#fff;font-size:.8125rem;padding:.375rem .625rem;border-radius:.375rem;cursor:pointer;white-space:nowrap;font-family:inherit}.gvp-speed-menu-item:hover{background-color:#ffffff1f}.gvp-speed-menu-item.is-active{background-color:#5b21b699}.gvp-quality{position:relative;flex-shrink:0}.gvp-quality-btn{display:inline-flex;align-items:center;gap:.2rem;width:auto;padding:0 .375rem}.gvp-quality-label{font-size:.7rem;font-weight:600;line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}.gvp-quality-menu{position:absolute;bottom:calc(100% + .375rem);left:50%;transform:translate(-50%);margin:0;padding:.25rem;list-style:none;min-width:7rem;border-radius:.625rem;background-color:#000000bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;box-shadow:0 10px 15px -3px #0000004d;z-index:20}.gvp-quality-menu-item{display:block;width:100%;text-align:left;border:0;background:transparent;color:#fff;font-size:.8125rem;padding:.375rem .625rem;border-radius:.375rem;cursor:pointer;white-space:nowrap;font-family:inherit}.gvp-quality-menu-item:hover{background-color:#ffffff1f}.gvp-quality-menu-item.is-active{background-color:#5b21b699}.gvp-pip-btn{position:absolute;right:1rem;top:4rem;display:grid;place-items:center;width:2.25rem;height:2.25rem;border:0;border-radius:.625rem;background-color:#00000073;color:#fff;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;transition:background-color .15s ease,color .15s ease;z-index:10}.gvp-pip-btn:hover{background-color:#0009}.gvp-pip-btn.is-active{color:#a78bfa}.gvp-captions{position:absolute;left:50%;transform:translate(-50%);bottom:1rem;z-index:10}.gvp-controls-row .gvp-captions{position:relative;left:auto;bottom:auto;transform:none;z-index:auto;flex-shrink:0}.gvp-captions-btn{display:inline-flex;align-items:center;justify-content:center;padding:.375rem .5rem;border:0;border-radius:.625rem;background-color:#00000073;color:#fff;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;transition:background-color .15s ease,color .15s ease}.gvp-captions-btn:hover{background-color:#0009}.gvp-controls-row .gvp-captions-btn{display:inline-grid;place-items:center;width:2rem;height:2rem;background-color:transparent;outline:none;border-radius:.5rem;padding:0}.gvp-controls-row .gvp-captions-btn:hover{background-color:#ffffff26}.gvp-captions-btn.is-active{color:#a78bfa}.gvp-captions-menu{position:absolute;bottom:calc(100% + .375rem);left:50%;transform:translate(-50%);margin:0;padding:.25rem;list-style:none;min-width:8rem;border-radius:.625rem;background-color:#000000bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;box-shadow:0 10px 15px -3px #0000004d}.gvp-captions-menu-item{display:block;width:100%;text-align:left;border:0;background:transparent;color:#fff;font-size:.8125rem;padding:.375rem .625rem;border-radius:.375rem;cursor:pointer;white-space:nowrap;font-family:inherit}.gvp-captions-menu-item:hover{background-color:#ffffff1f}.gvp-captions-menu-item.is-active{background-color:#5b21b699}
|
|
4
|
+
*/.gvp-root{--gvp-accent-rgb: 91 33 182;--gvp-accent: rgb(var(--gvp-accent-rgb));--gvp-radius: 1.5rem;position:relative;overflow:hidden;border-radius:var(--gvp-radius);background-color:#1717174d;box-shadow:0 25px 50px -12px #00000040;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px;margin-left:auto;margin-right:auto;width:100%;box-sizing:border-box}.gvp-root *,.gvp-root *:before,.gvp-root *:after{box-sizing:border-box}.gvp-root:fullscreen,.gvp-root:-webkit-full-screen{width:100vw!important;max-width:none;height:100vh;aspect-ratio:auto!important;border-radius:0}.gvp-root:fullscreen .gvp-video,.gvp-root:-webkit-full-screen .gvp-video{object-fit:contain}.gvp-video{height:100%;width:100%;object-fit:cover;display:block}.gvp-youtube{border:0;object-fit:contain}.gvp-vignette{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(to top right,#00000059,#0000,#00000059)}.gvp-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.gvp-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;pointer-events:none}.gvp-spinner{width:2.75rem;height:2.75rem;border-radius:9999px;border:3px solid rgb(255 255 255 / .25);border-top-color:#fff;animation:gvp-spin .8s linear infinite}@keyframes gvp-spin{to{transform:rotate(360deg)}}.gvp-error{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;background-color:#000c;color:#fff;text-align:center;padding:1rem}.gvp-error-icon{color:#f87171}.gvp-error-text{margin:0;font-size:.9375rem}.gvp-error-retry{display:inline-flex;align-items:center;gap:.375rem;padding:.5rem 1rem;border:0;border-radius:.5rem;background-color:#fff;color:#111;font-family:inherit;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .15s ease}.gvp-error-retry:hover{background-color:#e5e5e5}.gvp-error-retry:focus-visible{outline:2px solid rgb(255 255 255 / .7);outline-offset:2px}@media (prefers-reduced-motion: reduce){.gvp-spinner{animation-duration:2s}}.gvp-bottom-fade{pointer-events:none;position:absolute;bottom:0;left:0;right:0;height:4rem;background-image:linear-gradient(to top,rgb(0 0 0 / .35),transparent)}.gvp-toggle{position:absolute;left:1rem;top:1rem;z-index:10}.gvp-toggle-pill{display:flex;align-items:center;overflow:hidden;border-radius:1rem;background-color:#fffffff2;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:1px solid rgb(0 0 0 / .05);outline-offset:-1px}.gvp-toggle-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;cursor:pointer;background:transparent;border:0;color:#737373;transition:color .15s ease;font-family:inherit}.gvp-toggle-btn:hover{color:#404040}.gvp-toggle-btn.is-active{color:var(--gvp-accent)}.gvp-toggle-divider{height:1.75rem;width:1px;background-color:#e5e5e5}.gvp-close{position:absolute;right:1rem;top:1rem;display:grid;place-items:center;height:2.5rem;width:2.5rem;border:0;border-radius:9999px;background-color:#00000059;color:#fff;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;cursor:pointer;z-index:10;transition:background-color .15s ease}.gvp-close:hover{background-color:#00000080}.gvp-play-wrap{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;z-index:10}.gvp-play{position:relative;display:grid;place-items:center;height:3.5rem;width:3.5rem;border:0;border-radius:9999px;cursor:pointer;outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;background-color:rgb(var(--gvp-accent-rgb) / .5);box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;transition:background-color .2s ease,opacity .2s ease;color:#fff}.gvp-play:hover{background-color:rgb(var(--gvp-accent-rgb) / .9)}.gvp-tooltip{position:absolute;top:-3rem;left:50%;transform:translate(-50%);white-space:nowrap;border-radius:.75rem;background-color:#000000b3;padding:.375rem .75rem;font-size:.75rem;line-height:1rem;color:#fff;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:1px solid rgb(255 255 255 / .1);outline-offset:-1px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.gvp-audio{position:absolute;right:1rem;bottom:1rem;z-index:10}.gvp-audio-btn{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .625rem;border:0;border-radius:.625rem;background-color:#00000073;color:#fff;font-size:.8125rem;font-weight:500;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;transition:background-color .15s ease;font-family:inherit;max-width:12rem}.gvp-audio-btn:hover{background-color:#0009}.gvp-audio-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gvp-audio-menu{position:absolute;right:0;bottom:calc(100% + .375rem);margin:0;padding:.25rem;list-style:none;min-width:100%;max-height:12rem;overflow-y:auto;border-radius:.625rem;background-color:#000000bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;box-shadow:0 10px 15px -3px #0000004d}.gvp-audio-menu-item{display:block;width:100%;text-align:left;border:0;background:transparent;color:#fff;font-size:.8125rem;padding:.375rem .625rem;border-radius:.375rem;cursor:pointer;white-space:nowrap;font-family:inherit}.gvp-audio-menu-item:hover{background-color:#ffffff1f}.gvp-audio-menu-item.is-active{background-color:rgb(var(--gvp-accent-rgb) / .6)}.gvp-icon{display:block}.gvp-controls{position:absolute;left:0;right:0;bottom:0;padding:1.5rem 1rem .625rem;background-image:linear-gradient(to top,rgb(0 0 0 / .55),transparent);color:#fff;z-index:5;opacity:1;transition:opacity .2s ease;pointer-events:auto}.gvp-controls.is-hidden{opacity:0;pointer-events:none}.gvp-controls-seek{display:flex;align-items:center;margin-bottom:.25rem}.gvp-controls-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.gvp-controls-left,.gvp-controls-right{display:flex;align-items:center;gap:.375rem;min-width:0}.gvp-controls-left{flex:1 1 auto}.gvp-controls-right{flex:0 0 auto}.gvp-click-layer{position:absolute;top:0;right:0;bottom:0;left:0;border:0;background:transparent;cursor:pointer;z-index:2;padding:0;margin:0;color:inherit;font:inherit}.gvp-click-layer:focus-visible{outline:2px solid rgb(255 255 255 / .5);outline-offset:-2px}.gvp-ctrl-btn{display:inline-grid;place-items:center;width:2rem;height:2rem;border:0;border-radius:.5rem;background:transparent;color:#fff;cursor:pointer;transition:background-color .15s ease,color .15s ease;font-family:inherit;flex-shrink:0}.gvp-ctrl-btn:hover{background-color:#ffffff26}.gvp-ctrl-btn:focus-visible{outline:2px solid rgb(255 255 255 / .6);outline-offset:1px}.gvp-ctrl-btn:disabled{opacity:.35;cursor:not-allowed}.gvp-ctrl-btn:disabled:hover{background-color:transparent}.gvp-ctrl-btn.is-active{color:#a78bfa}.gvp-seek{position:relative;flex:1 1 auto;min-width:0;height:1.25rem;display:flex;align-items:center}.gvp-seek-track{position:relative;width:100%;height:.25rem;background-color:#ffffff40;border-radius:9999px;overflow:hidden}.gvp-seek-buffered{position:absolute;top:0;right:0;bottom:0;left:0;width:0;background-color:#ffffff59;transition:width .1s linear}.gvp-seek-progress{position:absolute;top:0;right:0;bottom:0;left:0;width:0;background-color:var(--gvp-accent);transition:width .1s linear}.gvp-seek-input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent;opacity:0}.gvp-seek-input:disabled{cursor:not-allowed}.gvp-seek-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:.875rem;height:.875rem;border-radius:9999px;background:#fff;border:0;cursor:pointer}.gvp-seek-input::-moz-range-thumb{width:.875rem;height:.875rem;border-radius:9999px;background:#fff;border:0;cursor:pointer}.gvp-seek:hover .gvp-seek-input,.gvp-seek-input:focus-visible{opacity:1}.gvp-seek-preview{position:absolute;bottom:1.5rem;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:.25rem;pointer-events:none;z-index:2}.gvp-seek-preview-thumb{background-repeat:no-repeat;border-radius:.25rem;border:2px solid rgb(255 255 255 / .9);box-shadow:0 2px 8px #00000080}.gvp-seek-preview-time{font-size:.6875rem;font-variant-numeric:tabular-nums;color:#fff;background-color:#000c;padding:.0625rem .375rem;border-radius:.25rem}.gvp-seek-preview-chapter{font-size:.6875rem;font-weight:600;color:#fff;background-color:#000c;padding:.0625rem .375rem;border-radius:.25rem;max-width:12rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gvp-seek-preview:not(.has-thumb) .gvp-seek-preview-time,.gvp-seek-preview:not(.has-thumb) .gvp-seek-preview-chapter{background-color:#000000e6}.gvp-seek-chapter-tick{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background-color:#0000008c;pointer-events:none}.gvp-time{font-size:.75rem;color:#ffffffe6;font-variant-numeric:tabular-nums;flex-shrink:0;white-space:nowrap}.gvp-live{display:inline-flex;align-items:center;gap:.375rem;flex-shrink:0;padding:.1875rem .5rem;border:0;border-radius:.375rem;background-color:#ffffff26;color:#ffffffb3;font-family:inherit;font-size:.6875rem;font-weight:700;letter-spacing:.05em;cursor:pointer;transition:background-color .15s ease,color .15s ease}.gvp-live:hover{background-color:#ffffff40;color:#fff}.gvp-live.is-at-edge{background-color:transparent;color:#fff;cursor:default}.gvp-live-dot{width:.5rem;height:.5rem;border-radius:9999px;background-color:#787878}.gvp-live.is-at-edge .gvp-live-dot{background-color:#ef4444;animation:gvp-live-pulse 2s ease-in-out infinite}@keyframes gvp-live-pulse{0%,to{opacity:1}50%{opacity:.4}}@media (prefers-reduced-motion: reduce){.gvp-live.is-at-edge .gvp-live-dot{animation:none}}.gvp-volume{display:inline-flex;align-items:center;flex-shrink:0}.gvp-volume-slider-wrap{position:relative;height:1.25rem;display:flex;align-items:center;width:0;overflow:hidden;transition:width .2s ease,margin-left .2s ease;margin-left:0}.gvp-volume.is-expandable:hover .gvp-volume-slider-wrap,.gvp-volume.is-expandable:focus-within .gvp-volume-slider-wrap{width:4.5rem;margin-left:.25rem}.gvp-volume-track{position:relative;width:100%;height:.25rem;background-color:#ffffff40;border-radius:9999px;overflow:hidden}.gvp-volume-fill{position:absolute;top:0;right:0;bottom:0;left:0;width:0;background-color:#fff;transition:width 80ms linear}.gvp-volume-input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent;opacity:0}.gvp-volume-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:.75rem;height:.75rem;border-radius:9999px;background:#fff;border:0;cursor:pointer}.gvp-volume-input::-moz-range-thumb{width:.75rem;height:.75rem;border-radius:9999px;background:#fff;border:0;cursor:pointer}.gvp-volume:hover .gvp-volume-input,.gvp-volume:focus-within .gvp-volume-input{opacity:1}.gvp-speed{position:absolute;left:1rem;bottom:1rem;z-index:10}.gvp-controls-row .gvp-speed{position:relative;left:auto;bottom:auto;z-index:auto;flex-shrink:0}.gvp-speed-btn{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .625rem;border:0;border-radius:.625rem;background-color:#00000073;color:#fff;font-size:.8125rem;font-weight:500;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;transition:background-color .15s ease;font-family:inherit}.gvp-speed-btn:hover{background-color:#0009}.gvp-controls-row .gvp-speed-btn{background-color:transparent;outline:none;border-radius:.5rem;gap:.2rem;width:auto;padding:0 .375rem;height:2rem}.gvp-controls-row .gvp-speed-btn:hover{background-color:#ffffff26}.gvp-speed-label{font-size:.8125rem;font-weight:600;font-variant-numeric:tabular-nums}.gvp-controls-row .gvp-speed-label{font-size:.7rem;line-height:1}.gvp-speed-menu{position:absolute;left:0;bottom:calc(100% + .375rem);z-index:20;margin:0;padding:.25rem;list-style:none;min-width:6rem;border-radius:.625rem;background-color:#000000bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;box-shadow:0 10px 15px -3px #0000004d}.gvp-speed-menu-item{display:block;width:100%;text-align:left;border:0;background:transparent;color:#fff;font-size:.8125rem;padding:.375rem .625rem;border-radius:.375rem;cursor:pointer;white-space:nowrap;font-family:inherit}.gvp-speed-menu-item:hover{background-color:#ffffff1f}.gvp-speed-menu-item.is-active{background-color:rgb(var(--gvp-accent-rgb) / .6)}.gvp-quality{position:relative;flex-shrink:0}.gvp-quality-btn{display:inline-flex;align-items:center;gap:.2rem;width:auto;padding:0 .375rem}.gvp-quality-label{font-size:.7rem;font-weight:600;line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}.gvp-quality-menu{position:absolute;bottom:calc(100% + .375rem);left:50%;transform:translate(-50%);margin:0;padding:.25rem;list-style:none;min-width:7rem;border-radius:.625rem;background-color:#000000bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;box-shadow:0 10px 15px -3px #0000004d;z-index:20}.gvp-quality-menu-item{display:block;width:100%;text-align:left;border:0;background:transparent;color:#fff;font-size:.8125rem;padding:.375rem .625rem;border-radius:.375rem;cursor:pointer;white-space:nowrap;font-family:inherit}.gvp-quality-menu-item:hover{background-color:#ffffff1f}.gvp-quality-menu-item.is-active{background-color:rgb(var(--gvp-accent-rgb) / .6)}.gvp-pip-btn{position:absolute;right:1rem;top:4rem;display:grid;place-items:center;width:2.25rem;height:2.25rem;border:0;border-radius:.625rem;background-color:#00000073;color:#fff;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;transition:background-color .15s ease,color .15s ease;z-index:10}.gvp-pip-btn:hover{background-color:#0009}.gvp-pip-btn.is-active{color:#a78bfa}.gvp-captions{position:absolute;left:50%;transform:translate(-50%);bottom:1rem;z-index:10}.gvp-controls-row .gvp-captions{position:relative;left:auto;bottom:auto;transform:none;z-index:auto;flex-shrink:0}.gvp-captions-btn{display:inline-flex;align-items:center;justify-content:center;padding:.375rem .5rem;border:0;border-radius:.625rem;background-color:#00000073;color:#fff;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;transition:background-color .15s ease,color .15s ease}.gvp-captions-btn:hover{background-color:#0009}.gvp-controls-row .gvp-captions-btn{display:inline-grid;place-items:center;width:2rem;height:2rem;background-color:transparent;outline:none;border-radius:.5rem;padding:0}.gvp-controls-row .gvp-captions-btn:hover{background-color:#ffffff26}.gvp-captions-btn.is-active{color:#a78bfa}.gvp-captions-menu{position:absolute;bottom:calc(100% + .375rem);left:50%;transform:translate(-50%);margin:0;padding:.25rem;list-style:none;min-width:8rem;border-radius:.625rem;background-color:#000000bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;box-shadow:0 10px 15px -3px #0000004d}.gvp-captions-menu-item{display:block;width:100%;text-align:left;border:0;background:transparent;color:#fff;font-size:.8125rem;padding:.375rem .625rem;border-radius:.375rem;cursor:pointer;white-space:nowrap;font-family:inherit}.gvp-captions-menu-item:hover{background-color:#ffffff1f}.gvp-captions-menu-item.is-active{background-color:rgb(var(--gvp-accent-rgb) / .6)}.gvp-seek-input:focus-visible,.gvp-volume-input:focus-visible,.gvp-toggle-btn:focus-visible,.gvp-close:focus-visible,.gvp-audio-btn:focus-visible,.gvp-speed-btn:focus-visible,.gvp-quality-btn:focus-visible,.gvp-audio-menu-item:focus-visible,.gvp-speed-menu-item:focus-visible,.gvp-quality-menu-item:focus-visible,.gvp-captions-menu-item:focus-visible{outline:2px solid rgb(255 255 255 / .85);outline-offset:2px}.gvp-audio-menu-item:focus-visible,.gvp-speed-menu-item:focus-visible,.gvp-quality-menu-item:focus-visible,.gvp-captions-menu-item:focus-visible{outline-offset:-2px}@media (prefers-reduced-motion: reduce){.gvp-controls,.gvp-seek-buffered,.gvp-seek-progress,.gvp-ctrl-btn,.gvp-toggle-btn,.gvp-error-retry,.gvp-volume-slider-wrap,.gvp-volume-input{transition-duration:.01ms!important}}.gvp-mini-placeholder{display:block}.gvp-mini-sentinel{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:-1}.gvp-root.gvp-mini{position:fixed;width:22rem!important;max-width:40vw;z-index:9999;box-shadow:0 20px 40px -8px #00000080;animation:gvp-mini-in .2s ease}.gvp-root.gvp-mini-bottom-right{right:1rem;bottom:1rem}.gvp-root.gvp-mini-bottom-left{left:1rem;bottom:1rem}.gvp-root.gvp-mini-top-right{right:1rem;top:1rem}.gvp-root.gvp-mini-top-left{left:1rem;top:1rem}@keyframes gvp-mini-in{0%{opacity:0;transform:translateY(1rem)}}.gvp-mini-close{position:absolute;right:.375rem;top:.375rem;display:grid;place-items:center;width:1.75rem;height:1.75rem;border:0;border-radius:9999px;background-color:#0009;color:#fff;cursor:pointer;z-index:20;transition:background-color .15s ease}.gvp-mini-close:hover{background-color:#000000d9}.gvp-mini-close:focus-visible{outline:2px solid rgb(255 255 255 / .85);outline-offset:2px}@media (prefers-reduced-motion: reduce){.gvp-root.gvp-mini{animation:none}}.gvp-ambient-wrap{position:relative;margin-left:auto;margin-right:auto}.gvp-ambient-canvas{position:absolute;left:50%;top:50%;width:100%;height:100%;transform:translate(-50%,-50%) scale(1.15);filter:blur(48px) saturate(1.6);opacity:.7;pointer-events:none;z-index:0}.gvp-ambient-wrap.is-ambient .gvp-root{position:relative;z-index:1}.gvp-settings{position:relative;flex-shrink:0}.gvp-settings-menu{position:absolute;bottom:calc(100% + .375rem);right:0;min-width:13rem;max-height:16rem;overflow-y:auto;padding:.25rem;border-radius:.625rem;background-color:#000c;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);outline:1px solid rgb(255 255 255 / .15);outline-offset:-1px;box-shadow:0 10px 15px -3px #00000059;z-index:20}.gvp-settings-row{display:flex;align-items:center;gap:.5rem;width:100%;border:0;background:transparent;color:#fff;font-family:inherit;font-size:.8125rem;padding:.5rem .625rem;border-radius:.375rem;cursor:pointer;text-align:left}.gvp-settings-row:hover{background-color:#ffffff1f}.gvp-settings-row-label{flex:1}.gvp-settings-row-value{color:#fff9;font-variant-numeric:tabular-nums;white-space:nowrap}.gvp-settings-chevron{color:#ffffff80;flex-shrink:0}.gvp-settings-back{display:flex;align-items:center;gap:.25rem;width:100%;border:0;background:transparent;color:#fff;font-family:inherit;font-size:.8125rem;font-weight:600;padding:.5rem .625rem .5rem .25rem;margin-bottom:.125rem;border-bottom:1px solid rgb(255 255 255 / .12);border-radius:0;cursor:pointer;text-align:left}.gvp-settings-back-icon{transform:rotate(180deg);color:#fff9}.gvp-settings-back:hover,.gvp-settings-back:hover .gvp-settings-back-icon{color:#fff}.gvp-settings-option{display:flex;align-items:center;gap:.5rem;width:100%;border:0;background:transparent;color:#fff;font-family:inherit;font-size:.8125rem;padding:.5rem .625rem;border-radius:.375rem;cursor:pointer;text-align:left}.gvp-settings-option:hover{background-color:#ffffff1f}.gvp-settings-check{display:inline-flex;width:.875rem;flex-shrink:0;color:var(--gvp-accent)}.gvp-settings-row:focus-visible,.gvp-settings-back:focus-visible,.gvp-settings-option:focus-visible{outline:2px solid rgb(255 255 255 / .85);outline-offset:-2px}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Builds the `::cue` CSS that styles subtitle/caption text. Caption cues can
|
|
3
|
+
* only be styled via the `::cue` pseudo-element — not inline — so the player
|
|
4
|
+
* injects a scoped stylesheet keyed to a unique class on the video element.
|
|
5
|
+
*/
|
|
6
|
+
export interface CaptionStyle {
|
|
7
|
+
fontSize?: string;
|
|
8
|
+
textColor?: string;
|
|
9
|
+
backgroundColor?: string;
|
|
10
|
+
backgroundOpacity?: number;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* Build a `::cue` rule for the given video class. Returns an empty string when
|
|
14
|
+
* no style properties are set, so the caller can skip injecting a stylesheet.
|
|
15
|
+
*/
|
|
16
|
+
export declare function buildCaptionCss(videoClass: string, style: CaptionStyle | undefined): string;
|
|
17
|
+
//# sourceMappingURL=caption-style.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"caption-style.d.ts","sourceRoot":"","sources":["../../src/utils/caption-style.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,MAAM,WAAW,YAAY;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC9B;AA+BD;;;GAGG;AACH,wBAAgB,eAAe,CAC3B,UAAU,EAAE,MAAM,EAClB,KAAK,EAAE,YAAY,GAAG,SAAS,GAChC,MAAM,CAmBR"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Opt-in playback-preference persistence. When the player is given a
|
|
3
|
+
* `persistKey`, volume / mute / playback speed and the last playback position
|
|
4
|
+
* are stored in `localStorage` so they survive reloads and revisits.
|
|
5
|
+
*
|
|
6
|
+
* Preferences (volume/mute/speed) are global to the key. The resume position
|
|
7
|
+
* is stored per source URL, so a key shared across videos resumes each one
|
|
8
|
+
* independently.
|
|
9
|
+
*/
|
|
10
|
+
/** Player-wide preferences, shared across every source under one key. */
|
|
11
|
+
export interface PlayerPreferences {
|
|
12
|
+
volume?: number;
|
|
13
|
+
muted?: boolean;
|
|
14
|
+
speed?: number;
|
|
15
|
+
/** Resume positions keyed by source URL. */
|
|
16
|
+
positions?: Record<string, number>;
|
|
17
|
+
}
|
|
18
|
+
/** Read the stored preferences for a key. Returns `{}` if absent/unavailable. */
|
|
19
|
+
export declare function loadPreferences(persistKey: string): PlayerPreferences;
|
|
20
|
+
/** Merge a partial update into the stored preferences for a key. */
|
|
21
|
+
export declare function savePreferences(persistKey: string, patch: Partial<PlayerPreferences>): void;
|
|
22
|
+
/** Store the resume position (seconds) for one source under a key. */
|
|
23
|
+
export declare function savePosition(persistKey: string, src: string, position: number): void;
|
|
24
|
+
/** Read the resume position (seconds) for one source. `0` if none. */
|
|
25
|
+
export declare function loadPosition(persistKey: string, src: string): number;
|
|
26
|
+
//# sourceMappingURL=preferences.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"preferences.d.ts","sourceRoot":"","sources":["../../src/utils/preferences.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,yEAAyE;AACzE,MAAM,WAAW,iBAAiB;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4CAA4C;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACtC;AAMD,iFAAiF;AACjF,wBAAgB,eAAe,CAAC,UAAU,EAAE,MAAM,GAAG,iBAAiB,CAUrE;AAED,oEAAoE;AACpE,wBAAgB,eAAe,CAC3B,UAAU,EAAE,MAAM,EAClB,KAAK,EAAE,OAAO,CAAC,iBAAiB,CAAC,GAClC,IAAI,CASN;AAED,sEAAsE;AACtE,wBAAgB,YAAY,CACxB,UAAU,EAAE,MAAM,EAClB,GAAG,EAAE,MAAM,EACX,QAAQ,EAAE,MAAM,GACjB,IAAI,CAUN;AAED,sEAAsE;AACtE,wBAAgB,YAAY,CAAC,UAAU,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAIpE"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Maps a {@link PlayerTheme} onto the CSS custom properties the stylesheet
|
|
3
|
+
* reads (`--gvp-accent-rgb`, `--gvp-radius`, …). Returned as a style object
|
|
4
|
+
* that can be spread onto the player's root element.
|
|
5
|
+
*/
|
|
6
|
+
export interface PlayerTheme {
|
|
7
|
+
accent?: string;
|
|
8
|
+
radius?: string;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* Build the CSS-variable overrides for a theme. Returns an empty object when
|
|
12
|
+
* no theme is given, so it can be spread harmlessly.
|
|
13
|
+
*/
|
|
14
|
+
export declare function themeToCssVars(theme: PlayerTheme | undefined): Record<string, string>;
|
|
15
|
+
//# sourceMappingURL=theme.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/utils/theme.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,MAAM,WAAW,WAAW;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;CACnB;AAsBD;;;GAGG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,WAAW,GAAG,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAkBrF"}
|
package/dist/utils/types.d.ts
CHANGED
|
@@ -1,7 +1,20 @@
|
|
|
1
1
|
import { HlsConfig } from 'hls.js';
|
|
2
|
+
import { PlayerTheme } from './theme';
|
|
2
3
|
|
|
4
|
+
export type { PlayerTheme } from './theme';
|
|
3
5
|
export type DeviceMode = "desktop" | "mobile";
|
|
4
6
|
export type AspectRatio = `${number}/${number}`;
|
|
7
|
+
/** Visual styling for subtitle/caption cue text. */
|
|
8
|
+
export interface CaptionStyle {
|
|
9
|
+
/** Cue font size as a CSS length (e.g. `"1.5em"`, `"20px"`). */
|
|
10
|
+
fontSize?: string;
|
|
11
|
+
/** Cue text color as any CSS color. */
|
|
12
|
+
textColor?: string;
|
|
13
|
+
/** Cue background color as any CSS color. */
|
|
14
|
+
backgroundColor?: string;
|
|
15
|
+
/** Cue background opacity, 0–1. Applied on top of `backgroundColor`. */
|
|
16
|
+
backgroundOpacity?: number;
|
|
17
|
+
}
|
|
5
18
|
/** A single entry in a {@link VideoPlayerProps.playlist}. */
|
|
6
19
|
export interface PlaylistItem {
|
|
7
20
|
/** Video source URL. `.m3u8` URLs are routed through hls.js automatically. */
|
|
@@ -98,6 +111,39 @@ export interface VideoPlayerProps {
|
|
|
98
111
|
end?: number;
|
|
99
112
|
title: string;
|
|
100
113
|
}>;
|
|
114
|
+
/**
|
|
115
|
+
* Opt-in preference persistence. When set, the player saves volume, mute,
|
|
116
|
+
* playback speed and the last playback position to `localStorage` under
|
|
117
|
+
* this key, and restores them on reload. Resume position is tracked per
|
|
118
|
+
* source URL. Omit to disable persistence entirely.
|
|
119
|
+
*/
|
|
120
|
+
persistKey?: string;
|
|
121
|
+
/**
|
|
122
|
+
* Visual styling for subtitle/caption cue text — font size, colors and
|
|
123
|
+
* background. Applied via the `::cue` pseudo-element.
|
|
124
|
+
*/
|
|
125
|
+
captionStyle?: CaptionStyle;
|
|
126
|
+
/**
|
|
127
|
+
* Theme overrides (accent color, corner radius) applied as CSS variables
|
|
128
|
+
* on the player. For deeper customization, override the `.gvp-*` classes
|
|
129
|
+
* or the `--gvp-*` variables directly in your own CSS.
|
|
130
|
+
*/
|
|
131
|
+
theme?: PlayerTheme;
|
|
132
|
+
/**
|
|
133
|
+
* Enable the floating mini-player. When the player scrolls out of view
|
|
134
|
+
* while playing, it docks to a corner of the viewport; it returns when
|
|
135
|
+
* scrolled back in. Defaults to `false`.
|
|
136
|
+
*/
|
|
137
|
+
miniPlayer?: boolean;
|
|
138
|
+
/** Corner the mini-player docks to. Defaults to `"bottom-right"`. */
|
|
139
|
+
miniPlayerPosition?: "bottom-right" | "bottom-left" | "top-right" | "top-left";
|
|
140
|
+
/**
|
|
141
|
+
* Enable ambient mode — a soft, blurred color glow behind the player that
|
|
142
|
+
* samples the current video frame (YouTube's "ambient mode"). Defaults to
|
|
143
|
+
* `false`. The host should give the player some surrounding padding so the
|
|
144
|
+
* glow is visible.
|
|
145
|
+
*/
|
|
146
|
+
ambientMode?: boolean;
|
|
101
147
|
}
|
|
102
148
|
export interface HLSPlayerProps {
|
|
103
149
|
src: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/utils/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/utils/types.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED