@videojs/html 10.0.0-beta.22 → 10.0.0-beta.23
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/cdn/{abort-C9UiBdVU.js → abort-0nUH9HXc.js} +1 -1
- package/cdn/{abort-C9UiBdVU.js.map → abort-0nUH9HXc.js.map} +1 -1
- package/cdn/{abort-DsTff8mS.js → abort-DQxwCs92.js} +1 -1
- package/cdn/{abort-DsTff8mS.js.map → abort-DQxwCs92.js.map} +1 -1
- package/cdn/audio-minimal-ui.dev.js +1 -4
- package/cdn/audio-minimal-ui.js +1 -1
- package/cdn/audio-minimal.dev.js +5 -7
- package/cdn/audio-minimal.dev.js.map +1 -1
- package/cdn/audio-minimal.js +1 -1
- package/cdn/audio-minimal.js.map +1 -1
- package/cdn/audio-ui.dev.js +1 -4
- package/cdn/audio-ui.js +1 -1
- package/cdn/audio.dev.js +4 -6
- package/cdn/audio.dev.js.map +1 -1
- package/cdn/audio.js +1 -1
- package/cdn/audio.js.map +1 -1
- package/cdn/background.dev.js +3 -3
- package/cdn/background.js +1 -1
- package/cdn/background.js.map +1 -1
- package/cdn/{compounds-DD3MYkSc.js → compounds-BHHGcL_P.js} +146 -64
- package/cdn/compounds-BHHGcL_P.js.map +1 -0
- package/cdn/compounds-DJyzXLOB.js +8 -0
- package/cdn/compounds-DJyzXLOB.js.map +1 -0
- package/cdn/{create-player-BKLw7l1a.js → create-player-B-gVAMdr.js} +200 -175
- package/cdn/create-player-B-gVAMdr.js.map +1 -0
- package/cdn/create-player-C5ui1T2i.js +7 -0
- package/cdn/create-player-C5ui1T2i.js.map +1 -0
- package/cdn/hls-DEP0AzDp.js +41 -0
- package/cdn/hls-DEP0AzDp.js.map +1 -0
- package/cdn/{hls-CcSAx_3I.js → hls-DR-Xxpxv.js} +161 -21
- package/cdn/hls-DR-Xxpxv.js.map +1 -0
- package/cdn/hotkey-element-BvI78DTc.js +2 -0
- package/cdn/{hotkey-element-DWWkfH3A.js.map → hotkey-element-BvI78DTc.js.map} +1 -1
- package/cdn/{hotkey-element-BONs_FyJ.js → hotkey-element-oEdY8YLl.js} +24 -18
- package/cdn/{hotkey-element-BONs_FyJ.js.map → hotkey-element-oEdY8YLl.js.map} +1 -1
- package/cdn/live-video-minimal.dev.d.ts +1 -0
- package/cdn/live-video-minimal.dev.js +115 -0
- package/cdn/live-video-minimal.dev.js.map +1 -0
- package/cdn/live-video-minimal.js +2 -0
- package/cdn/live-video-minimal.js.map +1 -0
- package/cdn/live-video.dev.d.ts +1 -0
- package/cdn/live-video.dev.js +130 -0
- package/cdn/live-video.dev.js.map +1 -0
- package/cdn/live-video.js +2 -0
- package/cdn/live-video.js.map +1 -0
- package/cdn/media/dash-video.dev.js +8 -7
- package/cdn/media/dash-video.dev.js.map +1 -1
- package/cdn/media/dash-video.js +6 -6
- package/cdn/media/dash-video.js.map +1 -1
- package/cdn/media/hls-video.dev.js +4 -4
- package/cdn/media/hls-video.js +1 -1
- package/cdn/media/hls-video.js.map +1 -1
- package/cdn/media/mux-audio.dev.js +8 -6
- package/cdn/media/mux-audio.dev.js.map +1 -1
- package/cdn/media/mux-audio.js +1 -1
- package/cdn/media/mux-audio.js.map +1 -1
- package/cdn/media/mux-video.dev.js +8 -6
- package/cdn/media/mux-video.dev.js.map +1 -1
- package/cdn/media/mux-video.js +1 -1
- package/cdn/media/mux-video.js.map +1 -1
- package/cdn/media/native-hls-video.dev.js +4 -4
- package/cdn/media/native-hls-video.js +1 -1
- package/cdn/media/native-hls-video.js.map +1 -1
- package/cdn/media/simple-hls-video.dev.js +11 -5
- package/cdn/media/simple-hls-video.dev.js.map +1 -1
- package/cdn/media/simple-hls-video.js +6 -6
- package/cdn/media/simple-hls-video.js.map +1 -1
- package/cdn/media-attach-mixin-DuquRhAk.js +2 -0
- package/cdn/{media-attach-mixin-C2wz0Qbd.js.map → media-attach-mixin-DuquRhAk.js.map} +1 -1
- package/cdn/{media-attach-mixin-CYoNe7Sh.js → media-attach-mixin-pV8deGiO.js} +2 -2
- package/cdn/{media-attach-mixin-CYoNe7Sh.js.map → media-attach-mixin-pV8deGiO.js.map} +1 -1
- package/cdn/{minimal-AX_y2YBU.js → minimal-CciG7Fsu.js} +1 -1
- package/cdn/{minimal-AX_y2YBU.js.map → minimal-CciG7Fsu.js.map} +1 -1
- package/cdn/{minimal-Bc74CFqg.js → minimal-DSLrhnDm.js} +1 -1
- package/cdn/{minimal-Bc74CFqg.js.map → minimal-DSLrhnDm.js.map} +1 -1
- package/cdn/{minimal-ui-yKur3jyD.js → minimal-ui-Bx-_SggT.js} +5 -5
- package/cdn/{minimal-ui-yKur3jyD.js.map → minimal-ui-Bx-_SggT.js.map} +1 -1
- package/cdn/minimal-ui-CFO4ssL8.js +2 -0
- package/cdn/{minimal-ui-hC8-_9_F.js.map → minimal-ui-CFO4ssL8.js.map} +1 -1
- package/cdn/minimal-ui-D6Pvbx1R.js +2 -0
- package/cdn/{minimal-ui-lnw8AjaS.js.map → minimal-ui-D6Pvbx1R.js.map} +1 -1
- package/cdn/{minimal-ui-CE1sVxKB.js → minimal-ui-Dl-8ZL53.js} +5 -5
- package/cdn/{minimal-ui-CE1sVxKB.js.map → minimal-ui-Dl-8ZL53.js.map} +1 -1
- package/cdn/{mux-BhHIeG3e.js → mux-D5M5HL6A.js} +55 -20
- package/cdn/mux-D5M5HL6A.js.map +1 -0
- package/cdn/{mux-BgWl50KW.js → mux-DH3Kxyot.js} +10 -10
- package/cdn/mux-DH3Kxyot.js.map +1 -0
- package/cdn/native-hls-DN_aWn2z.js +2 -0
- package/cdn/native-hls-DN_aWn2z.js.map +1 -0
- package/cdn/native-hls-ak4v9DN6.js +371 -0
- package/cdn/native-hls-ak4v9DN6.js.map +1 -0
- package/cdn/player-BKKCelEs.js +2 -0
- package/cdn/player-BKKCelEs.js.map +1 -0
- package/cdn/{player-DX5Ka0vt.js → player-C_6YjMl7.js} +16 -12
- package/cdn/player-C_6YjMl7.js.map +1 -0
- package/cdn/player-CtegNw3g.js +2 -0
- package/cdn/{player-ChdQN3H5.js.map → player-CtegNw3g.js.map} +1 -1
- package/cdn/{player-BVGWmIbQ.js → player-D468sScc.js} +3 -3
- package/cdn/{player-BVGWmIbQ.js.map → player-D468sScc.js.map} +1 -1
- package/cdn/{context-0rI_P6jf.js → predicate-BOcV_HDG.js} +23 -2
- package/cdn/predicate-BOcV_HDG.js.map +1 -0
- package/cdn/{context-CEFisYD0.js → predicate-Cad5WV4q.js} +2 -2
- package/cdn/predicate-Cad5WV4q.js.map +1 -0
- package/cdn/{shallow-equal-xh6Wj-hj.js → shallow-equal-D-fthE54.js} +1 -1
- package/cdn/{shallow-equal-xh6Wj-hj.js.map → shallow-equal-D-fthE54.js.map} +1 -1
- package/cdn/{shallow-equal-Daj3-_LC.js → shallow-equal-DSpD9PMp.js} +1 -1
- package/cdn/{shallow-equal-Daj3-_LC.js.map → shallow-equal-DSpD9PMp.js.map} +1 -1
- package/cdn/{skin-element-D3iVinGP.js → skin-element-BcbrkgGs.js} +2 -2
- package/cdn/{skin-element-D3iVinGP.js.map → skin-element-BcbrkgGs.js.map} +1 -1
- package/cdn/{skin-element-DM82PPxz.js → skin-element-DesLkJKs.js} +2 -2
- package/cdn/{skin-element-DM82PPxz.js.map → skin-element-DesLkJKs.js.map} +1 -1
- package/cdn/types-B_4Es-UH.js +20 -0
- package/cdn/types-B_4Es-UH.js.map +1 -0
- package/cdn/types-DRezN4yy.js +2 -0
- package/cdn/types-DRezN4yy.js.map +1 -0
- package/cdn/{ui-CZ4yl3t3.js → ui-CzxKbsyb.js} +6 -6
- package/cdn/{ui-CZ4yl3t3.js.map → ui-CzxKbsyb.js.map} +1 -1
- package/cdn/ui-D6DV-Emw.js +2 -0
- package/cdn/{ui-BGvi0TNr.js.map → ui-D6DV-Emw.js.map} +1 -1
- package/cdn/ui-Dw-n2AMs.js +2 -0
- package/cdn/{ui-BN57BxYZ.js.map → ui-Dw-n2AMs.js.map} +1 -1
- package/cdn/{ui-CKR6dVbQ.js → ui-S_eLj4ur.js} +6 -6
- package/cdn/{ui-CKR6dVbQ.js.map → ui-S_eLj4ur.js.map} +1 -1
- package/cdn/{video-host-BtD61mpF.js → video-host-BR_2vUZH.js} +29 -16
- package/cdn/{video-host-BtD61mpF.js.map → video-host-BR_2vUZH.js.map} +1 -1
- package/cdn/{video-host-LeB1FKfO.js → video-host-Bkh2OyyP.js} +10 -10
- package/cdn/{video-host-LeB1FKfO.js.map → video-host-Bkh2OyyP.js.map} +1 -1
- package/cdn/video-minimal-ui.dev.js +1 -4
- package/cdn/video-minimal-ui.js +1 -1
- package/cdn/video-minimal.dev.js +5 -7
- package/cdn/video-minimal.dev.js.map +1 -1
- package/cdn/video-minimal.js +1 -1
- package/cdn/video-minimal.js.map +1 -1
- package/cdn/video-ui.dev.js +1 -4
- package/cdn/video-ui.js +1 -1
- package/cdn/video.dev.js +4 -6
- package/cdn/video.dev.js.map +1 -1
- package/cdn/video.js +1 -1
- package/cdn/video.js.map +1 -1
- package/dist/default/_virtual/inline-css_src/define/audio/minimal-skin.js +1 -1
- package/dist/default/_virtual/inline-css_src/define/audio/minimal-skin.js.map +1 -1
- package/dist/default/_virtual/inline-css_src/define/audio/skin.js +1 -1
- package/dist/default/_virtual/inline-css_src/define/audio/skin.js.map +1 -1
- package/dist/default/_virtual/inline-css_src/define/live-audio/minimal-skin.js +6 -0
- package/dist/default/_virtual/inline-css_src/define/live-audio/minimal-skin.js.map +1 -0
- package/dist/default/_virtual/inline-css_src/define/live-audio/skin.js +6 -0
- package/dist/default/_virtual/inline-css_src/define/live-audio/skin.js.map +1 -0
- package/dist/default/_virtual/inline-css_src/define/live-video/minimal-skin.js +6 -0
- package/dist/default/_virtual/inline-css_src/define/live-video/minimal-skin.js.map +1 -0
- package/dist/default/_virtual/inline-css_src/define/live-video/skin.js +6 -0
- package/dist/default/_virtual/inline-css_src/define/live-video/skin.js.map +1 -0
- package/dist/default/_virtual/inline-css_src/define/video/minimal-skin.js +1 -1
- package/dist/default/_virtual/inline-css_src/define/video/minimal-skin.js.map +1 -1
- package/dist/default/_virtual/inline-css_src/define/video/skin.js +1 -1
- package/dist/default/_virtual/inline-css_src/define/video/skin.js.map +1 -1
- package/dist/default/define/audio/minimal-skin.css +2 -1
- package/dist/default/define/audio/skin.css +2 -1
- package/dist/default/define/background/skin.js +1 -1
- package/dist/default/define/live-audio/minimal-skin.css +779 -0
- package/dist/default/define/live-audio/minimal-skin.js +26 -0
- package/dist/default/define/live-audio/minimal-skin.js.map +1 -0
- package/dist/default/define/live-audio/minimal-skin.tailwind.js +29 -0
- package/dist/default/define/live-audio/minimal-skin.tailwind.js.map +1 -0
- package/dist/default/define/live-audio/skin.css +795 -0
- package/dist/default/define/live-audio/skin.js +26 -0
- package/dist/default/define/live-audio/skin.js.map +1 -0
- package/dist/default/define/live-audio/skin.tailwind.js +28 -0
- package/dist/default/define/live-audio/skin.tailwind.js.map +1 -0
- package/dist/default/define/live-video/minimal-skin.css +1170 -0
- package/dist/default/define/live-video/minimal-skin.js +26 -0
- package/dist/default/define/live-video/minimal-skin.js.map +1 -0
- package/dist/default/define/live-video/minimal-skin.tailwind.js +30 -0
- package/dist/default/define/live-video/minimal-skin.tailwind.js.map +1 -0
- package/dist/default/define/live-video/skin.css +1160 -0
- package/dist/default/define/live-video/skin.js +26 -0
- package/dist/default/define/live-video/skin.js.map +1 -0
- package/dist/default/define/live-video/skin.tailwind.js +29 -0
- package/dist/default/define/live-video/skin.tailwind.js.map +1 -0
- package/dist/default/define/skin-element.js +1 -1
- package/dist/default/define/video/minimal-skin.css +2 -1
- package/dist/default/define/video/skin.css +2 -1
- package/dist/default/index.js +2 -1
- package/dist/default/media/mux-audio/index.js +4 -1
- package/dist/default/media/mux-audio/index.js.map +1 -1
- package/dist/default/media/mux-video/index.js +4 -1
- package/dist/default/media/mux-video/index.js.map +1 -1
- package/dist/default/presets/live-audio.js +6 -0
- package/dist/default/presets/live-video.js +6 -0
- package/dist/default/skins/dist/default/default/tailwind/components/button.js +1 -1
- package/dist/default/skins/dist/default/default/tailwind/components/button.js.map +1 -1
- package/dist/default/skins/dist/default/minimal/tailwind/components/button.js +1 -1
- package/dist/default/skins/dist/default/minimal/tailwind/components/button.js.map +1 -1
- package/dist/default/ui/alert-dialog/alert-dialog-close-element.js +7 -5
- package/dist/default/ui/alert-dialog/alert-dialog-close-element.js.map +1 -1
- package/dist/default/ui/alert-dialog/alert-dialog-element.js +12 -6
- package/dist/default/ui/alert-dialog/alert-dialog-element.js.map +1 -1
- package/dist/default/ui/buffering-indicator/buffering-indicator-element.js +6 -3
- package/dist/default/ui/buffering-indicator/buffering-indicator-element.js.map +1 -1
- package/dist/default/ui/cast-button/cast-button-element.js +2 -2
- package/dist/default/ui/cast-button/cast-button-element.js.map +1 -1
- package/dist/default/ui/error-dialog/error-dialog-element.js +4 -1
- package/dist/default/ui/error-dialog/error-dialog-element.js.map +1 -1
- package/dist/default/ui/gesture/gesture-element.js +10 -7
- package/dist/default/ui/gesture/gesture-element.js.map +1 -1
- package/dist/default/ui/hotkey/hotkey-element.js +10 -7
- package/dist/default/ui/hotkey/hotkey-element.js.map +1 -1
- package/dist/default/ui/media-button-element.js +4 -2
- package/dist/default/ui/media-button-element.js.map +1 -1
- package/dist/default/ui/popover/popover-element.js +14 -7
- package/dist/default/ui/popover/popover-element.js.map +1 -1
- package/dist/default/ui/slider/slider-element.js +8 -4
- package/dist/default/ui/slider/slider-element.js.map +1 -1
- package/dist/default/ui/slider/slider-preview-element.js +9 -6
- package/dist/default/ui/slider/slider-preview-element.js.map +1 -1
- package/dist/default/ui/slider/slider-value-element.js +5 -4
- package/dist/default/ui/slider/slider-value-element.js.map +1 -1
- package/dist/default/ui/thumbnail/thumbnail-element.js +10 -5
- package/dist/default/ui/thumbnail/thumbnail-element.js.map +1 -1
- package/dist/default/ui/time/time-element.js +8 -4
- package/dist/default/ui/time/time-element.js.map +1 -1
- package/dist/default/ui/time-slider/time-slider-element.js +12 -6
- package/dist/default/ui/time-slider/time-slider-element.js.map +1 -1
- package/dist/default/ui/tooltip/tooltip-element.js +16 -8
- package/dist/default/ui/tooltip/tooltip-element.js.map +1 -1
- package/dist/default/ui/tooltip/tooltip-group-element.js +7 -5
- package/dist/default/ui/tooltip/tooltip-group-element.js.map +1 -1
- package/dist/default/ui/volume-slider/volume-slider-element.js +10 -5
- package/dist/default/ui/volume-slider/volume-slider-element.js.map +1 -1
- package/dist/dev/_virtual/_rolldown/runtime.js +27 -0
- package/dist/dev/_virtual/inline-css_src/define/audio/minimal-skin.js +1 -1
- package/dist/dev/_virtual/inline-css_src/define/audio/minimal-skin.js.map +1 -1
- package/dist/dev/_virtual/inline-css_src/define/audio/skin.js +1 -1
- package/dist/dev/_virtual/inline-css_src/define/audio/skin.js.map +1 -1
- package/dist/dev/_virtual/inline-css_src/define/live-audio/minimal-skin.js +6 -0
- package/dist/dev/_virtual/inline-css_src/define/live-audio/minimal-skin.js.map +1 -0
- package/dist/dev/_virtual/inline-css_src/define/live-audio/skin.js +6 -0
- package/dist/dev/_virtual/inline-css_src/define/live-audio/skin.js.map +1 -0
- package/dist/dev/_virtual/inline-css_src/define/live-video/minimal-skin.js +6 -0
- package/dist/dev/_virtual/inline-css_src/define/live-video/minimal-skin.js.map +1 -0
- package/dist/dev/_virtual/inline-css_src/define/live-video/skin.js +6 -0
- package/dist/dev/_virtual/inline-css_src/define/live-video/skin.js.map +1 -0
- package/dist/dev/_virtual/inline-css_src/define/video/minimal-skin.js +1 -1
- package/dist/dev/_virtual/inline-css_src/define/video/minimal-skin.js.map +1 -1
- package/dist/dev/_virtual/inline-css_src/define/video/skin.js +1 -1
- package/dist/dev/_virtual/inline-css_src/define/video/skin.js.map +1 -1
- package/dist/dev/define/audio/minimal-skin.css +2 -1
- package/dist/dev/define/audio/minimal-skin.d.ts +2 -2
- package/dist/dev/define/audio/minimal-skin.d.ts.map +1 -1
- package/dist/dev/define/audio/player.d.ts +2 -2
- package/dist/dev/define/audio/skin.css +2 -1
- package/dist/dev/define/audio/skin.d.ts +2 -2
- package/dist/dev/define/audio/skin.d.ts.map +1 -1
- package/dist/dev/define/background/player.d.ts +2 -2
- package/dist/dev/define/background/skin.d.ts.map +1 -1
- package/dist/dev/define/background/skin.js +1 -1
- package/dist/dev/define/live-audio/minimal-skin.css +779 -0
- package/dist/dev/define/live-audio/minimal-skin.d.ts +17 -0
- package/dist/dev/define/live-audio/minimal-skin.d.ts.map +1 -0
- package/dist/dev/define/live-audio/minimal-skin.js +76 -0
- package/dist/dev/define/live-audio/minimal-skin.js.map +1 -0
- package/dist/dev/define/live-audio/minimal-skin.tailwind.d.ts +14 -0
- package/dist/dev/define/live-audio/minimal-skin.tailwind.d.ts.map +1 -0
- package/dist/dev/define/live-audio/minimal-skin.tailwind.js +79 -0
- package/dist/dev/define/live-audio/minimal-skin.tailwind.js.map +1 -0
- package/dist/dev/define/live-audio/skin.css +795 -0
- package/dist/dev/define/live-audio/skin.d.ts +17 -0
- package/dist/dev/define/live-audio/skin.d.ts.map +1 -0
- package/dist/dev/define/live-audio/skin.js +83 -0
- package/dist/dev/define/live-audio/skin.js.map +1 -0
- package/dist/dev/define/live-audio/skin.tailwind.d.ts +14 -0
- package/dist/dev/define/live-audio/skin.tailwind.d.ts.map +1 -0
- package/dist/dev/define/live-audio/skin.tailwind.js +78 -0
- package/dist/dev/define/live-audio/skin.tailwind.js.map +1 -0
- package/dist/dev/define/live-video/minimal-skin.css +1170 -0
- package/dist/dev/define/live-video/minimal-skin.d.ts +17 -0
- package/dist/dev/define/live-video/minimal-skin.d.ts.map +1 -0
- package/dist/dev/define/live-video/minimal-skin.js +112 -0
- package/dist/dev/define/live-video/minimal-skin.js.map +1 -0
- package/dist/dev/define/live-video/minimal-skin.tailwind.d.ts +14 -0
- package/dist/dev/define/live-video/minimal-skin.tailwind.d.ts.map +1 -0
- package/dist/dev/define/live-video/minimal-skin.tailwind.js +110 -0
- package/dist/dev/define/live-video/minimal-skin.tailwind.js.map +1 -0
- package/dist/dev/define/live-video/skin.css +1160 -0
- package/dist/dev/define/live-video/skin.d.ts +17 -0
- package/dist/dev/define/live-video/skin.d.ts.map +1 -0
- package/dist/dev/define/live-video/skin.js +127 -0
- package/dist/dev/define/live-video/skin.js.map +1 -0
- package/dist/dev/define/live-video/skin.tailwind.d.ts +14 -0
- package/dist/dev/define/live-video/skin.tailwind.d.ts.map +1 -0
- package/dist/dev/define/live-video/skin.tailwind.js +111 -0
- package/dist/dev/define/live-video/skin.tailwind.js.map +1 -0
- package/dist/dev/define/skin-element.d.ts +1 -1
- package/dist/dev/define/skin-element.d.ts.map +1 -1
- package/dist/dev/define/skin-element.js +1 -1
- package/dist/dev/define/video/minimal-skin.css +2 -1
- package/dist/dev/define/video/minimal-skin.d.ts +2 -2
- package/dist/dev/define/video/minimal-skin.d.ts.map +1 -1
- package/dist/dev/define/video/player.d.ts +2 -2
- package/dist/dev/define/video/skin.css +2 -1
- package/dist/dev/define/video/skin.d.ts +2 -2
- package/dist/dev/define/video/skin.d.ts.map +1 -1
- package/dist/dev/index.d.ts +12 -3
- package/dist/dev/index.d.ts.map +1 -0
- package/dist/dev/index.js +2 -1
- package/dist/dev/media/background-video/index.d.ts.map +1 -1
- package/dist/dev/media/container-element.d.ts +2 -2
- package/dist/dev/media/dash-video/index.d.ts +2 -2
- package/dist/dev/media/hls-video/index.d.ts +2 -2
- package/dist/dev/media/mux-audio/index.d.ts +2 -2
- package/dist/dev/media/mux-audio/index.js +4 -1
- package/dist/dev/media/mux-audio/index.js.map +1 -1
- package/dist/dev/media/mux-video/index.d.ts +2 -2
- package/dist/dev/media/mux-video/index.js +4 -1
- package/dist/dev/media/mux-video/index.js.map +1 -1
- package/dist/dev/media/native-hls-video/index.d.ts +2 -2
- package/dist/dev/media/simple-hls-video/index.d.ts +2 -2
- package/dist/dev/player/context.d.ts +1 -1
- package/dist/dev/player/player-controller.d.ts +1 -1
- package/dist/dev/player/player-controller.d.ts.map +1 -1
- package/dist/dev/presets/live-audio.d.ts +6 -0
- package/dist/dev/presets/live-audio.js +6 -0
- package/dist/dev/presets/live-video.d.ts +6 -0
- package/dist/dev/presets/live-video.js +6 -0
- package/dist/dev/skins/dist/default/default/tailwind/components/button.js +1 -1
- package/dist/dev/skins/dist/default/default/tailwind/components/button.js.map +1 -1
- package/dist/dev/skins/dist/default/minimal/tailwind/components/button.js +1 -1
- package/dist/dev/skins/dist/default/minimal/tailwind/components/button.js.map +1 -1
- package/dist/dev/store/container-mixin.d.ts +1 -1
- package/dist/dev/store/provider-mixin.d.ts +1 -1
- package/dist/dev/ui/alert-dialog/alert-dialog-close-element.d.ts.map +1 -1
- package/dist/dev/ui/alert-dialog/alert-dialog-close-element.js +7 -5
- package/dist/dev/ui/alert-dialog/alert-dialog-close-element.js.map +1 -1
- package/dist/dev/ui/alert-dialog/alert-dialog-description-element.d.ts +2 -2
- package/dist/dev/ui/alert-dialog/alert-dialog-element.d.ts.map +1 -1
- package/dist/dev/ui/alert-dialog/alert-dialog-element.js +12 -6
- package/dist/dev/ui/alert-dialog/alert-dialog-element.js.map +1 -1
- package/dist/dev/ui/alert-dialog/alert-dialog-title-element.d.ts +2 -2
- package/dist/dev/ui/buffering-indicator/buffering-indicator-element.d.ts.map +1 -1
- package/dist/dev/ui/buffering-indicator/buffering-indicator-element.js +6 -3
- package/dist/dev/ui/buffering-indicator/buffering-indicator-element.js.map +1 -1
- package/dist/dev/ui/captions-button/captions-button-element.d.ts +4 -4
- package/dist/dev/ui/captions-button/captions-button-element.d.ts.map +1 -1
- package/dist/dev/ui/cast-button/cast-button-element.d.ts +6 -6
- package/dist/dev/ui/cast-button/cast-button-element.d.ts.map +1 -1
- package/dist/dev/ui/cast-button/cast-button-element.js +2 -2
- package/dist/dev/ui/cast-button/cast-button-element.js.map +1 -1
- package/dist/dev/ui/error-dialog/error-dialog-element.d.ts.map +1 -1
- package/dist/dev/ui/error-dialog/error-dialog-element.js +4 -1
- package/dist/dev/ui/error-dialog/error-dialog-element.js.map +1 -1
- package/dist/dev/ui/fullscreen-button/fullscreen-button-element.d.ts +4 -4
- package/dist/dev/ui/fullscreen-button/fullscreen-button-element.d.ts.map +1 -1
- package/dist/dev/ui/gesture/gesture-element.js +10 -7
- package/dist/dev/ui/gesture/gesture-element.js.map +1 -1
- package/dist/dev/ui/hotkey/aria-key-shortcuts-controller.d.ts.map +1 -1
- package/dist/dev/ui/hotkey/hotkey-element.js +10 -7
- package/dist/dev/ui/hotkey/hotkey-element.js.map +1 -1
- package/dist/dev/ui/media-button-element.d.ts +1 -1
- package/dist/dev/ui/media-button-element.js +4 -2
- package/dist/dev/ui/media-button-element.js.map +1 -1
- package/dist/dev/ui/media-element.d.ts +2 -2
- package/dist/dev/ui/mute-button/mute-button-element.d.ts +4 -4
- package/dist/dev/ui/mute-button/mute-button-element.d.ts.map +1 -1
- package/dist/dev/ui/pip-button/pip-button-element.d.ts +4 -4
- package/dist/dev/ui/pip-button/pip-button-element.d.ts.map +1 -1
- package/dist/dev/ui/play-button/play-button-element.d.ts +5 -5
- package/dist/dev/ui/play-button/play-button-element.d.ts.map +1 -1
- package/dist/dev/ui/playback-rate-button/playback-rate-button-element.d.ts +3 -3
- package/dist/dev/ui/playback-rate-button/playback-rate-button-element.d.ts.map +1 -1
- package/dist/dev/ui/popover/popover-element.d.ts +3 -3
- package/dist/dev/ui/popover/popover-element.d.ts.map +1 -1
- package/dist/dev/ui/popover/popover-element.js +14 -7
- package/dist/dev/ui/popover/popover-element.js.map +1 -1
- package/dist/dev/ui/poster/poster-element.d.ts +4 -4
- package/dist/dev/ui/poster/poster-element.d.ts.map +1 -1
- package/dist/dev/ui/seek-button/seek-button-element.d.ts +4 -4
- package/dist/dev/ui/seek-button/seek-button-element.d.ts.map +1 -1
- package/dist/dev/ui/slider/slider-element.d.ts +2 -2
- package/dist/dev/ui/slider/slider-element.d.ts.map +1 -1
- package/dist/dev/ui/slider/slider-element.js +8 -4
- package/dist/dev/ui/slider/slider-element.js.map +1 -1
- package/dist/dev/ui/slider/slider-preview-element.d.ts.map +1 -1
- package/dist/dev/ui/slider/slider-preview-element.js +9 -6
- package/dist/dev/ui/slider/slider-preview-element.js.map +1 -1
- package/dist/dev/ui/slider/slider-value-element.d.ts.map +1 -1
- package/dist/dev/ui/slider/slider-value-element.js +5 -4
- package/dist/dev/ui/slider/slider-value-element.js.map +1 -1
- package/dist/dev/ui/thumbnail/thumbnail-element.d.ts.map +1 -1
- package/dist/dev/ui/thumbnail/thumbnail-element.js +10 -5
- package/dist/dev/ui/thumbnail/thumbnail-element.js.map +1 -1
- package/dist/dev/ui/time/time-element.d.ts +2 -2
- package/dist/dev/ui/time/time-element.d.ts.map +1 -1
- package/dist/dev/ui/time/time-element.js +8 -4
- package/dist/dev/ui/time/time-element.js.map +1 -1
- package/dist/dev/ui/time-slider/time-slider-element.d.ts +2 -2
- package/dist/dev/ui/time-slider/time-slider-element.d.ts.map +1 -1
- package/dist/dev/ui/time-slider/time-slider-element.js +12 -6
- package/dist/dev/ui/time-slider/time-slider-element.js.map +1 -1
- package/dist/dev/ui/tooltip/tooltip-element.d.ts +3 -3
- package/dist/dev/ui/tooltip/tooltip-element.d.ts.map +1 -1
- package/dist/dev/ui/tooltip/tooltip-element.js +16 -8
- package/dist/dev/ui/tooltip/tooltip-element.js.map +1 -1
- package/dist/dev/ui/tooltip/tooltip-group-element.d.ts.map +1 -1
- package/dist/dev/ui/tooltip/tooltip-group-element.js +7 -5
- package/dist/dev/ui/tooltip/tooltip-group-element.js.map +1 -1
- package/dist/dev/ui/volume-slider/volume-slider-element.d.ts +2 -2
- package/dist/dev/ui/volume-slider/volume-slider-element.d.ts.map +1 -1
- package/dist/dev/ui/volume-slider/volume-slider-element.js +10 -5
- package/dist/dev/ui/volume-slider/volume-slider-element.js.map +1 -1
- package/package.json +31 -10
- package/cdn/compounds-CCgS3IGo.js +0 -8
- package/cdn/compounds-CCgS3IGo.js.map +0 -1
- package/cdn/compounds-DD3MYkSc.js.map +0 -1
- package/cdn/context-0rI_P6jf.js.map +0 -1
- package/cdn/context-CEFisYD0.js.map +0 -1
- package/cdn/create-player-B-PGzhq2.js +0 -7
- package/cdn/create-player-B-PGzhq2.js.map +0 -1
- package/cdn/create-player-BKLw7l1a.js.map +0 -1
- package/cdn/hls-CcSAx_3I.js.map +0 -1
- package/cdn/hls-Dl2v35sW.js +0 -41
- package/cdn/hls-Dl2v35sW.js.map +0 -1
- package/cdn/hotkey-element-DWWkfH3A.js +0 -2
- package/cdn/media-attach-mixin-C2wz0Qbd.js +0 -2
- package/cdn/minimal-ui-hC8-_9_F.js +0 -2
- package/cdn/minimal-ui-lnw8AjaS.js +0 -2
- package/cdn/mux-BgWl50KW.js.map +0 -1
- package/cdn/mux-BhHIeG3e.js.map +0 -1
- package/cdn/native-hls-lhip4tV9.js +0 -123
- package/cdn/native-hls-lhip4tV9.js.map +0 -1
- package/cdn/native-hls-odPBXxK7.js +0 -2
- package/cdn/native-hls-odPBXxK7.js.map +0 -1
- package/cdn/player-B7jISTmQ.js +0 -2
- package/cdn/player-B7jISTmQ.js.map +0 -1
- package/cdn/player-ChdQN3H5.js +0 -2
- package/cdn/player-DX5Ka0vt.js.map +0 -1
- package/cdn/ui-BGvi0TNr.js +0 -2
- package/cdn/ui-BN57BxYZ.js +0 -2
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { safeDefine } from "../safe-define.js";
|
|
2
|
+
import { SkinElement } from "../skin-element.js";
|
|
3
|
+
import { renderIcon } from "../../icons/dist/render/default/index.js";
|
|
4
|
+
import "../video/ui.js";
|
|
5
|
+
import skin_default from "../../_virtual/inline-css_src/define/live-video/skin.js";
|
|
6
|
+
import { createShadowStyle, createTemplate } from "@videojs/utils/dom";
|
|
7
|
+
//#region src/define/live-video/skin.ts
|
|
8
|
+
function getTemplateHTML() {
|
|
9
|
+
return `<media-container class="media-default-skin media-default-skin--video"><slot name="media"></slot><slot></slot><media-poster><slot name="poster"></slot></media-poster><media-buffering-indicator class="media-buffering-indicator"><div class="media-surface"> ${renderIcon("spinner", { class: "media-icon" })} </div></media-buffering-indicator><media-error-dialog class="media-error"><div class="media-error__dialog media-surface"><div class="media-error__content"><media-alert-dialog-title class="media-error__title">Something went wrong.</media-alert-dialog-title><media-alert-dialog-description class="media-error__description"></media-alert-dialog-description></div><div class="media-error__actions"><media-alert-dialog-close class="media-button media-button--primary">OK</media-alert-dialog-close></div></div></media-error-dialog><media-controls class="media-surface media-controls"><media-tooltip-group><div class="media-button-group"><media-play-button commandfor="play-tooltip" class="media-button media-button--subtle media-button--icon media-button--play"> ${renderIcon("restart", { class: "media-icon media-icon--restart" })} ${renderIcon("play", { class: "media-icon media-icon--play" })} ${renderIcon("pause", { class: "media-icon media-icon--pause" })} </media-play-button><media-tooltip id="play-tooltip" side="top" class="media-surface media-tooltip"></media-tooltip></div><div class="media-time-controls" aria-hidden="true"></div><div class="media-button-group"><media-mute-button commandfor="live-video-volume-popover" class="media-button media-button--subtle media-button--icon media-button--mute"> ${renderIcon("volume-off", { class: "media-icon media-icon--volume-off" })} ${renderIcon("volume-low", { class: "media-icon media-icon--volume-low" })} ${renderIcon("volume-high", { class: "media-icon media-icon--volume-high" })} </media-mute-button><media-popover id="live-video-volume-popover" open-on-hover delay="200" close-delay="100" side="top" class="media-surface media-popover media-popover--volume"><media-volume-slider class="media-slider" orientation="vertical" thumb-alignment="edge"><media-slider-track class="media-slider__track"><media-slider-fill class="media-slider__fill"></media-slider-fill></media-slider-track><media-slider-thumb class="media-slider__thumb media-slider__thumb--persistent"></media-slider-thumb></media-volume-slider></media-popover><media-captions-button commandfor="captions-tooltip" class="media-button media-button--subtle media-button--icon media-button--captions"> ${renderIcon("captions-off", { class: "media-icon media-icon--captions-off" })} ${renderIcon("captions-on", { class: "media-icon media-icon--captions-on" })} </media-captions-button><media-tooltip id="captions-tooltip" side="top" class="media-surface media-tooltip"></media-tooltip><media-cast-button commandfor="cast-tooltip" class="media-button media-button--subtle media-button--icon media-button--cast"> ${renderIcon("cast-enter", { class: "media-icon media-icon--cast-enter" })} ${renderIcon("cast-exit", { class: "media-icon media-icon--cast-exit" })} </media-cast-button><media-tooltip id="cast-tooltip" side="top" class="media-surface media-tooltip"></media-tooltip><media-pip-button commandfor="pip-tooltip" class="media-button media-button--subtle media-button--icon media-button--pip"> ${renderIcon("pip-enter", { class: "media-icon media-icon--pip-enter" })} ${renderIcon("pip-exit", { class: "media-icon media-icon--pip-exit" })} </media-pip-button><media-tooltip id="pip-tooltip" side="top" class="media-surface media-tooltip"></media-tooltip><media-fullscreen-button commandfor="fullscreen-tooltip" class="media-button media-button--subtle media-button--icon media-button--fullscreen"> ${renderIcon("fullscreen-enter", { class: "media-icon media-icon--fullscreen-enter" })} ${renderIcon("fullscreen-exit", { class: "media-icon media-icon--fullscreen-exit" })} </media-fullscreen-button><media-tooltip id="fullscreen-tooltip" side="top" class="media-surface media-tooltip"></media-tooltip></div></media-tooltip-group></media-controls><div class="media-overlay"></div><media-hotkey keys="Space" action="togglePaused"></media-hotkey><media-hotkey keys="k" action="togglePaused"></media-hotkey><media-hotkey keys="m" action="toggleMuted"></media-hotkey><media-hotkey keys="f" action="toggleFullscreen"></media-hotkey><media-hotkey keys="c" action="toggleSubtitles"></media-hotkey><media-hotkey keys="i" action="togglePictureInPicture"></media-hotkey><media-hotkey keys="ArrowUp" action="volumeStep" value="0.05"></media-hotkey><media-hotkey keys="ArrowDown" action="volumeStep" value="-0.05"></media-hotkey><media-gesture type="tap" action="togglePaused" pointer="mouse" region="center"></media-gesture><media-gesture type="tap" action="toggleControls" pointer="touch"></media-gesture><media-gesture type="doubletap" action="toggleFullscreen" region="center"></media-gesture></media-container>`;
|
|
10
|
+
}
|
|
11
|
+
var LiveVideoSkinElement = class extends SkinElement {
|
|
12
|
+
static {
|
|
13
|
+
this.tagName = "live-video-skin";
|
|
14
|
+
}
|
|
15
|
+
static {
|
|
16
|
+
this.styles = createShadowStyle(skin_default);
|
|
17
|
+
}
|
|
18
|
+
static {
|
|
19
|
+
this.template = createTemplate(getTemplateHTML());
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
safeDefine(LiveVideoSkinElement);
|
|
23
|
+
//#endregion
|
|
24
|
+
export { LiveVideoSkinElement };
|
|
25
|
+
|
|
26
|
+
//# sourceMappingURL=skin.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"skin.js","names":[],"sources":["../../../../src/define/live-video/skin.ts"],"sourcesContent":["import { renderIcon } from '@videojs/icons/render';\nimport { createShadowStyle, createTemplate } from '@videojs/utils/dom';\nimport { safeDefine } from '../safe-define';\nimport { SkinElement } from '../skin-element';\nimport styles from './skin.css?inline';\n\n// Reuse the video preset's UI element registrations (player, container,\n// controls, buttons, etc.) — the live variant only differs in its template.\nimport '../video/ui';\n\nfunction getTemplateHTML() {\n return /*html*/ `\n <media-container class=\"media-default-skin media-default-skin--video\">\n <!-- @deprecated slot=\"media\" is no longer required, use the default slot instead -->\n <slot name=\"media\"></slot>\n <slot></slot>\n\n <media-poster>\n <slot name=\"poster\"></slot>\n </media-poster>\n\n <media-buffering-indicator class=\"media-buffering-indicator\">\n <div class=\"media-surface\">\n ${renderIcon('spinner', { class: 'media-icon' })}\n </div>\n </media-buffering-indicator>\n\n <media-error-dialog class=\"media-error\">\n <div class=\"media-error__dialog media-surface\">\n <div class=\"media-error__content\">\n <media-alert-dialog-title class=\"media-error__title\">Something went wrong.</media-alert-dialog-title>\n <media-alert-dialog-description class=\"media-error__description\"></media-alert-dialog-description>\n </div>\n <div class=\"media-error__actions\">\n <media-alert-dialog-close class=\"media-button media-button--primary\">OK</media-alert-dialog-close>\n </div>\n </div>\n </media-error-dialog>\n\n <media-controls class=\"media-surface media-controls\">\n <media-tooltip-group>\n <div class=\"media-button-group\">\n <media-play-button commandfor=\"play-tooltip\" class=\"media-button media-button--subtle media-button--icon media-button--play\">\n ${renderIcon('restart', { class: 'media-icon media-icon--restart' })}\n ${renderIcon('play', { class: 'media-icon media-icon--play' })}\n ${renderIcon('pause', { class: 'media-icon media-icon--pause' })}\n </media-play-button>\n <media-tooltip id=\"play-tooltip\" side=\"top\" class=\"media-surface media-tooltip\"></media-tooltip>\n </div>\n\n <div class=\"media-time-controls\" aria-hidden=\"true\"></div>\n\n <div class=\"media-button-group\">\n <media-mute-button commandfor=\"live-video-volume-popover\" class=\"media-button media-button--subtle media-button--icon media-button--mute\">\n ${renderIcon('volume-off', { class: 'media-icon media-icon--volume-off' })}\n ${renderIcon('volume-low', { class: 'media-icon media-icon--volume-low' })}\n ${renderIcon('volume-high', { class: 'media-icon media-icon--volume-high' })}\n </media-mute-button>\n\n <media-popover id=\"live-video-volume-popover\" open-on-hover delay=\"200\" close-delay=\"100\" side=\"top\" class=\"media-surface media-popover media-popover--volume\">\n <media-volume-slider class=\"media-slider\" orientation=\"vertical\" thumb-alignment=\"edge\">\n <media-slider-track class=\"media-slider__track\">\n <media-slider-fill class=\"media-slider__fill\"></media-slider-fill>\n </media-slider-track>\n <media-slider-thumb class=\"media-slider__thumb media-slider__thumb--persistent\"></media-slider-thumb>\n </media-volume-slider>\n </media-popover>\n\n <media-captions-button commandfor=\"captions-tooltip\" class=\"media-button media-button--subtle media-button--icon media-button--captions\">\n ${renderIcon('captions-off', { class: 'media-icon media-icon--captions-off' })}\n ${renderIcon('captions-on', { class: 'media-icon media-icon--captions-on' })}\n </media-captions-button>\n <media-tooltip id=\"captions-tooltip\" side=\"top\" class=\"media-surface media-tooltip\"></media-tooltip>\n\n <media-cast-button commandfor=\"cast-tooltip\" class=\"media-button media-button--subtle media-button--icon media-button--cast\">\n ${renderIcon('cast-enter', { class: 'media-icon media-icon--cast-enter' })}\n ${renderIcon('cast-exit', { class: 'media-icon media-icon--cast-exit' })}\n </media-cast-button>\n <media-tooltip id=\"cast-tooltip\" side=\"top\" class=\"media-surface media-tooltip\"></media-tooltip>\n\n <media-pip-button commandfor=\"pip-tooltip\" class=\"media-button media-button--subtle media-button--icon media-button--pip\">\n ${renderIcon('pip-enter', { class: 'media-icon media-icon--pip-enter' })}\n ${renderIcon('pip-exit', { class: 'media-icon media-icon--pip-exit' })}\n </media-pip-button>\n <media-tooltip id=\"pip-tooltip\" side=\"top\" class=\"media-surface media-tooltip\"></media-tooltip>\n\n <media-fullscreen-button commandfor=\"fullscreen-tooltip\" class=\"media-button media-button--subtle media-button--icon media-button--fullscreen\">\n ${renderIcon('fullscreen-enter', { class: 'media-icon media-icon--fullscreen-enter' })}\n ${renderIcon('fullscreen-exit', { class: 'media-icon media-icon--fullscreen-exit' })}\n </media-fullscreen-button>\n <media-tooltip id=\"fullscreen-tooltip\" side=\"top\" class=\"media-surface media-tooltip\"></media-tooltip>\n </div>\n </media-tooltip-group>\n </media-controls>\n\n <div class=\"media-overlay\"></div>\n\n <!-- Hotkeys -->\n <media-hotkey keys=\"Space\" action=\"togglePaused\"></media-hotkey>\n <media-hotkey keys=\"k\" action=\"togglePaused\"></media-hotkey>\n <media-hotkey keys=\"m\" action=\"toggleMuted\"></media-hotkey>\n <media-hotkey keys=\"f\" action=\"toggleFullscreen\"></media-hotkey>\n <media-hotkey keys=\"c\" action=\"toggleSubtitles\"></media-hotkey>\n <media-hotkey keys=\"i\" action=\"togglePictureInPicture\"></media-hotkey>\n <media-hotkey keys=\"ArrowUp\" action=\"volumeStep\" value=\"0.05\"></media-hotkey>\n <media-hotkey keys=\"ArrowDown\" action=\"volumeStep\" value=\"-0.05\"></media-hotkey>\n\n <!-- Gestures -->\n <media-gesture type=\"tap\" action=\"togglePaused\" pointer=\"mouse\" region=\"center\"></media-gesture>\n <media-gesture type=\"tap\" action=\"toggleControls\" pointer=\"touch\"></media-gesture>\n <media-gesture type=\"doubletap\" action=\"toggleFullscreen\" region=\"center\"></media-gesture>\n </media-container>\n `;\n}\n\nexport class LiveVideoSkinElement extends SkinElement {\n static readonly tagName = 'live-video-skin';\n static styles = createShadowStyle(styles);\n static template = createTemplate(getTemplateHTML());\n}\n\nsafeDefine(LiveVideoSkinElement);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [LiveVideoSkinElement.tagName]: LiveVideoSkinElement;\n }\n}\n"],"mappings":";;;;;;;AAUA,SAAS,kBAAkB;AACzB,QAAgB,iQAAA,WAAA,WAAA,EAAA,OAAA,cAAA,CAAA,CAAA,wvBAAA,WAAA,WAAA,EAAA,OAAA,kCAAA,CAAA,CAAA,GAAA,WAAA,QAAA,EAAA,OAAA,+BAAA,CAAA,CAAA,GAAA,WAAA,SAAA,EAAA,OAAA,gCAAA,CAAA,CAAA,kWAAA,WAAA,cAAA,EAAA,OAAA,qCAAA,CAAA,CAAA,GAAA,WAAA,cAAA,EAAA,OAAA,qCAAA,CAAA,CAAA,GAAA,WAAA,eAAA,EAAA,OAAA,sCAAA,CAAA,CAAA,0qBAAA,WAAA,gBAAA,EAAA,OAAA,uCAAA,CAAA,CAAA,GAAA,WAAA,eAAA,EAAA,OAAA,sCAAA,CAAA,CAAA,6PAAA,WAAA,cAAA,EAAA,OAAA,qCAAA,CAAA,CAAA,GAAA,WAAA,aAAA,EAAA,OAAA,oCAAA,CAAA,CAAA,kPAAA,WAAA,aAAA,EAAA,OAAA,oCAAA,CAAA,CAAA,GAAA,WAAA,YAAA,EAAA,OAAA,mCAAA,CAAA,CAAA,qQAAA,WAAA,oBAAA,EAAA,OAAA,2CAAA,CAAA,CAAA,GAAA,WAAA,mBAAA,EAAA,OAAA,0CAAA,CAAA,CAAA;;AAGlB,IAAY,uBAAZ,cAA+B,YAAA;;iBACb;;;;;;kBAEC,eAAA,iBAAA,CAAA"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { safeDefine } from "../safe-define.js";
|
|
2
|
+
import { SkinElement } from "../skin-element.js";
|
|
3
|
+
import { iconState } from "../../skins/dist/default/shared/tailwind/icon-state.js";
|
|
4
|
+
import { renderIcon } from "../../icons/dist/render/default/index.js";
|
|
5
|
+
import { button } from "../../skins/dist/default/default/tailwind/components/button.js";
|
|
6
|
+
import { icon } from "../../skins/dist/default/default/tailwind/components/icon.js";
|
|
7
|
+
import { overlay } from "../../skins/dist/default/default/tailwind/components/overlay.js";
|
|
8
|
+
import { poster } from "../../skins/dist/default/default/tailwind/components/poster.js";
|
|
9
|
+
import { bufferingIndicator, buttonGroupEnd, buttonGroupStart, controls, error, popup, root, slider } from "../../skins/dist/default/default/tailwind/video.tailwind.js";
|
|
10
|
+
import "../video/ui.js";
|
|
11
|
+
import { createTemplate } from "@videojs/utils/dom";
|
|
12
|
+
import { cn } from "@videojs/utils/style";
|
|
13
|
+
//#region src/define/live-video/skin.tailwind.ts
|
|
14
|
+
function getTemplateHTML() {
|
|
15
|
+
return `<media-container class="${root(true)}"> <slot name="media"></slot><slot></slot><media-poster class="${poster(true)}"> <slot name="poster"></slot></media-poster><media-buffering-indicator class="${bufferingIndicator.root}"> <div class="${bufferingIndicator.container}"> ${renderIcon("spinner")} </div></media-buffering-indicator><media-error-dialog class="${error.root}"> <div class="${error.dialog}"> <div class="${error.content}"> <media-alert-dialog-title class="${error.title}">Something went wrong.</media-alert-dialog-title><media-alert-dialog-description class="${error.description}"></media-alert-dialog-description></div><div class="${error.actions}"> <media-alert-dialog-close class="${cn(button.base, button.primary)}">OK</media-alert-dialog-close></div></div></media-error-dialog><media-controls data-controls="" class="${controls}"> <media-tooltip-group><div class="${buttonGroupStart}"> <media-play-button commandfor="play-tooltip" class="${cn(button.base, button.subtle, button.icon, iconState.play.button)}"> ${renderIcon("restart", { class: cn(icon, iconState.play.restart) })} ${renderIcon("play", { class: cn(icon, iconState.play.play) })} ${renderIcon("pause", { class: cn(icon, iconState.play.pause) })} </media-play-button><media-tooltip id="play-tooltip" side="top" class="${cn(popup.tooltip)}"></media-tooltip></div><div class="grow" aria-hidden="true"></div><div class="${buttonGroupEnd}"> <media-mute-button commandfor="live-video-volume-popover" class="${cn(button.base, button.subtle, button.icon, iconState.mute.button)}"> ${renderIcon("volume-off", { class: cn(icon, iconState.mute.volumeOff) })} ${renderIcon("volume-low", { class: cn(icon, iconState.mute.volumeLow) })} ${renderIcon("volume-high", { class: cn(icon, iconState.mute.volumeHigh) })} </media-mute-button><media-popover id="live-video-volume-popover" open-on-hover delay="200" close-delay="100" side="top" class="${cn(popup.popover, popup.volume)}"> <media-volume-slider class="${slider.root}" orientation="vertical" thumb-alignment="edge"> <media-slider-track class="${slider.track}"> <media-slider-fill class="${cn(slider.fill.base, slider.fill.fill)}"></media-slider-fill></media-slider-track><media-slider-thumb class="${cn(slider.thumb.base, slider.thumb.persistent)}"></media-slider-thumb></media-volume-slider></media-popover><media-captions-button commandfor="captions-tooltip" class="${cn(button.base, button.subtle, button.icon, iconState.captions.button)}"> ${renderIcon("captions-off", { class: cn(icon, iconState.captions.off) })} ${renderIcon("captions-on", { class: cn(icon, iconState.captions.on) })} </media-captions-button><media-tooltip id="captions-tooltip" side="top" class="${cn(popup.tooltip)}"></media-tooltip><media-cast-button commandfor="cast-tooltip" class="${cn(button.base, button.subtle, button.icon, iconState.cast.button)}"> ${renderIcon("cast-enter", { class: cn(icon, iconState.cast.enter) })} ${renderIcon("cast-exit", { class: cn(icon, iconState.cast.exit) })} </media-cast-button><media-tooltip id="cast-tooltip" side="top" class="${cn(popup.tooltip)}"></media-tooltip><media-pip-button commandfor="pip-tooltip" class="${cn(button.base, button.subtle, button.icon, iconState.pip.button)}"> ${renderIcon("pip-enter", { class: cn(icon, iconState.pip.off) })} ${renderIcon("pip-exit", { class: cn(icon, iconState.pip.on) })} </media-pip-button><media-tooltip id="pip-tooltip" side="top" class="${cn(popup.tooltip)}"></media-tooltip><media-fullscreen-button commandfor="fullscreen-tooltip" class="${cn(button.base, button.subtle, button.icon, iconState.fullscreen.button)}"> ${renderIcon("fullscreen-enter", { class: cn(icon, iconState.fullscreen.enter) })} ${renderIcon("fullscreen-exit", { class: cn(icon, iconState.fullscreen.exit) })} </media-fullscreen-button><media-tooltip id="fullscreen-tooltip" side="top" class="${cn(popup.tooltip)}"></media-tooltip></div></media-tooltip-group></media-controls><div class="${overlay}"></div></media-container>`;
|
|
16
|
+
}
|
|
17
|
+
var LiveVideoSkinTailwindElement = class extends SkinElement {
|
|
18
|
+
static {
|
|
19
|
+
this.tagName = "live-video-skin-tailwind";
|
|
20
|
+
}
|
|
21
|
+
static {
|
|
22
|
+
this.template = createTemplate(getTemplateHTML());
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
safeDefine(LiveVideoSkinTailwindElement);
|
|
26
|
+
//#endregion
|
|
27
|
+
export { LiveVideoSkinTailwindElement };
|
|
28
|
+
|
|
29
|
+
//# sourceMappingURL=skin.tailwind.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"skin.tailwind.js","names":[],"sources":["../../../../src/define/live-video/skin.tailwind.ts"],"sourcesContent":["import { renderIcon } from '@videojs/icons/render';\nimport {\n bufferingIndicator,\n button,\n buttonGroupEnd,\n buttonGroupStart,\n controls,\n error,\n icon,\n iconState,\n overlay,\n popup,\n poster,\n root,\n slider,\n} from '@videojs/skins/default/tailwind/video.tailwind';\nimport { createTemplate } from '@videojs/utils/dom';\nimport { cn } from '@videojs/utils/style';\nimport { safeDefine } from '../safe-define';\nimport { SkinElement } from '../skin-element';\n\n// Reuse the video preset's UI element registrations.\nimport '../video/ui';\n\nfunction getTemplateHTML() {\n return /*html*/ `\n <media-container class=\"${root(true)}\">\n <!-- @deprecated slot=\"media\" is no longer required, use the default slot instead -->\n <slot name=\"media\"></slot>\n <slot></slot>\n\n <media-poster class=\"${poster(true)}\">\n <slot name=\"poster\"></slot>\n </media-poster>\n\n <media-buffering-indicator class=\"${bufferingIndicator.root}\">\n <div class=\"${bufferingIndicator.container}\">\n ${renderIcon('spinner')}\n </div>\n </media-buffering-indicator>\n\n <media-error-dialog class=\"${error.root}\">\n <div class=\"${error.dialog}\">\n <div class=\"${error.content}\">\n <media-alert-dialog-title class=\"${error.title}\">Something went wrong.</media-alert-dialog-title>\n <media-alert-dialog-description class=\"${error.description}\"></media-alert-dialog-description>\n </div>\n <div class=\"${error.actions}\">\n <media-alert-dialog-close class=\"${cn(button.base, button.primary)}\">OK</media-alert-dialog-close>\n </div>\n </div>\n </media-error-dialog>\n\n <media-controls data-controls=\"\" class=\"${controls}\">\n <media-tooltip-group>\n <div class=\"${buttonGroupStart}\">\n <media-play-button commandfor=\"play-tooltip\" class=\"${cn(button.base, button.subtle, button.icon, iconState.play.button)}\">\n ${renderIcon('restart', { class: cn(icon, iconState.play.restart) })}\n ${renderIcon('play', { class: cn(icon, iconState.play.play) })}\n ${renderIcon('pause', { class: cn(icon, iconState.play.pause) })}\n </media-play-button>\n <media-tooltip id=\"play-tooltip\" side=\"top\" class=\"${cn(popup.tooltip)}\"></media-tooltip>\n </div>\n\n <div class=\"grow\" aria-hidden=\"true\"></div>\n\n <div class=\"${buttonGroupEnd}\">\n <media-mute-button commandfor=\"live-video-volume-popover\" class=\"${cn(button.base, button.subtle, button.icon, iconState.mute.button)}\">\n ${renderIcon('volume-off', { class: cn(icon, iconState.mute.volumeOff) })}\n ${renderIcon('volume-low', { class: cn(icon, iconState.mute.volumeLow) })}\n ${renderIcon('volume-high', { class: cn(icon, iconState.mute.volumeHigh) })}\n </media-mute-button>\n\n <media-popover id=\"live-video-volume-popover\" open-on-hover delay=\"200\" close-delay=\"100\" side=\"top\" class=\"${cn(popup.popover, popup.volume)}\">\n <media-volume-slider class=\"${slider.root}\" orientation=\"vertical\" thumb-alignment=\"edge\">\n <media-slider-track class=\"${slider.track}\">\n <media-slider-fill class=\"${cn(slider.fill.base, slider.fill.fill)}\"></media-slider-fill>\n </media-slider-track>\n <media-slider-thumb class=\"${cn(slider.thumb.base, slider.thumb.persistent)}\"></media-slider-thumb>\n </media-volume-slider>\n </media-popover>\n <media-captions-button commandfor=\"captions-tooltip\" class=\"${cn(button.base, button.subtle, button.icon, iconState.captions.button)}\">\n ${renderIcon('captions-off', { class: cn(icon, iconState.captions.off) })}\n ${renderIcon('captions-on', { class: cn(icon, iconState.captions.on) })}\n </media-captions-button>\n <media-tooltip id=\"captions-tooltip\" side=\"top\" class=\"${cn(popup.tooltip)}\"></media-tooltip>\n <media-cast-button commandfor=\"cast-tooltip\" class=\"${cn(button.base, button.subtle, button.icon, iconState.cast.button)}\">\n ${renderIcon('cast-enter', { class: cn(icon, iconState.cast.enter) })}\n ${renderIcon('cast-exit', { class: cn(icon, iconState.cast.exit) })}\n </media-cast-button>\n <media-tooltip id=\"cast-tooltip\" side=\"top\" class=\"${cn(popup.tooltip)}\"></media-tooltip>\n <media-pip-button commandfor=\"pip-tooltip\" class=\"${cn(button.base, button.subtle, button.icon, iconState.pip.button)}\">\n ${renderIcon('pip-enter', { class: cn(icon, iconState.pip.off) })}\n ${renderIcon('pip-exit', { class: cn(icon, iconState.pip.on) })}\n </media-pip-button>\n <media-tooltip id=\"pip-tooltip\" side=\"top\" class=\"${cn(popup.tooltip)}\"></media-tooltip>\n <media-fullscreen-button commandfor=\"fullscreen-tooltip\" class=\"${cn(button.base, button.subtle, button.icon, iconState.fullscreen.button)}\">\n ${renderIcon('fullscreen-enter', { class: cn(icon, iconState.fullscreen.enter) })}\n ${renderIcon('fullscreen-exit', { class: cn(icon, iconState.fullscreen.exit) })}\n </media-fullscreen-button>\n <media-tooltip id=\"fullscreen-tooltip\" side=\"top\" class=\"${cn(popup.tooltip)}\"></media-tooltip>\n </div>\n </media-tooltip-group>\n </media-controls>\n\n <div class=\"${overlay}\"></div>\n </media-container>\n `;\n}\n\nexport class LiveVideoSkinTailwindElement extends SkinElement {\n static readonly tagName = 'live-video-skin-tailwind';\n static template = createTemplate(getTemplateHTML());\n}\n\nsafeDefine(LiveVideoSkinTailwindElement);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [LiveVideoSkinTailwindElement.tagName]: LiveVideoSkinTailwindElement;\n }\n}\n"],"mappings":";;;;;;;;;;;;;AAwBA,SAAS,kBAAkB;AACzB,QAAgB,2BAAA,KAAA,KAAA,CAAA,iEAAA,OAAA,KAAA,CAAA,iFAAA,mBAAA,KAAA,iBAAA,mBAAA,UAAA,KAAA,WAAA,UAAA,CAAA,gEAAA,MAAA,KAAA,iBAAA,MAAA,OAAA,iBAAA,MAAA,QAAA,sCAAA,MAAA,MAAA,2FAAA,MAAA,YAAA,uDAAA,MAAA,QAAA,sCAAA,GAAA,OAAA,MAAA,OAAA,QAAA,CAAA,0GAAA,SAAA,sCAAA,iBAAA,yDAAA,GAAA,OAAA,MAAA,OAAA,QAAA,OAAA,MAAA,UAAA,KAAA,OAAA,CAAA,KAAA,WAAA,WAAA,EAAA,OAAA,GAAA,MAAA,UAAA,KAAA,QAAA,EAAA,CAAA,CAAA,GAAA,WAAA,QAAA,EAAA,OAAA,GAAA,MAAA,UAAA,KAAA,KAAA,EAAA,CAAA,CAAA,GAAA,WAAA,SAAA,EAAA,OAAA,GAAA,MAAA,UAAA,KAAA,MAAA,EAAA,CAAA,CAAA,0EAAA,GAAA,MAAA,QAAA,CAAA,iFAAA,eAAA,sEAAA,GAAA,OAAA,MAAA,OAAA,QAAA,OAAA,MAAA,UAAA,KAAA,OAAA,CAAA,KAAA,WAAA,cAAA,EAAA,OAAA,GAAA,MAAA,UAAA,KAAA,UAAA,EAAA,CAAA,CAAA,GAAA,WAAA,cAAA,EAAA,OAAA,GAAA,MAAA,UAAA,KAAA,UAAA,EAAA,CAAA,CAAA,GAAA,WAAA,eAAA,EAAA,OAAA,GAAA,MAAA,UAAA,KAAA,WAAA,EAAA,CAAA,CAAA,mIAAA,GAAA,MAAA,SAAA,MAAA,OAAA,CAAA,iCAAA,OAAA,KAAA,8EAAA,OAAA,MAAA,+BAAA,GAAA,OAAA,KAAA,MAAA,OAAA,KAAA,KAAA,CAAA,wEAAA,GAAA,OAAA,MAAA,MAAA,OAAA,MAAA,WAAA,CAAA,2HAAA,GAAA,OAAA,MAAA,OAAA,QAAA,OAAA,MAAA,UAAA,SAAA,OAAA,CAAA,KAAA,WAAA,gBAAA,EAAA,OAAA,GAAA,MAAA,UAAA,SAAA,IAAA,EAAA,CAAA,CAAA,GAAA,WAAA,eAAA,EAAA,OAAA,GAAA,MAAA,UAAA,SAAA,GAAA,EAAA,CAAA,CAAA,kFAAA,GAAA,MAAA,QAAA,CAAA,wEAAA,GAAA,OAAA,MAAA,OAAA,QAAA,OAAA,MAAA,UAAA,KAAA,OAAA,CAAA,KAAA,WAAA,cAAA,EAAA,OAAA,GAAA,MAAA,UAAA,KAAA,MAAA,EAAA,CAAA,CAAA,GAAA,WAAA,aAAA,EAAA,OAAA,GAAA,MAAA,UAAA,KAAA,KAAA,EAAA,CAAA,CAAA,0EAAA,GAAA,MAAA,QAAA,CAAA,sEAAA,GAAA,OAAA,MAAA,OAAA,QAAA,OAAA,MAAA,UAAA,IAAA,OAAA,CAAA,KAAA,WAAA,aAAA,EAAA,OAAA,GAAA,MAAA,UAAA,IAAA,IAAA,EAAA,CAAA,CAAA,GAAA,WAAA,YAAA,EAAA,OAAA,GAAA,MAAA,UAAA,IAAA,GAAA,EAAA,CAAA,CAAA,wEAAA,GAAA,MAAA,QAAA,CAAA,oFAAA,GAAA,OAAA,MAAA,OAAA,QAAA,OAAA,MAAA,UAAA,WAAA,OAAA,CAAA,KAAA,WAAA,oBAAA,EAAA,OAAA,GAAA,MAAA,UAAA,WAAA,MAAA,EAAA,CAAA,CAAA,GAAA,WAAA,mBAAA,EAAA,OAAA,GAAA,MAAA,UAAA,WAAA,KAAA,EAAA,CAAA,CAAA,sFAAA,GAAA,MAAA,QAAA,CAAA,6EAAA,QAAA;;AAGlB,IAAY,+BAAZ,cAA+B,YAAA;;iBACb;;;;;;AAIlB,WAAQ,6BAAY"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import base_default from "../_virtual/inline-css_src/define/base.js";
|
|
2
2
|
import shared_default from "../_virtual/inline-css_src/define/shared.js";
|
|
3
|
-
import { applyShadowStyles, createShadowStyle, ensureGlobalStyle, renderTemplate } from "@videojs/utils/dom";
|
|
4
3
|
import { ReactiveElement } from "@videojs/element";
|
|
4
|
+
import { applyShadowStyles, createShadowStyle, ensureGlobalStyle, renderTemplate } from "@videojs/utils/dom";
|
|
5
5
|
//#region src/define/skin-element.ts
|
|
6
6
|
const STYLES_ID = "__media-styles";
|
|
7
7
|
const sharedSheet = createShadowStyle(shared_default);
|
package/dist/default/index.js
CHANGED
|
@@ -49,6 +49,7 @@ import { tooltipGroupContext } from "./ui/tooltip/context.js";
|
|
|
49
49
|
import { TooltipElement } from "./ui/tooltip/tooltip-element.js";
|
|
50
50
|
import { TooltipGroupElement } from "./ui/tooltip/tooltip-group-element.js";
|
|
51
51
|
import { VolumeSliderElement } from "./ui/volume-slider/volume-slider-element.js";
|
|
52
|
+
import { DestroyMixin, ReactiveElement } from "@videojs/element";
|
|
52
53
|
import { createSelector, shallowEqual } from "@videojs/store";
|
|
53
54
|
export * from "@videojs/core/dom";
|
|
54
|
-
export { AlertDialogCloseElement, AlertDialogDescriptionElement, AlertDialogElement, AlertDialogTitleElement, AriaKeyShortcutsController, BufferingIndicatorElement, CONTAINER_CONTEXT_KEY, CaptionsButtonElement, CastButtonElement, ContextPartElement, ControlsElement, ControlsGroupElement, ErrorDialogElement, FullscreenButtonElement, GestureElement, HotkeyElement, MEDIA_CONTEXT_KEY, MediaAttachMixin, MediaButtonElement, MediaContainerElement, MediaElement, MediaUIElement, MuteButtonElement, PLAYER_CONTEXT_KEY, PiPButtonElement, PlayButtonElement, PlaybackRateButtonElement, PlayerController, PopoverElement, PosterElement, SeekButtonElement, SliderBufferElement, SliderElement, SliderFillElement, SliderPreviewElement, SliderThumbElement, SliderThumbnailElement, SliderTrackElement, SliderValueElement, ThumbnailElement, TimeElement, TimeGroupElement, TimeSeparatorElement, TimeSliderElement, TooltipElement, TooltipGroupElement, VolumeSliderElement, alertDialogContext, containerContext, createContainerMixin, createMediaAttachMixin, createPlayer, createProviderMixin, createSelector, mediaContext, playerContext, shallowEqual, sliderContext, tooltipGroupContext };
|
|
55
|
+
export { AlertDialogCloseElement, AlertDialogDescriptionElement, AlertDialogElement, AlertDialogTitleElement, AriaKeyShortcutsController, BufferingIndicatorElement, CONTAINER_CONTEXT_KEY, CaptionsButtonElement, CastButtonElement, ContextPartElement, ControlsElement, ControlsGroupElement, DestroyMixin, ErrorDialogElement, FullscreenButtonElement, GestureElement, HotkeyElement, MEDIA_CONTEXT_KEY, MediaAttachMixin, MediaButtonElement, MediaContainerElement, MediaElement, MediaUIElement, MuteButtonElement, PLAYER_CONTEXT_KEY, PiPButtonElement, PlayButtonElement, PlaybackRateButtonElement, PlayerController, PopoverElement, PosterElement, ReactiveElement, SeekButtonElement, SliderBufferElement, SliderElement, SliderFillElement, SliderPreviewElement, SliderThumbElement, SliderThumbnailElement, SliderTrackElement, SliderValueElement, ThumbnailElement, TimeElement, TimeGroupElement, TimeSeparatorElement, TimeSliderElement, TooltipElement, TooltipGroupElement, VolumeSliderElement, alertDialogContext, containerContext, createContainerMixin, createMediaAttachMixin, createPlayer, createProviderMixin, createSelector, mediaContext, playerContext, shallowEqual, sliderContext, tooltipGroupContext };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/mux-audio/index.ts"],"sourcesContent":["import { CustomMediaElement } from '@videojs/core/dom/media/custom-media-element';\nimport { MuxAudioMedia } from '@videojs/core/dom/media/mux';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\n\nexport class MuxAudio extends MediaAttachMixin(CustomMediaElement('audio', MuxAudioMedia)) {\n static get observedAttributes() {\n // biome-ignore lint/complexity/noThisInStatic: intentional use of super\n
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/mux-audio/index.ts"],"sourcesContent":["import { CustomMediaElement } from '@videojs/core/dom/media/custom-media-element';\nimport { MuxAudioMedia } from '@videojs/core/dom/media/mux';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\n\nexport class MuxAudio extends MediaAttachMixin(CustomMediaElement('audio', MuxAudioMedia)) {\n static get observedAttributes() {\n return [\n // biome-ignore lint/complexity/noThisInStatic: intentional use of super\n ...super.observedAttributes,\n 'type',\n 'prefer-playback',\n 'debug',\n 'cast-src',\n 'cast-receiver',\n 'cast-content-type',\n ];\n }\n}\n"],"mappings":";;;;AAIA,IAAa,WAAb,cAA8B,iBAAiB,mBAAmB,SAAS,cAAc,CAAC,CAAC;CACzF,WAAW,qBAAqB;AAC9B,SAAO;GAEL,GAAG,MAAM;GACT;GACA;GACA;GACA;GACA;GACA;GACD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/mux-video/index.ts"],"sourcesContent":["import { CustomMediaElement } from '@videojs/core/dom/media/custom-media-element';\nimport { MuxVideoMedia } from '@videojs/core/dom/media/mux';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\n\nexport class MuxVideo extends MediaAttachMixin(CustomMediaElement('video', MuxVideoMedia)) {\n static get observedAttributes() {\n // biome-ignore lint/complexity/noThisInStatic: intentional use of super\n
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/mux-video/index.ts"],"sourcesContent":["import { CustomMediaElement } from '@videojs/core/dom/media/custom-media-element';\nimport { MuxVideoMedia } from '@videojs/core/dom/media/mux';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\n\nexport class MuxVideo extends MediaAttachMixin(CustomMediaElement('video', MuxVideoMedia)) {\n static get observedAttributes() {\n return [\n // biome-ignore lint/complexity/noThisInStatic: intentional use of super\n ...super.observedAttributes,\n 'type',\n 'prefer-playback',\n 'debug',\n 'cast-src',\n 'cast-receiver',\n 'cast-content-type',\n ];\n }\n}\n"],"mappings":";;;;AAIA,IAAa,WAAb,cAA8B,iBAAiB,mBAAmB,SAAS,cAAc,CAAC,CAAC;CACzF,WAAW,qBAAqB;AAC9B,SAAO;GAEL,GAAG,MAAM;GACT;GACA;GACA;GACA;GACA;GACA;GACD"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { MinimalLiveAudioSkinTailwindElement } from "../define/live-audio/minimal-skin.tailwind.js";
|
|
2
|
+
import { MinimalLiveAudioSkinElement } from "../define/live-audio/minimal-skin.js";
|
|
3
|
+
import { LiveAudioSkinTailwindElement } from "../define/live-audio/skin.tailwind.js";
|
|
4
|
+
import { LiveAudioSkinElement } from "../define/live-audio/skin.js";
|
|
5
|
+
import { liveAudioFeatures } from "@videojs/core/dom";
|
|
6
|
+
export { LiveAudioSkinElement, LiveAudioSkinTailwindElement, MinimalLiveAudioSkinElement, MinimalLiveAudioSkinTailwindElement, liveAudioFeatures };
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { MinimalLiveVideoSkinTailwindElement } from "../define/live-video/minimal-skin.tailwind.js";
|
|
2
|
+
import { MinimalLiveVideoSkinElement } from "../define/live-video/minimal-skin.js";
|
|
3
|
+
import { LiveVideoSkinTailwindElement } from "../define/live-video/skin.tailwind.js";
|
|
4
|
+
import { LiveVideoSkinElement } from "../define/live-video/skin.js";
|
|
5
|
+
import { liveVideoFeatures } from "@videojs/core/dom";
|
|
6
|
+
export { LiveVideoSkinElement, LiveVideoSkinTailwindElement, MinimalLiveVideoSkinElement, MinimalLiveVideoSkinTailwindElement, liveVideoFeatures };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { cn } from "@videojs/utils/style";
|
|
2
2
|
//#region ../skins/dist/default/default/tailwind/components/button.js
|
|
3
3
|
const button = {
|
|
4
|
-
base: cn("flex items-center justify-center shrink-0 border-none cursor-pointer select-none text-center touch-manipulation", "py-2 px-4 rounded-full", "outline-2 outline-transparent -outline-offset-2", "transition-[background-color,outline-offset,scale] will-change-[scale] duration-150 ease-out", "active:scale-[0.98]", "disabled:cursor-not-allowed disabled:opacity-50 disabled:grayscale", "focus-visible:outline-current focus-visible:outline-offset-2", "data-[availability=unavailable]:hidden"),
|
|
4
|
+
base: cn("flex items-center justify-center shrink-0 border-none cursor-pointer select-none text-center touch-manipulation", "py-2 px-4 rounded-full", "outline-2 outline-transparent -outline-offset-2", "transition-[background-color,outline-offset,scale] will-change-[scale] duration-150 ease-out", "active:scale-[0.98]", "disabled:cursor-not-allowed disabled:opacity-50 disabled:grayscale", "focus-visible:outline-current focus-visible:outline-offset-2", "data-[availability=unavailable]:hidden", "data-[availability=unsupported]:hidden"),
|
|
5
5
|
primary: "bg-white text-black font-medium text-shadow-none",
|
|
6
6
|
subtle: cn("bg-transparent text-inherit text-shadow-inherit", "hover:bg-current/10 hover:no-underline", "focus-visible:bg-current/10", "aria-expanded:bg-current/10"),
|
|
7
7
|
icon: cn("grid w-9 aspect-square p-0", "active:scale-90")
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","names":[],"sources":["../../../../../../../../../skins/dist/default/default/tailwind/components/button.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n//#region src/default/tailwind/components/button.ts\nconst button = {\n\tbase: cn(\"flex items-center justify-center shrink-0 border-none cursor-pointer select-none text-center touch-manipulation\", \"py-2 px-4 rounded-full\", \"outline-2 outline-transparent -outline-offset-2\", \"transition-[background-color,outline-offset,scale] will-change-[scale] duration-150 ease-out\", \"active:scale-[0.98]\", \"disabled:cursor-not-allowed disabled:opacity-50 disabled:grayscale\", \"focus-visible:outline-current focus-visible:outline-offset-2\", \"data-[availability=unavailable]:hidden\"),\n\tprimary: \"bg-white text-black font-medium text-shadow-none\",\n\tsubtle: cn(\"bg-transparent text-inherit text-shadow-inherit\", \"hover:bg-current/10 hover:no-underline\", \"focus-visible:bg-current/10\", \"aria-expanded:bg-current/10\"),\n\ticon: cn(\"grid w-9 aspect-square p-0\", \"active:scale-90\")\n};\n//#endregion\nexport { button };\n\n//# sourceMappingURL=button.js.map"],"mappings":";;AAEA,MAAM,SAAS;CACd,MAAM,GAAG,mHAAmH,0BAA0B,mDAAmD,gGAAgG,uBAAuB,sEAAsE,gEAAgE,yCAAyC;
|
|
1
|
+
{"version":3,"file":"button.js","names":[],"sources":["../../../../../../../../../skins/dist/default/default/tailwind/components/button.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n//#region src/default/tailwind/components/button.ts\nconst button = {\n\tbase: cn(\"flex items-center justify-center shrink-0 border-none cursor-pointer select-none text-center touch-manipulation\", \"py-2 px-4 rounded-full\", \"outline-2 outline-transparent -outline-offset-2\", \"transition-[background-color,outline-offset,scale] will-change-[scale] duration-150 ease-out\", \"active:scale-[0.98]\", \"disabled:cursor-not-allowed disabled:opacity-50 disabled:grayscale\", \"focus-visible:outline-current focus-visible:outline-offset-2\", \"data-[availability=unavailable]:hidden\", \"data-[availability=unsupported]:hidden\"),\n\tprimary: \"bg-white text-black font-medium text-shadow-none\",\n\tsubtle: cn(\"bg-transparent text-inherit text-shadow-inherit\", \"hover:bg-current/10 hover:no-underline\", \"focus-visible:bg-current/10\", \"aria-expanded:bg-current/10\"),\n\ticon: cn(\"grid w-9 aspect-square p-0\", \"active:scale-90\")\n};\n//#endregion\nexport { button };\n\n//# sourceMappingURL=button.js.map"],"mappings":";;AAEA,MAAM,SAAS;CACd,MAAM,GAAG,mHAAmH,0BAA0B,mDAAmD,gGAAgG,uBAAuB,sEAAsE,gEAAgE,0CAA0C,yCAAyC;CACzhB,SAAS;CACT,QAAQ,GAAG,mDAAmD,0CAA0C,+BAA+B,8BAA8B;CACrK,MAAM,GAAG,8BAA8B,kBAAkB;CACzD"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { cn } from "@videojs/utils/style";
|
|
2
2
|
//#region ../skins/dist/default/minimal/tailwind/components/button.js
|
|
3
3
|
const button = {
|
|
4
|
-
base: cn("flex items-center justify-center shrink-0 border-none cursor-pointer select-none text-center touch-manipulation", "py-2 px-4 rounded-lg", "outline-2 outline-transparent -outline-offset-2", "transition-[background-color,outline-offset,scale] will-change-[scale] duration-150 ease-out", "focus-visible:outline-current focus-visible:outline-offset-2", "active:scale-[0.98]", "disabled:cursor-not-allowed disabled:opacity-50 disabled:grayscale", "supports-[corner-shape:squircle]:rounded-[1rem]", "supports-[corner-shape:squircle]:[corner-shape:squircle]", "data-[availability=unavailable]:hidden"),
|
|
4
|
+
base: cn("flex items-center justify-center shrink-0 border-none cursor-pointer select-none text-center touch-manipulation", "py-2 px-4 rounded-lg", "outline-2 outline-transparent -outline-offset-2", "transition-[background-color,outline-offset,scale] will-change-[scale] duration-150 ease-out", "focus-visible:outline-current focus-visible:outline-offset-2", "active:scale-[0.98]", "disabled:cursor-not-allowed disabled:opacity-50 disabled:grayscale", "supports-[corner-shape:squircle]:rounded-[1rem]", "supports-[corner-shape:squircle]:[corner-shape:squircle]", "data-[availability=unavailable]:hidden", "data-[availability=unsupported]:hidden"),
|
|
5
5
|
primary: "bg-white text-black font-medium text-shadow-none",
|
|
6
6
|
subtle: cn("bg-transparent text-inherit text-shadow-inherit", "hover:bg-current/10", "focus-visible:bg-current/10", "aria-expanded:bg-current/10"),
|
|
7
7
|
icon: cn("grid w-[2.375rem] aspect-square p-0", "active:scale-90")
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/button.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n//#region src/minimal/tailwind/components/button.ts\nconst button = {\n\tbase: cn(\"flex items-center justify-center shrink-0 border-none cursor-pointer select-none text-center touch-manipulation\", \"py-2 px-4 rounded-lg\", \"outline-2 outline-transparent -outline-offset-2\", \"transition-[background-color,outline-offset,scale] will-change-[scale] duration-150 ease-out\", \"focus-visible:outline-current focus-visible:outline-offset-2\", \"active:scale-[0.98]\", \"disabled:cursor-not-allowed disabled:opacity-50 disabled:grayscale\", \"supports-[corner-shape:squircle]:rounded-[1rem]\", \"supports-[corner-shape:squircle]:[corner-shape:squircle]\", \"data-[availability=unavailable]:hidden\"),\n\tprimary: \"bg-white text-black font-medium text-shadow-none\",\n\tsubtle: cn(\"bg-transparent text-inherit text-shadow-inherit\", \"hover:bg-current/10\", \"focus-visible:bg-current/10\", \"aria-expanded:bg-current/10\"),\n\ticon: cn(\"grid w-[2.375rem] aspect-square p-0\", \"active:scale-90\")\n};\n//#endregion\nexport { button };\n\n//# sourceMappingURL=button.js.map"],"mappings":";;AAEA,MAAM,SAAS;CACd,MAAM,GAAG,mHAAmH,wBAAwB,mDAAmD,gGAAgG,gEAAgE,uBAAuB,sEAAsE,mDAAmD,4DAA4D,yCAAyC;
|
|
1
|
+
{"version":3,"file":"button.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/button.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n//#region src/minimal/tailwind/components/button.ts\nconst button = {\n\tbase: cn(\"flex items-center justify-center shrink-0 border-none cursor-pointer select-none text-center touch-manipulation\", \"py-2 px-4 rounded-lg\", \"outline-2 outline-transparent -outline-offset-2\", \"transition-[background-color,outline-offset,scale] will-change-[scale] duration-150 ease-out\", \"focus-visible:outline-current focus-visible:outline-offset-2\", \"active:scale-[0.98]\", \"disabled:cursor-not-allowed disabled:opacity-50 disabled:grayscale\", \"supports-[corner-shape:squircle]:rounded-[1rem]\", \"supports-[corner-shape:squircle]:[corner-shape:squircle]\", \"data-[availability=unavailable]:hidden\", \"data-[availability=unsupported]:hidden\"),\n\tprimary: \"bg-white text-black font-medium text-shadow-none\",\n\tsubtle: cn(\"bg-transparent text-inherit text-shadow-inherit\", \"hover:bg-current/10\", \"focus-visible:bg-current/10\", \"aria-expanded:bg-current/10\"),\n\ticon: cn(\"grid w-[2.375rem] aspect-square p-0\", \"active:scale-90\")\n};\n//#endregion\nexport { button };\n\n//# sourceMappingURL=button.js.map"],"mappings":";;AAEA,MAAM,SAAS;CACd,MAAM,GAAG,mHAAmH,wBAAwB,mDAAmD,gGAAgG,gEAAgE,uBAAuB,sEAAsE,mDAAmD,4DAA4D,0CAA0C,yCAAyC;CACtoB,SAAS;CACT,QAAQ,GAAG,mDAAmD,uBAAuB,+BAA+B,8BAA8B;CAClJ,MAAM,GAAG,uCAAuC,kBAAkB;CAClE"}
|
|
@@ -7,6 +7,11 @@ var AlertDialogCloseElement = class extends MediaElement {
|
|
|
7
7
|
constructor(..._args) {
|
|
8
8
|
super(..._args);
|
|
9
9
|
this.disabled = false;
|
|
10
|
+
this.#ctx = new ContextConsumer(this, {
|
|
11
|
+
context: alertDialogContext,
|
|
12
|
+
subscribe: true
|
|
13
|
+
});
|
|
14
|
+
this.#disconnect = null;
|
|
10
15
|
}
|
|
11
16
|
static {
|
|
12
17
|
this.tagName = "media-alert-dialog-close";
|
|
@@ -14,11 +19,8 @@ var AlertDialogCloseElement = class extends MediaElement {
|
|
|
14
19
|
static {
|
|
15
20
|
this.properties = { disabled: { type: Boolean } };
|
|
16
21
|
}
|
|
17
|
-
#ctx
|
|
18
|
-
|
|
19
|
-
subscribe: true
|
|
20
|
-
});
|
|
21
|
-
#disconnect = null;
|
|
22
|
+
#ctx;
|
|
23
|
+
#disconnect;
|
|
22
24
|
connectedCallback() {
|
|
23
25
|
super.connectedCallback();
|
|
24
26
|
this.#disconnect = new AbortController();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-dialog-close-element.js","names":["#ctx","#disconnect"],"sources":["../../../../src/ui/alert-dialog/alert-dialog-close-element.ts"],"sourcesContent":["import { applyElementProps, applyStateDataAttrs, createButton } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { MediaElement } from '../media-element';\nimport { alertDialogContext } from './context';\n\nexport class AlertDialogCloseElement extends MediaElement {\n static readonly tagName = 'media-alert-dialog-close';\n\n static override properties = {\n disabled: { type: Boolean },\n } satisfies PropertyDeclarationMap<'disabled'>;\n\n disabled = false;\n\n readonly #ctx = new ContextConsumer(this, { context: alertDialogContext, subscribe: true });\n\n #disconnect: AbortController | null = null;\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.#disconnect = new AbortController();\n\n const buttonProps = createButton({\n onActivate: () => this.#ctx.value?.close(),\n isDisabled: () => this.disabled,\n });\n\n applyElementProps(this, buttonProps, { signal: this.#disconnect.signal });\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#disconnect?.abort();\n this.#disconnect = null;\n }\n\n protected override update(_changed: PropertyValues): void {\n super.update(_changed);\n const ctx = this.#ctx.value;\n if (ctx) applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);\n }\n}\n"],"mappings":";;;;;AAOA,IAAa,0BAAb,cAA6C,aAAa;;;kBAO7C;;;
|
|
1
|
+
{"version":3,"file":"alert-dialog-close-element.js","names":["#ctx","#disconnect"],"sources":["../../../../src/ui/alert-dialog/alert-dialog-close-element.ts"],"sourcesContent":["import { applyElementProps, applyStateDataAttrs, createButton } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { MediaElement } from '../media-element';\nimport { alertDialogContext } from './context';\n\nexport class AlertDialogCloseElement extends MediaElement {\n static readonly tagName = 'media-alert-dialog-close';\n\n static override properties = {\n disabled: { type: Boolean },\n } satisfies PropertyDeclarationMap<'disabled'>;\n\n disabled = false;\n\n readonly #ctx = new ContextConsumer(this, { context: alertDialogContext, subscribe: true });\n\n #disconnect: AbortController | null = null;\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.#disconnect = new AbortController();\n\n const buttonProps = createButton({\n onActivate: () => this.#ctx.value?.close(),\n isDisabled: () => this.disabled,\n });\n\n applyElementProps(this, buttonProps, { signal: this.#disconnect.signal });\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#disconnect?.abort();\n this.#disconnect = null;\n }\n\n protected override update(_changed: PropertyValues): void {\n super.update(_changed);\n const ctx = this.#ctx.value;\n if (ctx) applyStateDataAttrs(this, ctx.state, ctx.stateAttrMap);\n }\n}\n"],"mappings":";;;;;AAOA,IAAa,0BAAb,cAA6C,aAAa;;;kBAO7C;cAEK,IAAI,gBAAgB,MAAM;GAAE,SAAS;GAAoB,WAAW;GAAM,CAAC;qBAErD;;;iBAVZ;;;oBAEG,EAC3B,UAAU,EAAE,MAAM,SAAS,EAC5B;;CAID;CAEA;CAEA,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,QAAA,aAAmB,IAAI,iBAAiB;EAExC,MAAM,cAAc,aAAa;GAC/B,kBAAkB,MAAA,IAAU,OAAO,OAAO;GAC1C,kBAAkB,KAAK;GACxB,CAAC;AAEF,oBAAkB,MAAM,aAAa,EAAE,QAAQ,MAAA,WAAiB,QAAQ,CAAC;;CAG3E,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,YAAkB,OAAO;AACzB,QAAA,aAAmB;;CAGrB,OAA0B,UAAgC;AACxD,QAAM,OAAO,SAAS;EACtB,MAAM,MAAM,MAAA,IAAU;AACtB,MAAI,IAAK,qBAAoB,MAAM,IAAI,OAAO,IAAI,aAAa"}
|
|
@@ -13,15 +13,21 @@ var AlertDialogElement = class extends MediaElement {
|
|
|
13
13
|
static {
|
|
14
14
|
this.properties = { open: { type: Boolean } };
|
|
15
15
|
}
|
|
16
|
-
#core
|
|
17
|
-
#provider
|
|
18
|
-
#titleId
|
|
19
|
-
#descriptionId
|
|
20
|
-
#dialog
|
|
21
|
-
#snapshot
|
|
16
|
+
#core;
|
|
17
|
+
#provider;
|
|
18
|
+
#titleId;
|
|
19
|
+
#descriptionId;
|
|
20
|
+
#dialog;
|
|
21
|
+
#snapshot;
|
|
22
22
|
constructor() {
|
|
23
23
|
super();
|
|
24
24
|
this.open = false;
|
|
25
|
+
this.#core = new AlertDialogCore();
|
|
26
|
+
this.#provider = new ContextProvider(this, { context: alertDialogContext });
|
|
27
|
+
this.#titleId = `vjs-alert-dialog-title-${idCounter++}`;
|
|
28
|
+
this.#descriptionId = `vjs-alert-dialog-desc-${idCounter++}`;
|
|
29
|
+
this.#dialog = null;
|
|
30
|
+
this.#snapshot = null;
|
|
25
31
|
this.#core.setTitleId(this.#titleId);
|
|
26
32
|
this.#core.setDescriptionId(this.#descriptionId);
|
|
27
33
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-dialog-element.js","names":["#core","#provider","#titleId","#descriptionId","#dialog","#snapshot"],"sources":["../../../../src/ui/alert-dialog/alert-dialog-element.ts"],"sourcesContent":["import { AlertDialogCore, AlertDialogDataAttrs, type AlertDialogInput } from '@videojs/core';\nimport {\n type AlertDialogApi,\n applyElementProps,\n applyStateDataAttrs,\n createAlertDialog,\n createTransition,\n} from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextProvider } from '@videojs/element/context';\nimport { SnapshotController } from '@videojs/store/html';\n\nimport { MediaElement } from '../media-element';\nimport { alertDialogContext } from './context';\n\nlet idCounter = 0;\n\nexport class AlertDialogElement extends MediaElement {\n static readonly tagName = 'media-alert-dialog';\n\n static override properties = {\n open: { type: Boolean },\n } satisfies PropertyDeclarationMap<'open'>;\n\n open = false;\n\n readonly #core = new AlertDialogCore();\n readonly #provider = new ContextProvider(this, { context: alertDialogContext });\n readonly #titleId = `vjs-alert-dialog-title-${idCounter++}`;\n readonly #descriptionId = `vjs-alert-dialog-desc-${idCounter++}`;\n\n #dialog: AlertDialogApi | null = null;\n #snapshot: SnapshotController<AlertDialogInput> | null = null;\n\n constructor() {\n super();\n this.#core.setTitleId(this.#titleId);\n this.#core.setDescriptionId(this.#descriptionId);\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n if (this.destroyed) return;\n\n this.#dialog = createAlertDialog({\n transition: createTransition(),\n onOpenChange: (nextOpen: boolean) => {\n this.open = nextOpen;\n this.dispatchEvent(new CustomEvent('open-change', { detail: { open: nextOpen } }));\n },\n });\n\n // Register self as the dialog element.\n this.#dialog.setElement(this);\n\n if (this.#snapshot) {\n this.#snapshot.track(this.#dialog.input);\n } else {\n this.#snapshot = new SnapshotController(this, this.#dialog.input);\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#dialog?.destroy();\n this.#dialog = null;\n }\n\n protected override willUpdate(changed: PropertyValues): void {\n super.willUpdate(changed);\n\n // Sync controlled open state.\n if (this.#dialog && changed.has('open')) {\n const { active: inputOpen } = this.#dialog.input.current;\n if (this.open !== inputOpen) {\n if (this.open) {\n this.#dialog.open();\n } else {\n this.#dialog.close();\n }\n }\n }\n }\n\n protected override update(_changed: PropertyValues): void {\n super.update(_changed);\n if (!this.#dialog) return;\n\n const input = this.#dialog.input.current;\n this.#core.setInput(input);\n const state = this.#core.getState();\n\n applyElementProps(this, this.#core.getAttrs(state));\n applyStateDataAttrs(this, state, AlertDialogDataAttrs);\n\n this.#provider.setValue({\n state,\n stateAttrMap: AlertDialogDataAttrs,\n close: () => this.#dialog?.close(),\n });\n }\n}\n"],"mappings":";;;;;;;AAeA,IAAI,YAAY;AAEhB,IAAa,qBAAb,cAAwC,aAAa;;iBACzB;;;oBAEG,EAC3B,MAAM,EAAE,MAAM,SAAS,EACxB;;CAID,
|
|
1
|
+
{"version":3,"file":"alert-dialog-element.js","names":["#core","#provider","#titleId","#descriptionId","#dialog","#snapshot"],"sources":["../../../../src/ui/alert-dialog/alert-dialog-element.ts"],"sourcesContent":["import { AlertDialogCore, AlertDialogDataAttrs, type AlertDialogInput } from '@videojs/core';\nimport {\n type AlertDialogApi,\n applyElementProps,\n applyStateDataAttrs,\n createAlertDialog,\n createTransition,\n} from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextProvider } from '@videojs/element/context';\nimport { SnapshotController } from '@videojs/store/html';\n\nimport { MediaElement } from '../media-element';\nimport { alertDialogContext } from './context';\n\nlet idCounter = 0;\n\nexport class AlertDialogElement extends MediaElement {\n static readonly tagName = 'media-alert-dialog';\n\n static override properties = {\n open: { type: Boolean },\n } satisfies PropertyDeclarationMap<'open'>;\n\n open = false;\n\n readonly #core = new AlertDialogCore();\n readonly #provider = new ContextProvider(this, { context: alertDialogContext });\n readonly #titleId = `vjs-alert-dialog-title-${idCounter++}`;\n readonly #descriptionId = `vjs-alert-dialog-desc-${idCounter++}`;\n\n #dialog: AlertDialogApi | null = null;\n #snapshot: SnapshotController<AlertDialogInput> | null = null;\n\n constructor() {\n super();\n this.#core.setTitleId(this.#titleId);\n this.#core.setDescriptionId(this.#descriptionId);\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n if (this.destroyed) return;\n\n this.#dialog = createAlertDialog({\n transition: createTransition(),\n onOpenChange: (nextOpen: boolean) => {\n this.open = nextOpen;\n this.dispatchEvent(new CustomEvent('open-change', { detail: { open: nextOpen } }));\n },\n });\n\n // Register self as the dialog element.\n this.#dialog.setElement(this);\n\n if (this.#snapshot) {\n this.#snapshot.track(this.#dialog.input);\n } else {\n this.#snapshot = new SnapshotController(this, this.#dialog.input);\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#dialog?.destroy();\n this.#dialog = null;\n }\n\n protected override willUpdate(changed: PropertyValues): void {\n super.willUpdate(changed);\n\n // Sync controlled open state.\n if (this.#dialog && changed.has('open')) {\n const { active: inputOpen } = this.#dialog.input.current;\n if (this.open !== inputOpen) {\n if (this.open) {\n this.#dialog.open();\n } else {\n this.#dialog.close();\n }\n }\n }\n }\n\n protected override update(_changed: PropertyValues): void {\n super.update(_changed);\n if (!this.#dialog) return;\n\n const input = this.#dialog.input.current;\n this.#core.setInput(input);\n const state = this.#core.getState();\n\n applyElementProps(this, this.#core.getAttrs(state));\n applyStateDataAttrs(this, state, AlertDialogDataAttrs);\n\n this.#provider.setValue({\n state,\n stateAttrMap: AlertDialogDataAttrs,\n close: () => this.#dialog?.close(),\n });\n }\n}\n"],"mappings":";;;;;;;AAeA,IAAI,YAAY;AAEhB,IAAa,qBAAb,cAAwC,aAAa;;iBACzB;;;oBAEG,EAC3B,MAAM,EAAE,MAAM,SAAS,EACxB;;CAID;CACA;CACA;CACA;CAEA;CACA;CAEA,cAAc;AACZ,SAAO;cAXF;eAEU,IAAI,iBAAiB;mBACjB,IAAI,gBAAgB,MAAM,EAAE,SAAS,oBAAoB,CAAC;kBAC3D,0BAA0B;wBACpB,yBAAyB;iBAElB;mBACwB;AAIvD,QAAA,KAAW,WAAW,MAAA,QAAc;AACpC,QAAA,KAAW,iBAAiB,MAAA,cAAoB;;CAGlD,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,MAAI,KAAK,UAAW;AAEpB,QAAA,SAAe,kBAAkB;GAC/B,YAAY,kBAAkB;GAC9B,eAAe,aAAsB;AACnC,SAAK,OAAO;AACZ,SAAK,cAAc,IAAI,YAAY,eAAe,EAAE,QAAQ,EAAE,MAAM,UAAU,EAAE,CAAC,CAAC;;GAErF,CAAC;AAGF,QAAA,OAAa,WAAW,KAAK;AAE7B,MAAI,MAAA,SACF,OAAA,SAAe,MAAM,MAAA,OAAa,MAAM;MAExC,OAAA,WAAiB,IAAI,mBAAmB,MAAM,MAAA,OAAa,MAAM;;CAIrE,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,QAAc,SAAS;AACvB,QAAA,SAAe;;CAGjB,WAA8B,SAA+B;AAC3D,QAAM,WAAW,QAAQ;AAGzB,MAAI,MAAA,UAAgB,QAAQ,IAAI,OAAO,EAAE;GACvC,MAAM,EAAE,QAAQ,cAAc,MAAA,OAAa,MAAM;AACjD,OAAI,KAAK,SAAS,UAChB,KAAI,KAAK,KACP,OAAA,OAAa,MAAM;OAEnB,OAAA,OAAa,OAAO;;;CAM5B,OAA0B,UAAgC;AACxD,QAAM,OAAO,SAAS;AACtB,MAAI,CAAC,MAAA,OAAc;EAEnB,MAAM,QAAQ,MAAA,OAAa,MAAM;AACjC,QAAA,KAAW,SAAS,MAAM;EAC1B,MAAM,QAAQ,MAAA,KAAW,UAAU;AAEnC,oBAAkB,MAAM,MAAA,KAAW,SAAS,MAAM,CAAC;AACnD,sBAAoB,MAAM,OAAO,qBAAqB;AAEtD,QAAA,SAAe,SAAS;GACtB;GACA,cAAc;GACd,aAAa,MAAA,QAAc,OAAO;GACnC,CAAC"}
|
|
@@ -8,6 +8,9 @@ var BufferingIndicatorElement = class extends MediaElement {
|
|
|
8
8
|
constructor(..._args) {
|
|
9
9
|
super(..._args);
|
|
10
10
|
this.delay = BufferingIndicatorCore.defaultProps.delay;
|
|
11
|
+
this.#core = new BufferingIndicatorCore();
|
|
12
|
+
this.#state = new PlayerController(this, playerContext, selectPlayback);
|
|
13
|
+
this.#disconnect = null;
|
|
11
14
|
}
|
|
12
15
|
static {
|
|
13
16
|
this.tagName = "media-buffering-indicator";
|
|
@@ -15,9 +18,9 @@ var BufferingIndicatorElement = class extends MediaElement {
|
|
|
15
18
|
static {
|
|
16
19
|
this.properties = { delay: { type: Number } };
|
|
17
20
|
}
|
|
18
|
-
#core
|
|
19
|
-
#state
|
|
20
|
-
#disconnect
|
|
21
|
+
#core;
|
|
22
|
+
#state;
|
|
23
|
+
#disconnect;
|
|
21
24
|
connectedCallback() {
|
|
22
25
|
super.connectedCallback();
|
|
23
26
|
if (this.destroyed) return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buffering-indicator-element.js","names":["#core","#state","#disconnect"],"sources":["../../../../src/ui/buffering-indicator/buffering-indicator-element.ts"],"sourcesContent":["import { BufferingIndicatorCore, BufferingIndicatorDataAttrs } from '@videojs/core';\nimport { applyStateDataAttrs, logMissingFeature, selectPlayback } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaElement } from '../media-element';\n\nexport class BufferingIndicatorElement extends MediaElement {\n static readonly tagName = 'media-buffering-indicator';\n\n static override properties = {\n delay: { type: Number },\n } satisfies PropertyDeclarationMap<keyof BufferingIndicatorCore.Props>;\n\n delay = BufferingIndicatorCore.defaultProps.delay;\n\n readonly #core = new BufferingIndicatorCore();\n readonly #state = new PlayerController(this, playerContext, selectPlayback);\n\n #disconnect: AbortController | null = null;\n\n override connectedCallback(): void {\n super.connectedCallback();\n if (this.destroyed) return;\n\n this.#disconnect = new AbortController();\n\n this.#core.state.subscribe(() => this.requestUpdate(), {\n signal: this.#disconnect.signal,\n });\n\n if (__DEV__ && !this.#state.value) {\n logMissingFeature(this.localName, this.#state.displayName!);\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#disconnect?.abort();\n this.#disconnect = null;\n }\n\n protected override willUpdate(changed: PropertyValues): void {\n super.willUpdate(changed);\n this.#core.setProps(this);\n }\n\n protected override update(changed: PropertyValues): void {\n super.update(changed);\n\n const media = this.#state.value;\n\n if (!media) return;\n\n this.#core.update(media);\n applyStateDataAttrs(this, this.#core.state.current, BufferingIndicatorDataAttrs);\n }\n}\n"],"mappings":";;;;;;AAQA,IAAa,4BAAb,cAA+C,aAAa;;;eAOlD,uBAAuB,aAAa;;;
|
|
1
|
+
{"version":3,"file":"buffering-indicator-element.js","names":["#core","#state","#disconnect"],"sources":["../../../../src/ui/buffering-indicator/buffering-indicator-element.ts"],"sourcesContent":["import { BufferingIndicatorCore, BufferingIndicatorDataAttrs } from '@videojs/core';\nimport { applyStateDataAttrs, logMissingFeature, selectPlayback } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaElement } from '../media-element';\n\nexport class BufferingIndicatorElement extends MediaElement {\n static readonly tagName = 'media-buffering-indicator';\n\n static override properties = {\n delay: { type: Number },\n } satisfies PropertyDeclarationMap<keyof BufferingIndicatorCore.Props>;\n\n delay = BufferingIndicatorCore.defaultProps.delay;\n\n readonly #core = new BufferingIndicatorCore();\n readonly #state = new PlayerController(this, playerContext, selectPlayback);\n\n #disconnect: AbortController | null = null;\n\n override connectedCallback(): void {\n super.connectedCallback();\n if (this.destroyed) return;\n\n this.#disconnect = new AbortController();\n\n this.#core.state.subscribe(() => this.requestUpdate(), {\n signal: this.#disconnect.signal,\n });\n\n if (__DEV__ && !this.#state.value) {\n logMissingFeature(this.localName, this.#state.displayName!);\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#disconnect?.abort();\n this.#disconnect = null;\n }\n\n protected override willUpdate(changed: PropertyValues): void {\n super.willUpdate(changed);\n this.#core.setProps(this);\n }\n\n protected override update(changed: PropertyValues): void {\n super.update(changed);\n\n const media = this.#state.value;\n\n if (!media) return;\n\n this.#core.update(media);\n applyStateDataAttrs(this, this.#core.state.current, BufferingIndicatorDataAttrs);\n }\n}\n"],"mappings":";;;;;;AAQA,IAAa,4BAAb,cAA+C,aAAa;;;eAOlD,uBAAuB,aAAa;eAE3B,IAAI,wBAAwB;gBAC3B,IAAI,iBAAiB,MAAM,eAAe,eAAe;qBAErC;;;iBAXZ;;;oBAEG,EAC3B,OAAO,EAAE,MAAM,QAAQ,EACxB;;CAID;CACA;CAEA;CAEA,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,MAAI,KAAK,UAAW;AAEpB,QAAA,aAAmB,IAAI,iBAAiB;AAExC,QAAA,KAAW,MAAM,gBAAgB,KAAK,eAAe,EAAE,EACrD,QAAQ,MAAA,WAAiB,QAC1B,CAAC;;CAOJ,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,YAAkB,OAAO;AACzB,QAAA,aAAmB;;CAGrB,WAA8B,SAA+B;AAC3D,QAAM,WAAW,QAAQ;AACzB,QAAA,KAAW,SAAS,KAAK;;CAG3B,OAA0B,SAA+B;AACvD,QAAM,OAAO,QAAQ;EAErB,MAAM,QAAQ,MAAA,MAAY;AAE1B,MAAI,CAAC,MAAO;AAEZ,QAAA,KAAW,OAAO,MAAM;AACxB,sBAAoB,MAAM,MAAA,KAAW,MAAM,SAAS,4BAA4B"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { playerContext } from "../../player/context.js";
|
|
2
2
|
import { PlayerController } from "../../player/player-controller.js";
|
|
3
3
|
import { MediaButtonElement } from "../media-button-element.js";
|
|
4
|
-
import {
|
|
4
|
+
import { selectRemotePlayback } from "@videojs/core/dom";
|
|
5
5
|
import { CastButtonCore, CastButtonDataAttrs } from "@videojs/core";
|
|
6
6
|
//#region src/ui/cast-button/cast-button-element.ts
|
|
7
7
|
var CastButtonElement = class extends MediaButtonElement {
|
|
@@ -9,7 +9,7 @@ var CastButtonElement = class extends MediaButtonElement {
|
|
|
9
9
|
super(..._args);
|
|
10
10
|
this.core = new CastButtonCore();
|
|
11
11
|
this.stateAttrMap = CastButtonDataAttrs;
|
|
12
|
-
this.mediaState = new PlayerController(this, playerContext,
|
|
12
|
+
this.mediaState = new PlayerController(this, playerContext, selectRemotePlayback);
|
|
13
13
|
}
|
|
14
14
|
static {
|
|
15
15
|
this.tagName = "media-cast-button";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cast-button-element.js","names":[],"sources":["../../../../src/ui/cast-button/cast-button-element.ts"],"sourcesContent":["import { CastButtonCore, CastButtonDataAttrs, type
|
|
1
|
+
{"version":3,"file":"cast-button-element.js","names":[],"sources":["../../../../src/ui/cast-button/cast-button-element.ts"],"sourcesContent":["import { CastButtonCore, CastButtonDataAttrs, type MediaRemotePlaybackState } from '@videojs/core';\nimport { selectRemotePlayback } from '@videojs/core/dom';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaButtonElement } from '../media-button-element';\n\nexport class CastButtonElement extends MediaButtonElement<CastButtonCore> {\n static readonly tagName = 'media-cast-button';\n\n protected readonly core = new CastButtonCore();\n protected readonly stateAttrMap = CastButtonDataAttrs;\n protected readonly mediaState = new PlayerController(this, playerContext, selectRemotePlayback);\n\n protected activate(state: MediaRemotePlaybackState): void {\n this.core.toggle(state);\n }\n}\n"],"mappings":";;;;;;AAOA,IAAa,oBAAb,cAAuC,mBAAmC;;;cAG9C,IAAI,gBAAgB;sBACZ;oBACF,IAAI,iBAAiB,MAAM,eAAe,qBAAqB;;;iBAJrE;;CAM1B,SAAmB,OAAuC;AACxD,OAAK,KAAK,OAAO,MAAM"}
|
|
@@ -50,7 +50,10 @@ var ErrorDialogElement = class extends MediaElement {
|
|
|
50
50
|
const errorState = this.#errorState.value;
|
|
51
51
|
const hasError = Boolean(errorState?.error);
|
|
52
52
|
const { active: isOpen } = this.#dialog.input.current;
|
|
53
|
-
if (errorState?.error)
|
|
53
|
+
if (errorState?.error) {
|
|
54
|
+
const message = errorState.error.message?.trim();
|
|
55
|
+
this.#lastErrorMessage = message || null;
|
|
56
|
+
}
|
|
54
57
|
const desc = this.querySelector("media-alert-dialog-description");
|
|
55
58
|
if (desc) desc.textContent = this.#lastErrorMessage ?? FALLBACK_MESSAGE;
|
|
56
59
|
if (hasError && !isOpen) this.#dialog.open();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"error-dialog-element.js","names":["#core","#provider","#titleId","#descriptionId","#errorState","#dialog","#snapshot","#lastErrorMessage"],"sources":["../../../../src/ui/error-dialog/error-dialog-element.ts"],"sourcesContent":["import { AlertDialogDataAttrs, type AlertDialogInput, ErrorDialogCore } from '@videojs/core';\nimport {\n type AlertDialogApi,\n applyElementProps,\n applyStateDataAttrs,\n createAlertDialog,\n createTransition,\n selectError,\n} from '@videojs/core/dom';\nimport type { PropertyValues } from '@videojs/element';\nimport { ContextProvider } from '@videojs/element/context';\nimport { SnapshotController } from '@videojs/store/html';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { alertDialogContext } from '../alert-dialog/context';\nimport { MediaElement } from '../media-element';\n\nconst FALLBACK_MESSAGE = 'An error occurred. Please try again.';\n\nlet idCounter = 0;\n\nexport class ErrorDialogElement extends MediaElement {\n static readonly tagName = 'media-error-dialog';\n\n readonly #core = new ErrorDialogCore();\n readonly #provider = new ContextProvider(this, { context: alertDialogContext });\n readonly #titleId = `vjs-error-dialog-title-${idCounter++}`;\n readonly #descriptionId = `vjs-error-dialog-desc-${idCounter++}`;\n readonly #errorState = new PlayerController(this, playerContext, selectError);\n\n #dialog: AlertDialogApi | null = null;\n #snapshot: SnapshotController<AlertDialogInput> | null = null;\n #lastErrorMessage: string | null = null;\n\n constructor() {\n super();\n this.#core.setTitleId(this.#titleId);\n this.#core.setDescriptionId(this.#descriptionId);\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n if (this.destroyed) return;\n\n this.#dialog = createAlertDialog({\n transition: createTransition(),\n onOpenChange: (nextOpen: boolean) => {\n if (!nextOpen) {\n this.#errorState.value?.dismissError();\n }\n },\n });\n\n this.#dialog.setElement(this);\n\n if (this.#snapshot) {\n this.#snapshot.track(this.#dialog.input);\n } else {\n this.#snapshot = new SnapshotController(this, this.#dialog.input);\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#dialog?.destroy();\n this.#dialog = null;\n }\n\n protected override willUpdate(_changed: PropertyValues): void {\n super.willUpdate(_changed);\n if (!this.#dialog) return;\n\n const errorState = this.#errorState.value;\n const hasError = Boolean(errorState?.error);\n const { active: isOpen } = this.#dialog.input.current;\n\n if (errorState?.error) {\n const message = errorState.error.message?.trim();\n this.#lastErrorMessage = message || null;\n }\n\n // Set description text before opening so content is ready for the transition.\n const desc = this.querySelector('media-alert-dialog-description');\n if (desc) {\n desc.textContent = this.#lastErrorMessage ?? FALLBACK_MESSAGE;\n }\n\n if (hasError && !isOpen) {\n this.#dialog.open();\n } else if (!hasError && isOpen) {\n this.#dialog.close();\n }\n }\n\n protected override update(_changed: PropertyValues): void {\n super.update(_changed);\n if (!this.#dialog) return;\n\n const input = this.#dialog.input.current;\n this.#core.setInput(input);\n const state = this.#core.getState();\n\n applyElementProps(this, this.#core.getAttrs(state));\n applyStateDataAttrs(this, state, AlertDialogDataAttrs);\n\n this.#provider.setValue({\n state,\n stateAttrMap: AlertDialogDataAttrs,\n close: () => this.#dialog?.close(),\n });\n }\n}\n"],"mappings":";;;;;;;;;AAkBA,MAAM,mBAAmB;AAEzB,IAAI,YAAY;AAEhB,IAAa,qBAAb,cAAwC,aAAa;;iBACzB;;CAE1B,QAAiB,IAAI,iBAAiB;CACtC,YAAqB,IAAI,gBAAgB,MAAM,EAAE,SAAS,oBAAoB,CAAC;CAC/E,WAAoB,0BAA0B;CAC9C,iBAA0B,yBAAyB;CACnD,cAAuB,IAAI,iBAAiB,MAAM,eAAe,YAAY;CAE7E,UAAiC;CACjC,YAAyD;CACzD,oBAAmC;CAEnC,cAAc;AACZ,SAAO;AACP,QAAA,KAAW,WAAW,MAAA,QAAc;AACpC,QAAA,KAAW,iBAAiB,MAAA,cAAoB;;CAGlD,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,MAAI,KAAK,UAAW;AAEpB,QAAA,SAAe,kBAAkB;GAC/B,YAAY,kBAAkB;GAC9B,eAAe,aAAsB;AACnC,QAAI,CAAC,SACH,OAAA,WAAiB,OAAO,cAAc;;GAG3C,CAAC;AAEF,QAAA,OAAa,WAAW,KAAK;AAE7B,MAAI,MAAA,SACF,OAAA,SAAe,MAAM,MAAA,OAAa,MAAM;MAExC,OAAA,WAAiB,IAAI,mBAAmB,MAAM,MAAA,OAAa,MAAM;;CAIrE,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,QAAc,SAAS;AACvB,QAAA,SAAe;;CAGjB,WAA8B,UAAgC;AAC5D,QAAM,WAAW,SAAS;AAC1B,MAAI,CAAC,MAAA,OAAc;EAEnB,MAAM,aAAa,MAAA,WAAiB;EACpC,MAAM,WAAW,QAAQ,YAAY,MAAM;EAC3C,MAAM,EAAE,QAAQ,WAAW,MAAA,OAAa,MAAM;AAE9C,MAAI,YAAY,
|
|
1
|
+
{"version":3,"file":"error-dialog-element.js","names":["#core","#provider","#titleId","#descriptionId","#errorState","#dialog","#snapshot","#lastErrorMessage"],"sources":["../../../../src/ui/error-dialog/error-dialog-element.ts"],"sourcesContent":["import { AlertDialogDataAttrs, type AlertDialogInput, ErrorDialogCore } from '@videojs/core';\nimport {\n type AlertDialogApi,\n applyElementProps,\n applyStateDataAttrs,\n createAlertDialog,\n createTransition,\n selectError,\n} from '@videojs/core/dom';\nimport type { PropertyValues } from '@videojs/element';\nimport { ContextProvider } from '@videojs/element/context';\nimport { SnapshotController } from '@videojs/store/html';\n\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { alertDialogContext } from '../alert-dialog/context';\nimport { MediaElement } from '../media-element';\n\nconst FALLBACK_MESSAGE = 'An error occurred. Please try again.';\n\nlet idCounter = 0;\n\nexport class ErrorDialogElement extends MediaElement {\n static readonly tagName = 'media-error-dialog';\n\n readonly #core = new ErrorDialogCore();\n readonly #provider = new ContextProvider(this, { context: alertDialogContext });\n readonly #titleId = `vjs-error-dialog-title-${idCounter++}`;\n readonly #descriptionId = `vjs-error-dialog-desc-${idCounter++}`;\n readonly #errorState = new PlayerController(this, playerContext, selectError);\n\n #dialog: AlertDialogApi | null = null;\n #snapshot: SnapshotController<AlertDialogInput> | null = null;\n #lastErrorMessage: string | null = null;\n\n constructor() {\n super();\n this.#core.setTitleId(this.#titleId);\n this.#core.setDescriptionId(this.#descriptionId);\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n if (this.destroyed) return;\n\n this.#dialog = createAlertDialog({\n transition: createTransition(),\n onOpenChange: (nextOpen: boolean) => {\n if (!nextOpen) {\n this.#errorState.value?.dismissError();\n }\n },\n });\n\n this.#dialog.setElement(this);\n\n if (this.#snapshot) {\n this.#snapshot.track(this.#dialog.input);\n } else {\n this.#snapshot = new SnapshotController(this, this.#dialog.input);\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#dialog?.destroy();\n this.#dialog = null;\n }\n\n protected override willUpdate(_changed: PropertyValues): void {\n super.willUpdate(_changed);\n if (!this.#dialog) return;\n\n const errorState = this.#errorState.value;\n const hasError = Boolean(errorState?.error);\n const { active: isOpen } = this.#dialog.input.current;\n\n if (errorState?.error) {\n const message = errorState.error.message?.trim();\n this.#lastErrorMessage = message || null;\n }\n\n // Set description text before opening so content is ready for the transition.\n const desc = this.querySelector('media-alert-dialog-description');\n if (desc) {\n desc.textContent = this.#lastErrorMessage ?? FALLBACK_MESSAGE;\n }\n\n if (hasError && !isOpen) {\n this.#dialog.open();\n } else if (!hasError && isOpen) {\n this.#dialog.close();\n }\n }\n\n protected override update(_changed: PropertyValues): void {\n super.update(_changed);\n if (!this.#dialog) return;\n\n const input = this.#dialog.input.current;\n this.#core.setInput(input);\n const state = this.#core.getState();\n\n applyElementProps(this, this.#core.getAttrs(state));\n applyStateDataAttrs(this, state, AlertDialogDataAttrs);\n\n this.#provider.setValue({\n state,\n stateAttrMap: AlertDialogDataAttrs,\n close: () => this.#dialog?.close(),\n });\n }\n}\n"],"mappings":";;;;;;;;;AAkBA,MAAM,mBAAmB;AAEzB,IAAI,YAAY;AAEhB,IAAa,qBAAb,cAAwC,aAAa;;iBACzB;;CAE1B,QAAiB,IAAI,iBAAiB;CACtC,YAAqB,IAAI,gBAAgB,MAAM,EAAE,SAAS,oBAAoB,CAAC;CAC/E,WAAoB,0BAA0B;CAC9C,iBAA0B,yBAAyB;CACnD,cAAuB,IAAI,iBAAiB,MAAM,eAAe,YAAY;CAE7E,UAAiC;CACjC,YAAyD;CACzD,oBAAmC;CAEnC,cAAc;AACZ,SAAO;AACP,QAAA,KAAW,WAAW,MAAA,QAAc;AACpC,QAAA,KAAW,iBAAiB,MAAA,cAAoB;;CAGlD,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,MAAI,KAAK,UAAW;AAEpB,QAAA,SAAe,kBAAkB;GAC/B,YAAY,kBAAkB;GAC9B,eAAe,aAAsB;AACnC,QAAI,CAAC,SACH,OAAA,WAAiB,OAAO,cAAc;;GAG3C,CAAC;AAEF,QAAA,OAAa,WAAW,KAAK;AAE7B,MAAI,MAAA,SACF,OAAA,SAAe,MAAM,MAAA,OAAa,MAAM;MAExC,OAAA,WAAiB,IAAI,mBAAmB,MAAM,MAAA,OAAa,MAAM;;CAIrE,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,QAAc,SAAS;AACvB,QAAA,SAAe;;CAGjB,WAA8B,UAAgC;AAC5D,QAAM,WAAW,SAAS;AAC1B,MAAI,CAAC,MAAA,OAAc;EAEnB,MAAM,aAAa,MAAA,WAAiB;EACpC,MAAM,WAAW,QAAQ,YAAY,MAAM;EAC3C,MAAM,EAAE,QAAQ,WAAW,MAAA,OAAa,MAAM;AAE9C,MAAI,YAAY,OAAO;GACrB,MAAM,UAAU,WAAW,MAAM,SAAS,MAAM;AAChD,SAAA,mBAAyB,WAAW;;EAItC,MAAM,OAAO,KAAK,cAAc,iCAAiC;AACjE,MAAI,KACF,MAAK,cAAc,MAAA,oBAA0B;AAG/C,MAAI,YAAY,CAAC,OACf,OAAA,OAAa,MAAM;WACV,CAAC,YAAY,OACtB,OAAA,OAAa,OAAO;;CAIxB,OAA0B,UAAgC;AACxD,QAAM,OAAO,SAAS;AACtB,MAAI,CAAC,MAAA,OAAc;EAEnB,MAAM,QAAQ,MAAA,OAAa,MAAM;AACjC,QAAA,KAAW,SAAS,MAAM;EAC1B,MAAM,QAAQ,MAAA,KAAW,UAAU;AAEnC,oBAAkB,MAAM,MAAA,KAAW,SAAS,MAAM,CAAC;AACnD,sBAAoB,MAAM,OAAO,qBAAqB;AAEtD,QAAA,SAAe,SAAS;GACtB;GACA,cAAc;GACd,aAAa,MAAA,QAAc,OAAO;GACnC,CAAC"}
|
|
@@ -13,6 +13,13 @@ var GestureElement = class extends MediaElement {
|
|
|
13
13
|
this.pointer = void 0;
|
|
14
14
|
this.region = void 0;
|
|
15
15
|
this.disabled = false;
|
|
16
|
+
this.#player = new PlayerController(this, playerContext);
|
|
17
|
+
this.#container = new ContextConsumer(this, {
|
|
18
|
+
context: containerContext,
|
|
19
|
+
callback: () => this.requestUpdate(),
|
|
20
|
+
subscribe: true
|
|
21
|
+
});
|
|
22
|
+
this.#cleanup = null;
|
|
16
23
|
}
|
|
17
24
|
static {
|
|
18
25
|
this.tagName = "media-gesture";
|
|
@@ -27,13 +34,9 @@ var GestureElement = class extends MediaElement {
|
|
|
27
34
|
disabled: { type: Boolean }
|
|
28
35
|
};
|
|
29
36
|
}
|
|
30
|
-
#player
|
|
31
|
-
#container
|
|
32
|
-
|
|
33
|
-
callback: () => this.requestUpdate(),
|
|
34
|
-
subscribe: true
|
|
35
|
-
});
|
|
36
|
-
#cleanup = null;
|
|
37
|
+
#player;
|
|
38
|
+
#container;
|
|
39
|
+
#cleanup;
|
|
37
40
|
connectedCallback() {
|
|
38
41
|
super.connectedCallback();
|
|
39
42
|
this.style.display = "none";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"gesture-element.js","names":["#player","#container","#register","#unregister","#cleanup"],"sources":["../../../../src/ui/gesture/gesture-element.ts"],"sourcesContent":["import {\n createDoubleTapGesture,\n createTapGesture,\n type GestureActionName,\n type GesturePointerType,\n type GestureRegion,\n resolveGestureAction,\n} from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { containerContext, playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaElement } from '../media-element';\n\nexport class GestureElement extends MediaElement {\n static readonly tagName = 'media-gesture';\n\n static override properties: PropertyDeclarationMap = {\n type: { type: String },\n action: { type: String },\n value: { type: Number },\n pointer: { type: String },\n region: { type: String },\n disabled: { type: Boolean },\n };\n\n type: 'tap' | 'doubletap' | (string & {}) = '';\n action: GestureActionName | (string & {}) = '';\n value: number | undefined = undefined;\n pointer: GesturePointerType | undefined = undefined;\n region: GestureRegion | undefined = undefined;\n disabled = false;\n\n readonly #player = new PlayerController(this, playerContext);\n readonly #container = new ContextConsumer(this, {\n context: containerContext,\n callback: () => this.requestUpdate(),\n subscribe: true,\n });\n #cleanup: (() => void) | null = null;\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.style.display = 'none';\n this.#register();\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#unregister();\n }\n\n protected override update(changed: PropertyValues): void {\n super.update(changed);\n\n // Re-register when attributes change.\n if (this.isConnected) {\n this.#unregister();\n this.#register();\n }\n }\n\n #register(): void {\n const store = this.#player.value;\n const container = this.#container.value?.container;\n if (!this.type || !this.action || !store || !container) return;\n\n const resolver = resolveGestureAction(this.action);\n if (!resolver) return;\n\n const { value } = this;\n\n const onActivate = (event: PointerEvent) => {\n resolver({ store, value, event });\n };\n\n const options = {\n pointer: this.pointer,\n region: this.region,\n disabled: this.disabled,\n action: this.action,\n };\n\n if (this.type === 'doubletap') {\n this.#cleanup = createDoubleTapGesture(container, onActivate, options);\n } else {\n this.#cleanup = createTapGesture(container, onActivate, options);\n }\n }\n\n #unregister(): void {\n this.#cleanup?.();\n this.#cleanup = null;\n }\n}\n"],"mappings":";;;;;;AAeA,IAAa,iBAAb,cAAoC,aAAa;;;cAYH;gBACA;eAChB,KAAA;iBACc,KAAA;gBACN,KAAA;kBACzB;;;
|
|
1
|
+
{"version":3,"file":"gesture-element.js","names":["#player","#container","#register","#unregister","#cleanup"],"sources":["../../../../src/ui/gesture/gesture-element.ts"],"sourcesContent":["import {\n createDoubleTapGesture,\n createTapGesture,\n type GestureActionName,\n type GesturePointerType,\n type GestureRegion,\n resolveGestureAction,\n} from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { containerContext, playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaElement } from '../media-element';\n\nexport class GestureElement extends MediaElement {\n static readonly tagName = 'media-gesture';\n\n static override properties: PropertyDeclarationMap = {\n type: { type: String },\n action: { type: String },\n value: { type: Number },\n pointer: { type: String },\n region: { type: String },\n disabled: { type: Boolean },\n };\n\n type: 'tap' | 'doubletap' | (string & {}) = '';\n action: GestureActionName | (string & {}) = '';\n value: number | undefined = undefined;\n pointer: GesturePointerType | undefined = undefined;\n region: GestureRegion | undefined = undefined;\n disabled = false;\n\n readonly #player = new PlayerController(this, playerContext);\n readonly #container = new ContextConsumer(this, {\n context: containerContext,\n callback: () => this.requestUpdate(),\n subscribe: true,\n });\n #cleanup: (() => void) | null = null;\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.style.display = 'none';\n this.#register();\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#unregister();\n }\n\n protected override update(changed: PropertyValues): void {\n super.update(changed);\n\n // Re-register when attributes change.\n if (this.isConnected) {\n this.#unregister();\n this.#register();\n }\n }\n\n #register(): void {\n const store = this.#player.value;\n const container = this.#container.value?.container;\n if (!this.type || !this.action || !store || !container) return;\n\n const resolver = resolveGestureAction(this.action);\n if (!resolver) return;\n\n const { value } = this;\n\n const onActivate = (event: PointerEvent) => {\n resolver({ store, value, event });\n };\n\n const options = {\n pointer: this.pointer,\n region: this.region,\n disabled: this.disabled,\n action: this.action,\n };\n\n if (this.type === 'doubletap') {\n this.#cleanup = createDoubleTapGesture(container, onActivate, options);\n } else {\n this.#cleanup = createTapGesture(container, onActivate, options);\n }\n }\n\n #unregister(): void {\n this.#cleanup?.();\n this.#cleanup = null;\n }\n}\n"],"mappings":";;;;;;AAeA,IAAa,iBAAb,cAAoC,aAAa;;;cAYH;gBACA;eAChB,KAAA;iBACc,KAAA;gBACN,KAAA;kBACzB;iBAEQ,IAAI,iBAAiB,MAAM,cAAc;oBACtC,IAAI,gBAAgB,MAAM;GAC9C,SAAS;GACT,gBAAgB,KAAK,eAAe;GACpC,WAAW;GACZ,CAAC;kBAC8B;;;iBAxBN;;;oBAE2B;GACnD,MAAM,EAAE,MAAM,QAAQ;GACtB,QAAQ,EAAE,MAAM,QAAQ;GACxB,OAAO,EAAE,MAAM,QAAQ;GACvB,SAAS,EAAE,MAAM,QAAQ;GACzB,QAAQ,EAAE,MAAM,QAAQ;GACxB,UAAU,EAAE,MAAM,SAAS;GAC5B;;CASD;CACA;CAKA;CAEA,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,OAAK,MAAM,UAAU;AACrB,QAAA,UAAgB;;CAGlB,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,YAAkB;;CAGpB,OAA0B,SAA+B;AACvD,QAAM,OAAO,QAAQ;AAGrB,MAAI,KAAK,aAAa;AACpB,SAAA,YAAkB;AAClB,SAAA,UAAgB;;;CAIpB,YAAkB;EAChB,MAAM,QAAQ,MAAA,OAAa;EAC3B,MAAM,YAAY,MAAA,UAAgB,OAAO;AACzC,MAAI,CAAC,KAAK,QAAQ,CAAC,KAAK,UAAU,CAAC,SAAS,CAAC,UAAW;EAExD,MAAM,WAAW,qBAAqB,KAAK,OAAO;AAClD,MAAI,CAAC,SAAU;EAEf,MAAM,EAAE,UAAU;EAElB,MAAM,cAAc,UAAwB;AAC1C,YAAS;IAAE;IAAO;IAAO;IAAO,CAAC;;EAGnC,MAAM,UAAU;GACd,SAAS,KAAK;GACd,QAAQ,KAAK;GACb,UAAU,KAAK;GACf,QAAQ,KAAK;GACd;AAED,MAAI,KAAK,SAAS,YAChB,OAAA,UAAgB,uBAAuB,WAAW,YAAY,QAAQ;MAEtE,OAAA,UAAgB,iBAAiB,WAAW,YAAY,QAAQ;;CAIpE,cAAoB;AAClB,QAAA,WAAiB;AACjB,QAAA,UAAgB"}
|
|
@@ -12,6 +12,13 @@ var HotkeyElement = class extends MediaElement {
|
|
|
12
12
|
this.value = void 0;
|
|
13
13
|
this.disabled = false;
|
|
14
14
|
this.target = "player";
|
|
15
|
+
this.#player = new PlayerController(this, playerContext);
|
|
16
|
+
this.#container = new ContextConsumer(this, {
|
|
17
|
+
context: containerContext,
|
|
18
|
+
callback: () => this.requestUpdate(),
|
|
19
|
+
subscribe: true
|
|
20
|
+
});
|
|
21
|
+
this.#cleanup = null;
|
|
15
22
|
}
|
|
16
23
|
static {
|
|
17
24
|
this.tagName = "media-hotkey";
|
|
@@ -25,13 +32,9 @@ var HotkeyElement = class extends MediaElement {
|
|
|
25
32
|
target: { type: String }
|
|
26
33
|
};
|
|
27
34
|
}
|
|
28
|
-
#player
|
|
29
|
-
#container
|
|
30
|
-
|
|
31
|
-
callback: () => this.requestUpdate(),
|
|
32
|
-
subscribe: true
|
|
33
|
-
});
|
|
34
|
-
#cleanup = null;
|
|
35
|
+
#player;
|
|
36
|
+
#container;
|
|
37
|
+
#cleanup;
|
|
35
38
|
connectedCallback() {
|
|
36
39
|
super.connectedCallback();
|
|
37
40
|
this.style.display = "none";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hotkey-element.js","names":["#player","#container","#register","#unregister","#cleanup"],"sources":["../../../../src/ui/hotkey/hotkey-element.ts"],"sourcesContent":["import { createHotkey, type HotkeyActionName, isHotkeyToggleAction, resolveHotkeyAction } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { containerContext, playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaElement } from '../media-element';\n\nexport class HotkeyElement extends MediaElement {\n static readonly tagName = 'media-hotkey';\n\n static override properties: PropertyDeclarationMap = {\n keys: { type: String },\n action: { type: String },\n value: { type: Number },\n disabled: { type: Boolean },\n target: { type: String },\n };\n\n keys = '';\n action: HotkeyActionName | (string & {}) = '';\n value: number | undefined = undefined;\n disabled = false;\n target: 'player' | 'document' = 'player';\n\n readonly #player = new PlayerController(this, playerContext);\n readonly #container = new ContextConsumer(this, {\n context: containerContext,\n callback: () => this.requestUpdate(),\n subscribe: true,\n });\n #cleanup: (() => void) | null = null;\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.style.display = 'none';\n this.#register();\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#unregister();\n }\n\n protected override update(changed: PropertyValues): void {\n super.update(changed);\n\n // Re-register when attributes change.\n if (this.isConnected) {\n this.#unregister();\n this.#register();\n }\n }\n\n #register(): void {\n const store = this.#player.value;\n const container = this.#container.value?.container;\n if (!this.keys || !this.action || !store || !container) return;\n\n const resolver = resolveHotkeyAction(this.action);\n if (!resolver) return;\n\n const { value, action } = this;\n\n this.#cleanup = createHotkey(container, {\n keys: this.keys,\n action,\n target: this.target,\n disabled: this.disabled,\n repeatable: !isHotkeyToggleAction(action),\n onActivate: (_event, key) => {\n resolver({ store, key, value });\n },\n });\n }\n\n #unregister(): void {\n this.#cleanup?.();\n this.#cleanup = null;\n }\n}\n"],"mappings":";;;;;;AAQA,IAAa,gBAAb,cAAmC,aAAa;;;cAWvC;gBACoC;eACf,KAAA;kBACjB;gBACqB;;;
|
|
1
|
+
{"version":3,"file":"hotkey-element.js","names":["#player","#container","#register","#unregister","#cleanup"],"sources":["../../../../src/ui/hotkey/hotkey-element.ts"],"sourcesContent":["import { createHotkey, type HotkeyActionName, isHotkeyToggleAction, resolveHotkeyAction } from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\n\nimport { containerContext, playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MediaElement } from '../media-element';\n\nexport class HotkeyElement extends MediaElement {\n static readonly tagName = 'media-hotkey';\n\n static override properties: PropertyDeclarationMap = {\n keys: { type: String },\n action: { type: String },\n value: { type: Number },\n disabled: { type: Boolean },\n target: { type: String },\n };\n\n keys = '';\n action: HotkeyActionName | (string & {}) = '';\n value: number | undefined = undefined;\n disabled = false;\n target: 'player' | 'document' = 'player';\n\n readonly #player = new PlayerController(this, playerContext);\n readonly #container = new ContextConsumer(this, {\n context: containerContext,\n callback: () => this.requestUpdate(),\n subscribe: true,\n });\n #cleanup: (() => void) | null = null;\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.style.display = 'none';\n this.#register();\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#unregister();\n }\n\n protected override update(changed: PropertyValues): void {\n super.update(changed);\n\n // Re-register when attributes change.\n if (this.isConnected) {\n this.#unregister();\n this.#register();\n }\n }\n\n #register(): void {\n const store = this.#player.value;\n const container = this.#container.value?.container;\n if (!this.keys || !this.action || !store || !container) return;\n\n const resolver = resolveHotkeyAction(this.action);\n if (!resolver) return;\n\n const { value, action } = this;\n\n this.#cleanup = createHotkey(container, {\n keys: this.keys,\n action,\n target: this.target,\n disabled: this.disabled,\n repeatable: !isHotkeyToggleAction(action),\n onActivate: (_event, key) => {\n resolver({ store, key, value });\n },\n });\n }\n\n #unregister(): void {\n this.#cleanup?.();\n this.#cleanup = null;\n }\n}\n"],"mappings":";;;;;;AAQA,IAAa,gBAAb,cAAmC,aAAa;;;cAWvC;gBACoC;eACf,KAAA;kBACjB;gBACqB;iBAEb,IAAI,iBAAiB,MAAM,cAAc;oBACtC,IAAI,gBAAgB,MAAM;GAC9C,SAAS;GACT,gBAAgB,KAAK,eAAe;GACpC,WAAW;GACZ,CAAC;kBAC8B;;;iBAtBN;;;oBAE2B;GACnD,MAAM,EAAE,MAAM,QAAQ;GACtB,QAAQ,EAAE,MAAM,QAAQ;GACxB,OAAO,EAAE,MAAM,QAAQ;GACvB,UAAU,EAAE,MAAM,SAAS;GAC3B,QAAQ,EAAE,MAAM,QAAQ;GACzB;;CAQD;CACA;CAKA;CAEA,oBAAmC;AACjC,QAAM,mBAAmB;AACzB,OAAK,MAAM,UAAU;AACrB,QAAA,UAAgB;;CAGlB,uBAAsC;AACpC,QAAM,sBAAsB;AAC5B,QAAA,YAAkB;;CAGpB,OAA0B,SAA+B;AACvD,QAAM,OAAO,QAAQ;AAGrB,MAAI,KAAK,aAAa;AACpB,SAAA,YAAkB;AAClB,SAAA,UAAgB;;;CAIpB,YAAkB;EAChB,MAAM,QAAQ,MAAA,OAAa;EAC3B,MAAM,YAAY,MAAA,UAAgB,OAAO;AACzC,MAAI,CAAC,KAAK,QAAQ,CAAC,KAAK,UAAU,CAAC,SAAS,CAAC,UAAW;EAExD,MAAM,WAAW,oBAAoB,KAAK,OAAO;AACjD,MAAI,CAAC,SAAU;EAEf,MAAM,EAAE,OAAO,WAAW;AAE1B,QAAA,UAAgB,aAAa,WAAW;GACtC,MAAM,KAAK;GACX;GACA,QAAQ,KAAK;GACb,UAAU,KAAK;GACf,YAAY,CAAC,qBAAqB,OAAO;GACzC,aAAa,QAAQ,QAAQ;AAC3B,aAAS;KAAE;KAAO;KAAK;KAAO,CAAC;;GAElC,CAAC;;CAGJ,cAAoB;AAClB,QAAA,WAAiB;AACjB,QAAA,UAAgB"}
|