npm - @videojs/html - Versions diffs - 10.0.0-beta.11 → 10.0.0-beta.13 - Mend

@videojs/html 10.0.0-beta.11 → 10.0.0-beta.13

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.

Files changed (788) hide show

package/dist/default/define/video/skin.tailwind.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"skin.tailwind.js","names":[],"sources":["../../../../src/define/video/skin.tailwind.ts"],"sourcesContent":["import { ReactiveElement } from '@videojs/element';\nimport { renderIcon } from '@videojs/icons/render';\nimport {\n bufferingIndicator,\n button,\n controls,\n icon,\n iconContainer,\n iconFlipped,\n iconState,\n overlay,\n playbackRate,\n popup,\n poster,\n preview,\n root,\n seek,\n slider,\n time,\n tooltipState,\n} from '@videojs/skins/default/tailwind/video.tailwind';\nimport { cn } from '@videojs/utils/style';\nimport { SkinMixin } from '../skin-mixin';\n\n// Side-effect imports: register all custom elements used in the template.\nimport '../media/container';\nimport '../ui/buffering-indicator';\nimport '../ui/captions-button';\nimport '../ui/controls';\nimport '../ui/fullscreen-button';\nimport '../ui/mute-button';\nimport '../ui/pip-button';\nimport '../ui/play-button';\nimport '../ui/playback-rate-button';\nimport '../ui/popover';\nimport '../ui/poster';\nimport '../ui/seek-button';\nimport '../ui/time';\nimport '../ui/time-slider';\nimport '../ui/tooltip';\nimport '../ui/tooltip-group';\nimport '../ui/volume-slider';\n\nconst SEEK_TIME = 10;\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-controls data-controls=\"\" class=\"${controls}\">\n <media-tooltip-group>\n <span class=\"${tooltipState.play.wrapper}\">\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)}\">\n <span class=\"${tooltipState.play.replay}\">Replay</span>\n <span class=\"${tooltipState.play.play}\">Play</span>\n <span class=\"${tooltipState.play.pause}\">Pause</span>\n </media-tooltip>\n </span>\n\n <media-seek-button commandfor=\"seek-backward-tooltip\" seconds=\"${-SEEK_TIME}\" class=\"${cn(button.base, button.subtle, button.icon, seek.button)}\">\n <span class=\"${iconContainer}\">\n ${renderIcon('seek', { class: cn(icon, iconFlipped) })}\n <span class=\"${cn(seek.label, seek.labelBackward)}\">${SEEK_TIME}</span>\n </span>\n </media-seek-button>\n <media-tooltip id=\"seek-backward-tooltip\" side=\"top\" class=\"${cn(popup.tooltip)}\">\n Seek backward ${SEEK_TIME} seconds\n </media-tooltip>\n\n <media-seek-button commandfor=\"seek-forward-tooltip\" seconds=\"${SEEK_TIME}\" class=\"${cn(button.base, button.subtle, button.icon, seek.button)}\">\n <span class=\"${iconContainer}\">\n ${renderIcon('seek', { class: icon })}\n <span class=\"${cn(seek.label, seek.labelForward)}\">${SEEK_TIME}</span>\n </span>\n </media-seek-button>\n <media-tooltip id=\"seek-forward-tooltip\" side=\"top\" class=\"${cn(popup.tooltip)}\">\n Seek forward ${SEEK_TIME} seconds\n </media-tooltip>\n\n <media-time-group class=\"${time.group}\">\n <media-time type=\"current\" class=\"${time.current}\"></media-time>\n <media-time-slider class=\"${slider.root}\">\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-buffer class=\"${cn(slider.fill.base, slider.fill.buffer)}\"></media-slider-buffer>\n </media-slider-track>\n <media-slider-thumb class=\"${cn(slider.thumb.base, slider.thumb.interactive)}\"></media-slider-thumb>\n\n <div class=\"${preview.root}\">\n <media-slider-thumbnail class=\"${preview.thumbnail}\"></media-slider-thumbnail>\n <media-slider-value type=\"pointer\" class=\"${preview.timestamp}\"></media-slider-value>\n ${renderIcon('spinner', { class: cn(icon, preview.spinner) })}\n </div>\n </media-time-slider>\n <media-time type=\"duration\" class=\"${time.duration}\"></media-time>\n </media-time-group>\n\n <media-playback-rate-button commandfor=\"playback-rate-tooltip\" class=\"${cn(button.base, button.subtle, button.icon, playbackRate.button)}\"></media-playback-rate-button>\n <media-tooltip id=\"playback-rate-tooltip\" side=\"top\" class=\"${cn(popup.tooltip)}\">\n Toggle playback rate\n </media-tooltip>\n\n <media-mute-button commandfor=\"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=\"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\n <span class=\"${tooltipState.captions.wrapper}\">\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)}\">\n <span class=\"${tooltipState.captions.enable}\">Enable captions</span>\n <span class=\"${tooltipState.captions.disable}\">Disable captions</span>\n </media-tooltip>\n </span>\n\n <span class=\"${tooltipState.pip.wrapper}\">\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)}\">\n <span class=\"${tooltipState.pip.enter}\">Enter picture-in-picture</span>\n <span class=\"${tooltipState.pip.exit}\">Exit picture-in-picture</span>\n </media-tooltip>\n </span>\n\n <span class=\"${tooltipState.fullscreen.wrapper}\">\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)}\">\n <span class=\"${tooltipState.fullscreen.enter}\">Enter fullscreen</span>\n <span class=\"${tooltipState.fullscreen.exit}\">Exit fullscreen</span>\n </media-tooltip>\n </span>\n </media-tooltip-group>\n </media-controls>\n\n <div class=\"${overlay}\"></div>\n </media-container>\n `;\n}\n\nexport class VideoSkinTailwindElement extends SkinMixin(ReactiveElement) {\n static readonly tagName = 'video-skin-tailwind';\n static getTemplateHTML = getTemplateHTML;\n}\n\ncustomElements.define(VideoSkinTailwindElement.tagName, VideoSkinTailwindElement);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [VideoSkinTailwindElement.tagName]: VideoSkinTailwindElement;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,MAAM,YAAY;AAElB,SAAS,kBAAkB;AACzB,QAAgB,2BAAA,KAAA,KAAA,CAAA,iEAAA,OAAA,KAAA,CAAA,iFAAA,mBAAA,KAAA,iBAAA,mBAAA,UAAA,KAAA,WAAA,UAAA,CAAA,6EAAA,SAAA,uCAAA,aAAA,KAAA,QAAA,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,kBAAA,aAAA,KAAA,OAAA,8BAAA,aAAA,KAAA,KAAA,4BAAA,aAAA,KAAA,MAAA,sGAAA,CAAA,UAAA,WAAA,GAAA,OAAA,MAAA,OAAA,QAAA,OAAA,MAAA,KAAA,OAAA,CAAA,kBAAA,cAAA,KAAA,WAAA,QAAA,EAAA,OAAA,GAAA,MAAA,YAAA,EAAA,CAAA,CAAA,gBAAA,GAAA,KAAA,OAAA,KAAA,cAAA,CAAA,IAAA,UAAA,gGAAA,GAAA,MAAA,QAAA,CAAA,mBAAA,UAAA,yFAAA,UAAA,WAAA,GAAA,OAAA,MAAA,OAAA,QAAA,OAAA,MAAA,KAAA,OAAA,CAAA,kBAAA,cAAA,KAAA,WAAA,QAAA,EAAA,OAAA,MAAA,CAAA,CAAA,gBAAA,GAAA,KAAA,OAAA,KAAA,aAAA,CAAA,IAAA,UAAA,+FAAA,GAAA,MAAA,QAAA,CAAA,kBAAA,UAAA,oDAAA,KAAA,MAAA,uCAAA,KAAA,QAAA,2CAAA,OAAA,KAAA,gCAAA,OAAA,MAAA,+BAAA,GAAA,OAAA,KAAA,MAAA,OAAA,KAAA,KAAA,CAAA,oDAAA,GAAA,OAAA,KAAA,MAAA,OAAA,KAAA,OAAA,CAAA,0EAAA,GAAA,OAAA,MAAA,MAAA,OAAA,MAAA,YAAA,CAAA,qCAAA,QAAA,KAAA,oCAAA,QAAA,UAAA,uEAAA,QAAA,UAAA,0BAAA,WAAA,WAAA,EAAA,OAAA,GAAA,MAAA,QAAA,QAAA,EAAA,CAAA,CAAA,gEAAA,KAAA,SAAA,0GAAA,GAAA,OAAA,MAAA,OAAA,QAAA,OAAA,MAAA,aAAA,OAAA,CAAA,6FAAA,GAAA,MAAA,QAAA,CAAA,sGAAA,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,8HAAA,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,4EAAA,aAAA,SAAA,QAAA,iEAAA,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,kBAAA,aAAA,SAAA,OAAA,uCAAA,aAAA,SAAA,QAAA,+DAAA,aAAA,IAAA,QAAA,uDAAA,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,kBAAA,aAAA,IAAA,MAAA,gDAAA,aAAA,IAAA,KAAA,sEAAA,aAAA,WAAA,QAAA,qEAAA,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,kBAAA,aAAA,WAAA,MAAA,wCAAA,aAAA,WAAA,KAAA,oGAAA,QAAA;;AAGlB,IAAY,2BAAZ,cAA+B,UAAA,gBAAA,CAAA;;iBACb;;;;;;AAIlB,eAAc,OAAM,yBAAA,SAAA,yBAAA"}
1	+ {"version":3,"file":"skin.tailwind.js","names":[],"sources":["../../../../src/define/video/skin.tailwind.ts"],"sourcesContent":["import { ReactiveElement } from '@videojs/element';\nimport { renderIcon } from '@videojs/icons/render';\nimport {\n bufferingIndicator,\n button,\n buttonGroupEnd,\n buttonGroupStart,\n controls,\n error,\n icon,\n iconContainer,\n iconFlipped,\n iconState,\n overlay,\n playbackRate,\n popup,\n poster,\n preview,\n root,\n seek,\n slider,\n time,\n tooltipState,\n} from '@videojs/skins/default/tailwind/video.tailwind';\nimport { cn } from '@videojs/utils/style';\nimport { safeDefine } from '../safe-define';\nimport { SkinMixin } from '../skin-mixin';\n\n// Side-effect imports: register all custom elements used in the template.\nimport '../media/container';\nimport '../ui/buffering-indicator';\nimport '../ui/captions-button';\nimport '../ui/error-dialog';\nimport '../ui/controls';\nimport '../ui/fullscreen-button';\nimport '../ui/mute-button';\nimport '../ui/pip-button';\nimport '../ui/play-button';\nimport '../ui/playback-rate-button';\nimport '../ui/popover';\nimport '../ui/poster';\nimport '../ui/seek-button';\nimport '../ui/time';\nimport '../ui/time-slider';\nimport '../ui/tooltip';\nimport '../ui/tooltip-group';\nimport '../ui/volume-slider';\n\nconst SEEK_TIME = 10;\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 <span class=\"${tooltipState.play.wrapper}\">\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)}\">\n <span class=\"${tooltipState.play.replay}\">Replay</span>\n <span class=\"${tooltipState.play.play}\">Play</span>\n <span class=\"${tooltipState.play.pause}\">Pause</span>\n </media-tooltip>\n </span>\n\n <media-seek-button commandfor=\"seek-backward-tooltip\" seconds=\"${-SEEK_TIME}\" class=\"${cn(button.base, button.subtle, button.icon)}\">\n <span class=\"${iconContainer}\">\n ${renderIcon('seek', { class: cn(icon, iconFlipped) })}\n <span class=\"${cn(seek.label, seek.labelBackward)}\">${SEEK_TIME}</span>\n </span>\n </media-seek-button>\n <media-tooltip id=\"seek-backward-tooltip\" side=\"top\" class=\"${cn(popup.tooltip)}\">\n Seek backward ${SEEK_TIME} seconds\n </media-tooltip>\n\n <media-seek-button commandfor=\"seek-forward-tooltip\" seconds=\"${SEEK_TIME}\" class=\"${cn(button.base, button.subtle, button.icon)}\">\n <span class=\"${iconContainer}\">\n ${renderIcon('seek', { class: icon })}\n <span class=\"${cn(seek.label, seek.labelForward)}\">${SEEK_TIME}</span>\n </span>\n </media-seek-button>\n <media-tooltip id=\"seek-forward-tooltip\" side=\"top\" class=\"${cn(popup.tooltip)}\">\n Seek forward ${SEEK_TIME} seconds\n </media-tooltip>\n </div>\n\n <div class=\"${time.group}\">\n <media-time type=\"current\" class=\"${time.current}\"></media-time>\n <media-time-slider class=\"${slider.root}\">\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-buffer class=\"${cn(slider.fill.base, slider.fill.buffer)}\"></media-slider-buffer>\n </media-slider-track>\n <media-slider-thumb class=\"${cn(slider.thumb.base, slider.thumb.interactive)}\"></media-slider-thumb>\n\n <div class=\"${preview.root}\">\n <media-slider-thumbnail class=\"${preview.thumbnail}\"></media-slider-thumbnail>\n <media-slider-value type=\"pointer\" class=\"${preview.time}\"></media-slider-value>\n ${renderIcon('spinner', { class: cn(icon, preview.spinner) })}\n </div>\n </media-time-slider>\n <media-time type=\"duration\" class=\"${time.duration}\"></media-time>\n </div>\n\n <div class=\"${buttonGroupEnd}\">\n <media-playback-rate-button commandfor=\"playback-rate-tooltip\" class=\"${cn(button.base, button.subtle, button.icon, playbackRate.button)}\"></media-playback-rate-button>\n <media-tooltip id=\"playback-rate-tooltip\" side=\"top\" class=\"${cn(popup.tooltip)}\">\n Toggle playback rate\n </media-tooltip>\n\n <media-mute-button commandfor=\"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=\"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\n <span class=\"${tooltipState.captions.wrapper}\">\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)}\">\n <span class=\"${tooltipState.captions.enable}\">Enable captions</span>\n <span class=\"${tooltipState.captions.disable}\">Disable captions</span>\n </media-tooltip>\n </span>\n\n <span class=\"${tooltipState.pip.wrapper}\">\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)}\">\n <span class=\"${tooltipState.pip.enter}\">Enter picture-in-picture</span>\n <span class=\"${tooltipState.pip.exit}\">Exit picture-in-picture</span>\n </media-tooltip>\n </span>\n\n <span class=\"${tooltipState.fullscreen.wrapper}\">\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)}\">\n <span class=\"${tooltipState.fullscreen.enter}\">Enter fullscreen</span>\n <span class=\"${tooltipState.fullscreen.exit}\">Exit fullscreen</span>\n </media-tooltip>\n </span>\n </div>\n </media-tooltip-group>\n </media-controls>\n\n <div class=\"${overlay}\"></div>\n </media-container>\n `;\n}\n\nexport class VideoSkinTailwindElement extends SkinMixin(ReactiveElement) {\n static readonly tagName = 'video-skin-tailwind';\n static getTemplateHTML = getTemplateHTML;\n}\n\nsafeDefine(VideoSkinTailwindElement);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [VideoSkinTailwindElement.tagName]: VideoSkinTailwindElement;\n }\n}\n"],"mappings":"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"}

package/dist/default/icons/dist/render/default/index.js CHANGED Viewed

@@ -22,7 +22,7 @@ function renderIcon(name, attrs) {
 	const attrStr = Object.entries(attrs).map(([k, v]) => ` ${k}="${v}"`).join("");
 	return svg.replace("<svg", `<svg${attrStr}`);
 }
 //#endregion
 export { renderIcon };
 //# sourceMappingURL=index.js.map

package/dist/default/icons/dist/render/minimal/index.js CHANGED Viewed

@@ -22,7 +22,7 @@ function renderIcon(name, attrs) {
 	const attrStr = Object.entries(attrs).map(([k, v]) => ` ${k}="${v}"`).join("");
 	return svg.replace("<svg", `<svg${attrStr}`);
 }
 //#endregion
 export { renderIcon };
 //# sourceMappingURL=index.js.map

package/dist/default/index.js CHANGED Viewed

@@ -16,6 +16,7 @@ import { MediaButtonElement } from "./ui/media-button-element.js";
 import { CaptionsButtonElement } from "./ui/captions-button/captions-button-element.js";
 import { ControlsElement } from "./ui/controls/controls-element.js";
 import { ControlsGroupElement } from "./ui/controls/controls-group-element.js";
+import { ErrorDialogElement } from "./ui/error-dialog/error-dialog-element.js";
 import { FullscreenButtonElement } from "./ui/fullscreen-button/fullscreen-button-element.js";
 import { MediaUIElement } from "./ui/media-ui-element.js";
 import { MuteButtonElement } from "./ui/mute-button/mute-button-element.js";
@@ -44,7 +45,5 @@ import { TooltipGroupElement } from "./ui/tooltip/tooltip-group-element.js";
 import { VolumeSliderElement } from "./ui/volume-slider/volume-slider-element.js";
 import { DelegateMixin } from "@videojs/core";
 import { createSelector, shallowEqual } from "@videojs/store";
-export * from "@videojs/core/dom"
-export { AlertDialogCloseElement, AlertDialogDescriptionElement, AlertDialogElement, AlertDialogTitleElement, BufferingIndicatorElement, CONTAINER_CONTEXT_KEY, CaptionsButtonElement, ControlsElement, ControlsGroupElement, DelegateMixin, FullscreenButtonElement, MEDIA_CONTEXT_KEY, MediaAttachMixin, MediaButtonElement, MediaContainerElement, MediaElement, MediaUIElement, MuteButtonElement, PLAYER_CONTEXT_KEY, PiPButtonElement, PlayButtonElement, PlaybackRateButtonElement, PlayerController, PopoverElement, PosterElement, SeekButtonElement, SliderBufferElement, SliderElement, SliderFillElement, SliderThumbElement, SliderThumbnailElement, SliderTrackElement, SliderValueElement, ThumbnailElement, TimeElement, TimeGroupElement, TimeSeparatorElement, TimeSliderElement, TooltipElement, TooltipGroupElement, VolumeSliderElement, alertDialogContext, containerContext, createContainerMixin, createMediaAttachMixin, createPlayer, createProviderMixin, createSelector, mediaContext, playerContext, shallowEqual, sliderContext, tooltipGroupContext };
+export * from "@videojs/core/dom";
+export { AlertDialogCloseElement, AlertDialogDescriptionElement, AlertDialogElement, AlertDialogTitleElement, BufferingIndicatorElement, CONTAINER_CONTEXT_KEY, CaptionsButtonElement, ControlsElement, ControlsGroupElement, DelegateMixin, ErrorDialogElement, FullscreenButtonElement, MEDIA_CONTEXT_KEY, MediaAttachMixin, MediaButtonElement, MediaContainerElement, MediaElement, MediaUIElement, MuteButtonElement, PLAYER_CONTEXT_KEY, PiPButtonElement, PlayButtonElement, PlaybackRateButtonElement, PlayerController, PopoverElement, PosterElement, SeekButtonElement, SliderBufferElement, SliderElement, SliderFillElement, SliderThumbElement, SliderThumbnailElement, SliderTrackElement, SliderValueElement, ThumbnailElement, TimeElement, TimeGroupElement, TimeSeparatorElement, TimeSliderElement, TooltipElement, TooltipGroupElement, VolumeSliderElement, alertDialogContext, containerContext, createContainerMixin, createMediaAttachMixin, createPlayer, createProviderMixin, createSelector, mediaContext, playerContext, shallowEqual, sliderContext, tooltipGroupContext };

package/dist/default/media/background-video/index.js CHANGED Viewed

@@ -1,6 +1,5 @@
 import { MediaAttachMixin } from "../../store/media-attach-mixin.js";
 import { namedNodeMapToObject } from "@videojs/utils/dom";
 //#region src/media/background-video/index.ts
 function getTemplateHTML(attrs) {
 	return `<style> :host { position: relative; } video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: var(--media-object-fit, inherit); object-position: var(--media-object-position, 50% 50%); } </style><slot></slot><video ${serializeAttributes(attrs)}></video>`;
@@ -64,7 +63,7 @@ function serializeAttributes(attrs) {
 	}
 	return html;
 }
 //#endregion
 export { BackgroundVideo };
 //# sourceMappingURL=index.js.map

package/dist/default/media/background-video/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/background-video/index.ts"],"sourcesContent":["import type { Media } from '@videojs/core/dom';\nimport { namedNodeMapToObject } from '@videojs/utils/dom';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\n\nfunction getTemplateHTML(attrs: Record<string, string>) {\n return /html/ `\n <style>\n :host {\n position: relative;\n }\n\n video {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n object-fit: var(--media-object-fit, inherit);\n object-position: var(--media-object-position, 50% 50%);\n }\n </style>\n <slot></slot>\n <video ${serializeAttributes(attrs)}></video>\n `;\n}\n\n// Don't extend CustomMediaMixin to save some bytes, background videos don't need the full Media API.\nexport class BackgroundVideo extends MediaAttachMixin(HTMLElement) {\n static shadowRootOptions = { mode: 'open' as ShadowRootMode };\n static getTemplateHTML = getTemplateHTML;\n static get observedAttributes() {\n return ['src'];\n }\n\n constructor() {\n super();\n\n if (!this.shadowRoot) {\n this.attachShadow((this.constructor as typeof BackgroundVideo).shadowRootOptions);\n\n const attrs = {\n ...namedNodeMapToObject(this.attributes),\n ...(!this.hasAttribute('nomuted') && { muted: '' }),\n ...(!this.hasAttribute('noloop') && { loop: '' }),\n ...(!this.hasAttribute('noautoplay') && { autoplay: '' }),\n playsinline: '',\n disableremoteplayback: '',\n disablepictureinpicture: '',\n };\n\n this.shadowRoot!.innerHTML = getTemplateHTML(attrs);\n }\n\n // Neither Chrome or Firefox support setting the muted attribute\n // after using document.createElement.\n // Get around this by setting the muted property manually.\n this.target!.muted = !this.hasAttribute('nomuted');\n }\n\n // Register the inner <video> (not `this`) with the provider.\n getMediaTarget(): Media \| null {\n return this.target;\n }\n\n attributeChangedCallback(attrName: string, oldValue: string \| null, newValue: string \| null): void {\n if (attrName === 'src' && oldValue !== newValue) {\n this.target!.src = newValue ?? '';\n }\n }\n\n get target(): HTMLVideoElement \| null {\n return (\n this.querySelector(':scope > [slot=media]') ??\n this.querySelector('video') ??\n this.shadowRoot?.querySelector('video') ??\n null\n );\n }\n}\n\nconst VideoAttributes = [\n 'autoplay',\n 'controls',\n 'controlslist',\n 'crossorigin',\n 'disablepictureinpicture',\n 'disableremoteplayback',\n 'loop',\n 'muted',\n 'playsinline',\n 'preload',\n] as const;\n\nfunction serializeAttributes(attrs: Record<string, string>): string {\n let html = '';\n for (const key in attrs) {\n // Skip forwarding non native video attributes.\n if (!VideoAttributes.includes(key as any)) continue;\n\n const value = attrs[key];\n if (value === '') html += ` ${key}`;\n else html += ` ${key}=\"${value}\"`;\n }\n return html;\n}\n"],"mappings":"~~;;;;~~AAIA,SAAS,gBAAgB,OAA+B;AACtD,QAAgB,8OAAA,oBAAA,MAAA,CAAA;;AAIlB,IAAM,kBAAN,cAAM,iBAAA,YAAA,CAAA;;;;;yBAEM;;CACV,WAAM,qBAAkB;AACtB,SAAI,CAAA,MAAQ;;CAGd,cAAa;AACX,SAAI;AAEJ,MAAE,CAAA,KAAK,YAAA;AACN,QAAM,aAAK,KAAA,YAAA,kBAAA;GAEb,MAAA,QAAA;IACH,GAAA,qBAAA,KAAA,WAAA;;IAEQ,GAAC,CAAA,KAAO,aAAA,SAAwB,IAAC,EAAK,MAAM,IAAC;IAC9C,GAAK,CAAC,KAAA,aAAgB,aAAQ,IAAA,EAAA,UAAiB,IAAA;IAC9C,aAAC;IACD,uBAAmB;IACnB,yBAAyB;IAC7B;;;;;CAYF,iBAA8B;AAC5B,SAAO,KAAE;;CAGX,yBAAM,UAA2B,UAAA,UAAA;AAC/B,MAAG,aAAA,SAAA,aAAA;;CAKL,IAAI,SAAkC;AACpC,SACE,KAAK,cAAc,wBAAmB,IACxC,KAAK,cAAgB,QAAM,IAC7B,KAAA,YAAA,cAAA,QAAA;;;;CAOA;CACA;CACA;CACA;CACA;;CAEA;CACA;CACA;CACA;CACD;AAED,SAAK,oBAAA,OAAA;CACH,IAAA,OAAA;AACF,MAAA,MAAA,OAAA,OAAA;AAEA,MAAM,CAAA,gBAAkB,SAAA,IAAA,CAAA;EAErB,MAAA,QAAS,MAAA;AACT,MAAA,UAAa,GAAA,SAAA,IAAA;MACb,SAAY,IAAA,IAAA,IAAA,MAAA;;AAEb,QAAC"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/background-video/index.ts"],"sourcesContent":["import type { Media } from '@videojs/core/dom';\nimport { namedNodeMapToObject } from '@videojs/utils/dom';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\n\nfunction getTemplateHTML(attrs: Record<string, string>) {\n return /html/ `\n <style>\n :host {\n position: relative;\n }\n\n video {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n object-fit: var(--media-object-fit, inherit);\n object-position: var(--media-object-position, 50% 50%);\n }\n </style>\n <slot></slot>\n <video ${serializeAttributes(attrs)}></video>\n `;\n}\n\n// Don't extend CustomMediaMixin to save some bytes, background videos don't need the full Media API.\nexport class BackgroundVideo extends MediaAttachMixin(HTMLElement) {\n static shadowRootOptions = { mode: 'open' as ShadowRootMode };\n static getTemplateHTML = getTemplateHTML;\n static get observedAttributes() {\n return ['src'];\n }\n\n constructor() {\n super();\n\n if (!this.shadowRoot) {\n this.attachShadow((this.constructor as typeof BackgroundVideo).shadowRootOptions);\n\n const attrs = {\n ...namedNodeMapToObject(this.attributes),\n ...(!this.hasAttribute('nomuted') && { muted: '' }),\n ...(!this.hasAttribute('noloop') && { loop: '' }),\n ...(!this.hasAttribute('noautoplay') && { autoplay: '' }),\n playsinline: '',\n disableremoteplayback: '',\n disablepictureinpicture: '',\n };\n\n this.shadowRoot!.innerHTML = getTemplateHTML(attrs);\n }\n\n // Neither Chrome or Firefox support setting the muted attribute\n // after using document.createElement.\n // Get around this by setting the muted property manually.\n this.target!.muted = !this.hasAttribute('nomuted');\n }\n\n // Register the inner <video> (not `this`) with the provider.\n getMediaTarget(): Media \| null {\n return this.target;\n }\n\n attributeChangedCallback(attrName: string, oldValue: string \| null, newValue: string \| null): void {\n if (attrName === 'src' && oldValue !== newValue) {\n this.target!.src = newValue ?? '';\n }\n }\n\n get target(): HTMLVideoElement \| null {\n return (\n this.querySelector(':scope > [slot=media]') ??\n this.querySelector('video') ??\n this.shadowRoot?.querySelector('video') ??\n null\n );\n }\n}\n\nconst VideoAttributes = [\n 'autoplay',\n 'controls',\n 'controlslist',\n 'crossorigin',\n 'disablepictureinpicture',\n 'disableremoteplayback',\n 'loop',\n 'muted',\n 'playsinline',\n 'preload',\n] as const;\n\nfunction serializeAttributes(attrs: Record<string, string>): string {\n let html = '';\n for (const key in attrs) {\n // Skip forwarding non native video attributes.\n if (!VideoAttributes.includes(key as any)) continue;\n\n const value = attrs[key];\n if (value === '') html += ` ${key}`;\n else html += ` ${key}=\"${value}\"`;\n }\n return html;\n}\n"],"mappings":";;;AAIA,SAAS,gBAAgB,OAA+B;AACtD,QAAgB,8OAAA,oBAAA,MAAA,CAAA;;AAIlB,IAAM,kBAAN,cAAM,iBAAA,YAAA,CAAA;;;;;yBAEM;;CACV,WAAM,qBAAkB;AACtB,SAAI,CAAA,MAAQ;;CAGd,cAAa;AACX,SAAI;AAEJ,MAAE,CAAA,KAAK,YAAA;AACN,QAAM,aAAK,KAAA,YAAA,kBAAA;GAEb,MAAA,QAAA;IACH,GAAA,qBAAA,KAAA,WAAA;;IAEQ,GAAC,CAAA,KAAO,aAAA,SAAwB,IAAC,EAAK,MAAM,IAAC;IAC9C,GAAK,CAAC,KAAA,aAAgB,aAAQ,IAAA,EAAA,UAAiB,IAAA;IAC9C,aAAC;IACD,uBAAmB;IACnB,yBAAyB;IAC7B;;;;;CAYF,iBAA8B;AAC5B,SAAO,KAAE;;CAGX,yBAAM,UAA2B,UAAA,UAAA;AAC/B,MAAG,aAAA,SAAA,aAAA,SAAA,MAAA,OAAA,MAAA,YAAA;;CAKL,IAAI,SAAkC;AACpC,SACE,KAAK,cAAc,wBAAmB,IACxC,KAAK,cAAgB,QAAM,IAC7B,KAAA,YAAA,cAAA,QAAA,IAAA;;;;CAOA;CACA;CACA;CACA;CACA;;CAEA;CACA;CACA;CACA;CACD;AAED,SAAK,oBAAA,OAAA;CACH,IAAA,OAAA;AACF,MAAA,MAAA,OAAA,OAAA;AAEA,MAAM,CAAA,gBAAkB,SAAA,IAAA,CAAA;EAErB,MAAA,QAAS,MAAA;AACT,MAAA,UAAa,GAAA,SAAA,IAAA;MACb,SAAY,IAAA,IAAA,IAAA,MAAA;;AAEb,QAAC"}

package/dist/default/media/container-element.js CHANGED Viewed

@@ -1,7 +1,6 @@
 import { containerContext, playerContext } from "../player/context.js";
 import { createContainerMixin } from "../store/container-mixin.js";
 import { MediaElement } from "../ui/media-element.js";
 //#region src/media/container-element.ts
 const ContainerMixin = createContainerMixin({
 	playerContext,
@@ -12,7 +11,7 @@ var MediaContainerElement = class extends ContainerMixin(MediaElement) {
 		this.tagName = "media-container";
 	}
 };
 //#endregion
 export { MediaContainerElement };
 //# sourceMappingURL=container-element.js.map

package/dist/default/media/container-element.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"container-element.js","names":[],"sources":["../../../src/media/container-element.ts"],"sourcesContent":["import { containerContext, playerContext } from '../player/context';\nimport { createContainerMixin } from '../store/container-mixin';\nimport { MediaElement } from '../ui/media-element';\n\nconst ContainerMixin = createContainerMixin({ playerContext, containerContext });\n\nexport class MediaContainerElement extends ContainerMixin(MediaElement) {\n static readonly tagName = 'media-container';\n}\n"],"mappings":"~~;;;;;~~AAIA,MAAM,iBAAiB,qBAAqB;CAAE;CAAe;CAAkB,CAAC;AAEhF,IAAa,wBAAb,cAA2C,eAAe,aAAa,CAAC;;iBAC5C"}
1	+ {"version":3,"file":"container-element.js","names":[],"sources":["../../../src/media/container-element.ts"],"sourcesContent":["import { containerContext, playerContext } from '../player/context';\nimport { createContainerMixin } from '../store/container-mixin';\nimport { MediaElement } from '../ui/media-element';\n\nconst ContainerMixin = createContainerMixin({ playerContext, containerContext });\n\nexport class MediaContainerElement extends ContainerMixin(MediaElement) {\n static readonly tagName = 'media-container';\n}\n"],"mappings":";;;;AAIA,MAAM,iBAAiB,qBAAqB;CAAE;CAAe;CAAkB,CAAC;AAEhF,IAAa,wBAAb,cAA2C,eAAe,aAAa,CAAC;;iBAC5C"}

package/dist/default/media/dash-video/index.js CHANGED Viewed

@@ -1,26 +1,18 @@
 import { MediaAttachMixin } from "../../store/media-attach-mixin.js";
-import { DashCustomMedia } from "@videojs/core/dom/media/dash";
+import { MediaPropsMixin } from "../../utils/media-props-mixin.js";
+import { DashCustomMedia, DashMediaDelegate } from "@videojs/core/dom/media/dash";
 //#region src/media/dash-video/index.ts
-var DashVideo = class extends MediaAttachMixin(DashCustomMedia) {
-	static getTemplateHTML(attrs) {
-		const { src, ...rest } = attrs;
-		return super.getTemplateHTML(rest);
-	}
+var DashVideo = class extends MediaPropsMixin(MediaAttachMixin(DashCustomMedia), DashMediaDelegate) {
 	constructor() {
 		super();
 		this.attach(this.target);
 	}
-	attributeChangedCallback(attrName, oldValue, newValue) {
-		if (attrName !== "src") super.attributeChangedCallback(attrName, oldValue, newValue);
-		if (attrName === "src" && oldValue !== newValue) this.src = newValue ?? "";
-	}
 	disconnectedCallback() {
 		super.disconnectedCallback?.();
 		if (!this.hasAttribute("keep-alive")) this.destroy();
 	}
 };
 //#endregion
 export { DashVideo };
 //# sourceMappingURL=index.js.map

package/dist/default/media/dash-video/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/dash-video/index.ts"],"sourcesContent":["import { DashCustomMedia } from '@videojs/core/dom/media/dash';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\n\nexport class DashVideo extends MediaAttachMixin(DashCustomMedia) ~~{\n static getTemplateHTML(attrs: Record<string~~, ~~string>~~): ~~string~~ {\n ~~const { src, ...rest } = attrs;\n // biome-ignore lint/complexity/noThisInStatic: intentional use of super\n return super.getTemplateHTML(rest);\n~~ ~~}\n\n~~ constructor() {\n super();\n this.attach(this.target);\n }\n\n attributeChangedCallback(attrName: string, oldValue: string \| null, newValue: string \| null): void {\n if (attrName !== 'src') {\n super.attributeChangedCallback(attrName, oldValue, newValue);\n }\n\n if (attrName === 'src' && oldValue !== newValue) {\n this.src = newValue ?? '';\n }\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback?.();\n\n if (!this.hasAttribute('keep-alive')) {\n this.destroy();\n }\n }\n}\n"],"mappings":";;;;~~AAGA~~,IAAa,YAAb,cAA+B,~~iBAAiB,~~gBAAgB,~~CAAC;CAC/D~~,~~OAAO,~~gBAAgB,~~OAAuC;EAC5D,MAAM,~~EAAE,~~KAAK~~,~~GAAG,SAAS~~;~~AAEzB~~,~~SAAO,MAAM,gBAAgB,KAAK;;CAGpC,~~cAAc;AACZ,SAAO;AACP,OAAK,OAAO,KAAK,OAAO;;CAG1B,~~yBAAyB,UAAkB,UAAyB,UAA+B;AACjG,MAAI,aAAa,MACf,OAAM,yBAAyB,UAAU,UAAU,SAAS;AAG9D,MAAI,aAAa,SAAS,aAAa,SACrC,MAAK,MAAM,YAAY;;CAI3B,~~uBAA6B;AAC3B,QAAM,wBAAwB;AAE9B,MAAI,CAAC,KAAK,aAAa,aAAa,CAClC,MAAK,SAAS"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/dash-video/index.ts"],"sourcesContent":["import { DashCustomMedia, DashMediaDelegate } from '@videojs/core/dom/media/dash';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\nimport { MediaPropsMixin } from '../../utils/media-props-mixin';\n\nexport class DashVideo extends MediaPropsMixin(MediaAttachMixin(DashCustomMedia), DashMediaDelegate) {\n constructor() {\n super();\n this.attach(this.target);\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback?.();\n\n if (!this.hasAttribute('keep-alive')) {\n this.destroy();\n }\n }\n}\n"],"mappings":";;;;AAIA,IAAa,YAAb,cAA+B,gBAAgB,iBAAiB,gBAAgB,EAAE,kBAAkB,CAAC;CACnG,cAAc;AACZ,SAAO;AACP,OAAK,OAAO,KAAK,OAAO;;CAG1B,uBAA6B;AAC3B,QAAM,wBAAwB;AAE9B,MAAI,CAAC,KAAK,aAAa,aAAa,CAClC,MAAK,SAAS"}

package/dist/default/media/hls-video/index.js CHANGED Viewed

@@ -1,26 +1,18 @@
 import { MediaAttachMixin } from "../../store/media-attach-mixin.js";
-import { HlsCustomMedia } from "@videojs/core/dom/media/hls";
+import { MediaPropsMixin } from "../../utils/media-props-mixin.js";
+import { HlsCustomMedia, HlsMediaDelegate } from "@videojs/core/dom/media/hls";
 //#region src/media/hls-video/index.ts
-var HlsVideo = class extends MediaAttachMixin(HlsCustomMedia) {
-	static getTemplateHTML(attrs) {
-		const { src, ...rest } = attrs;
-		return super.getTemplateHTML(rest);
-	}
+var HlsVideo = class extends MediaPropsMixin(MediaAttachMixin(HlsCustomMedia), HlsMediaDelegate) {
 	constructor() {
 		super();
 		this.attach(this.target);
 	}
-	attributeChangedCallback(attrName, oldValue, newValue) {
-		if (attrName !== "src") super.attributeChangedCallback(attrName, oldValue, newValue);
-		if (attrName === "src" && oldValue !== newValue) this.src = newValue ?? "";
-	}
 	disconnectedCallback() {
 		super.disconnectedCallback?.();
 		if (!this.hasAttribute("keep-alive")) this.destroy();
 	}
 };
 //#endregion
 export { HlsVideo };
 //# sourceMappingURL=index.js.map

package/dist/default/media/hls-video/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/hls-video/index.ts"],"sourcesContent":["import { HlsCustomMedia } from '@videojs/core/dom/media/hls';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\n\nexport class HlsVideo extends MediaAttachMixin(HlsCustomMedia) ~~{\n static getTemplateHTML(attrs: Record<string~~, ~~string>~~): ~~string~~ {\n ~~const { src, ...rest } = attrs;\n // biome-ignore lint/complexity/noThisInStatic: intentional use of super\n return super.getTemplateHTML(rest);\n~~ ~~}\n\n~~ constructor() {\n super();\n // TODO: If we like to support native media elements that\n // are appended after the custom element is created, we need to\n // attach the native element to the Media API after the native element\n // is appended to the DOM. This is currently not supported.\n this.attach(this.target);\n }\n\n attributeChangedCallback(attrName: string, oldValue: string \| null, newValue: string \| null): void {\n if (attrName !== 'src') {\n super.attributeChangedCallback(attrName, oldValue, newValue);\n }\n\n if (attrName === 'src' && oldValue !== newValue) {\n this.src = newValue ?? '';\n }\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback?.();\n\n if (!this.hasAttribute('keep-alive')) {\n this.destroy();\n }\n }\n}\n"],"mappings":";;;;~~AAGA~~,IAAa,WAAb,cAA8B,iBAAiB,eAAe,~~CAAC;CAC7D,OAAO,gBAAgB,OAAuC;EAC5D,MAAM,~~EAAE,~~KAAK~~,~~GAAG,SAAS~~;~~AAEzB~~,~~SAAO,MAAM,gBAAgB,KAAK;;CAGpC,~~cAAc;AACZ,SAAO;AAKP,OAAK,OAAO,KAAK,OAAO;;CAG1B,~~yBAAyB,UAAkB,UAAyB,UAA+B;AACjG,MAAI,aAAa,MACf,OAAM,yBAAyB,UAAU,UAAU,SAAS;AAG9D,MAAI,aAAa,SAAS,aAAa,SACrC,MAAK,MAAM,YAAY;;CAI3B,~~uBAA6B;AAC3B,QAAM,wBAAwB;AAE9B,MAAI,CAAC,KAAK,aAAa,aAAa,CAClC,MAAK,SAAS"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/hls-video/index.ts"],"sourcesContent":["import { HlsCustomMedia, HlsMediaDelegate } from '@videojs/core/dom/media/hls';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\nimport { MediaPropsMixin } from '../../utils/media-props-mixin';\n\nexport class HlsVideo extends MediaPropsMixin(MediaAttachMixin(HlsCustomMedia), HlsMediaDelegate) {\n constructor() {\n super();\n // TODO: If we like to support native media elements that\n // are appended after the custom element is created, we need to\n // attach the native element to the Media API after the native element\n // is appended to the DOM. This is currently not supported.\n this.attach(this.target);\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback?.();\n\n if (!this.hasAttribute('keep-alive')) {\n this.destroy();\n }\n }\n}\n"],"mappings":";;;;AAIA,IAAa,WAAb,cAA8B,gBAAgB,iBAAiB,eAAe,EAAE,iBAAiB,CAAC;CAChG,cAAc;AACZ,SAAO;AAKP,OAAK,OAAO,KAAK,OAAO;;CAG1B,uBAA6B;AAC3B,QAAM,wBAAwB;AAE9B,MAAI,CAAC,KAAK,aAAa,aAAa,CAClC,MAAK,SAAS"}

package/dist/default/media/mux-video/index.js ADDED Viewed

@@ -0,0 +1,18 @@
+import { MediaAttachMixin } from "../../store/media-attach-mixin.js";
+import { MediaPropsMixin } from "../../utils/media-props-mixin.js";
+import { MuxCustomVideo, MuxMediaDelegate } from "@videojs/core/dom/media/mux";
+//#region src/media/mux-video/index.ts
+var MuxVideo = class extends MediaPropsMixin(MediaAttachMixin(MuxCustomVideo), MuxMediaDelegate) {
+	constructor() {
+		super();
+		this.attach(this.target);
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback?.();
+		if (!this.hasAttribute("keep-alive")) this.destroy();
+	}
+};
+//#endregion
+export { MuxVideo };
+//# sourceMappingURL=index.js.map

package/dist/default/media/mux-video/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/mux-video/index.ts"],"sourcesContent":["import { MuxCustomVideo, MuxMediaDelegate } from '@videojs/core/dom/media/mux';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\nimport { MediaPropsMixin } from '../../utils/media-props-mixin';\n\nexport class MuxVideo extends MediaPropsMixin(MediaAttachMixin(MuxCustomVideo), MuxMediaDelegate) {\n constructor() {\n super();\n this.attach(this.target);\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback?.();\n\n if (!this.hasAttribute('keep-alive')) {\n this.destroy();\n }\n }\n}\n"],"mappings":";;;;AAIA,IAAa,WAAb,cAA8B,gBAAgB,iBAAiB,eAAe,EAAE,iBAAiB,CAAC;CAChG,cAAc;AACZ,SAAO;AACP,OAAK,OAAO,KAAK,OAAO;;CAG1B,uBAA6B;AAC3B,QAAM,wBAAwB;AAE9B,MAAI,CAAC,KAAK,aAAa,aAAa,CAClC,MAAK,SAAS"}

package/dist/default/media/native-hls-video/index.js ADDED Viewed

@@ -0,0 +1,18 @@
+import { MediaAttachMixin } from "../../store/media-attach-mixin.js";
+import { MediaPropsMixin } from "../../utils/media-props-mixin.js";
+import { NativeHlsCustomMedia, NativeHlsMediaDelegate } from "@videojs/core/dom/media/native-hls";
+//#region src/media/native-hls-video/index.ts
+var NativeHlsVideo = class extends MediaPropsMixin(MediaAttachMixin(NativeHlsCustomMedia), NativeHlsMediaDelegate) {
+	constructor() {
+		super();
+		this.attach(this.target);
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback?.();
+		if (!this.hasAttribute("keep-alive")) this.destroy();
+	}
+};
+//#endregion
+export { NativeHlsVideo };
+//# sourceMappingURL=index.js.map

package/dist/default/media/native-hls-video/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/native-hls-video/index.ts"],"sourcesContent":["import { NativeHlsCustomMedia, NativeHlsMediaDelegate } from '@videojs/core/dom/media/native-hls';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\nimport { MediaPropsMixin } from '../../utils/media-props-mixin';\n\nexport class NativeHlsVideo extends MediaPropsMixin(MediaAttachMixin(NativeHlsCustomMedia), NativeHlsMediaDelegate) {\n constructor() {\n super();\n this.attach(this.target);\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback?.();\n\n if (!this.hasAttribute('keep-alive')) {\n this.destroy();\n }\n }\n}\n"],"mappings":";;;;AAIA,IAAa,iBAAb,cAAoC,gBAAgB,iBAAiB,qBAAqB,EAAE,uBAAuB,CAAC;CAClH,cAAc;AACZ,SAAO;AACP,OAAK,OAAO,KAAK,OAAO;;CAG1B,uBAA6B;AAC3B,QAAM,wBAAwB;AAE9B,MAAI,CAAC,KAAK,aAAa,aAAa,CAClC,MAAK,SAAS"}

package/dist/default/media/simple-hls-video/index.js CHANGED Viewed

@@ -1,23 +1,15 @@
 import { MediaAttachMixin } from "../../store/media-attach-mixin.js";
+import { MediaPropsMixin } from "../../utils/media-props-mixin.js";
 import { SimpleHlsCustomMedia } from "@videojs/core/dom/media/simple-hls";
+import { SpfMedia } from "@videojs/spf/dom";
 //#region src/media/simple-hls-video/index.ts
-var SimpleHlsVideo = class extends MediaAttachMixin(SimpleHlsCustomMedia) {
-	static getTemplateHTML(attrs) {
-		const { src, ...rest } = attrs;
-		return super.getTemplateHTML(rest);
-	}
+var SimpleHlsVideo = class extends MediaPropsMixin(MediaAttachMixin(SimpleHlsCustomMedia), SpfMedia) {
 	constructor() {
 		super();
 		this.attach(this.target);
 	}
-	attributeChangedCallback(attrName, oldValue, newValue) {
-		if (attrName !== "src") super.attributeChangedCallback(attrName, oldValue, newValue);
-		if (attrName === "src" && oldValue !== newValue) this.src = newValue ?? "";
-		if (attrName === "preload" && oldValue !== newValue) this.preload = newValue ?? "";
-	}
 };
 //#endregion
 export { SimpleHlsVideo };
 //# sourceMappingURL=index.js.map

package/dist/default/media/simple-hls-video/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/simple-hls-video/index.ts"],"sourcesContent":["import { SimpleHlsCustomMedia } from '@videojs/core/dom/media/simple-hls';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\n\nexport class SimpleHlsVideo extends MediaAttachMixin(SimpleHlsCustomMedia) ~~{\n static getTemplateHTML(attrs: Record<string~~, ~~string>~~): ~~string~~ {\n ~~const { src, ...rest } = attrs;\n // biome-ignore lint/complexity/noThisInStatic: intentional use of super\n return super.getTemplateHTML(rest);\n~~ ~~}\n\n~~ constructor() {\n super();\n this.attach(this.target);\n }\n\n attributeChangedCallback(attrName: string, oldValue: string \| null, newValue: string \| null): void {\n if (attrName !== 'src') {\n super.attributeChangedCallback(attrName, oldValue, newValue);\n }\n\n if (attrName === 'src' && oldValue !== newValue) {\n this.src = newValue ?? '';\n }\n\n if (attrName === 'preload' && oldValue !== newValue) {\n this.preload = (newValue ?? '') as '' \| 'none' \| 'metadata' \| 'auto';\n }\n }\n}\n"],"mappings":"~~;;;;AAGA~~,IAAa,iBAAb,cAAoC,iBAAiB,qBAAqB,~~CAAC;CACzE,OAAO,gBAAgB,OAAuC;EAC5D,MAAM,~~EAAE,~~KAAK~~,~~GAAG,SAAS~~;~~AAEzB~~,~~SAAO,MAAM,gBAAgB,KAAK;;CAGpC,~~cAAc;AACZ,SAAO;AACP,OAAK,OAAO,KAAK,OAAO~~;;CAG1B,yBAAyB,UAAkB,UAAyB,UAA+B;AACjG,MAAI,aAAa,MACf,OAAM,yBAAyB,UAAU,UAAU,SAAS;AAG9D,MAAI,aAAa,SAAS,aAAa,SACrC,MAAK,MAAM,YAAY;AAGzB,MAAI,aAAa,aAAa,aAAa,SACzC,MAAK,UAAW,YAAY~~"}
1	+ {"version":3,"file":"index.js","names":[],"sources":["../../../../src/media/simple-hls-video/index.ts"],"sourcesContent":["import { SimpleHlsCustomMedia } from '@videojs/core/dom/media/simple-hls';\nimport { SpfMedia } from '@videojs/spf/dom';\nimport { MediaAttachMixin } from '../../store/media-attach-mixin';\nimport { MediaPropsMixin } from '../../utils/media-props-mixin';\n\nexport class SimpleHlsVideo extends MediaPropsMixin(MediaAttachMixin(SimpleHlsCustomMedia), SpfMedia) {\n constructor() {\n super();\n this.attach(this.target);\n }\n}\n"],"mappings":";;;;;AAKA,IAAa,iBAAb,cAAoC,gBAAgB,iBAAiB,qBAAqB,EAAE,SAAS,CAAC;CACpG,cAAc;AACZ,SAAO;AACP,OAAK,OAAO,KAAK,OAAO"}

package/dist/default/player/context.js CHANGED Viewed

@@ -1,5 +1,4 @@
 import { createContext } from "@videojs/element/context";
 //#region src/player/context.ts
 const PLAYER_CONTEXT_KEY = Symbol.for("@videojs/player");
 /**
@@ -12,7 +11,7 @@ const MEDIA_CONTEXT_KEY = Symbol.for("@videojs/media");
 const mediaContext = createContext(MEDIA_CONTEXT_KEY);
 const CONTAINER_CONTEXT_KEY = Symbol.for("@videojs/container");
 const containerContext = createContext(CONTAINER_CONTEXT_KEY);
 //#endregion
 export { CONTAINER_CONTEXT_KEY, MEDIA_CONTEXT_KEY, PLAYER_CONTEXT_KEY, containerContext, mediaContext, playerContext };
 //# sourceMappingURL=context.js.map

package/dist/default/player/context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context.js","names":[],"sources":["../../../src/player/context.ts"],"sourcesContent":["import type { AnyPlayerStore, Media, MediaContainer, PlayerStore } from '@videojs/core/dom';\nimport { type Context, createContext } from '@videojs/element/context';\n\n// ----------------------------------------\n// Player Context\n// ----------------------------------------\n\nexport const PLAYER_CONTEXT_KEY = Symbol.for('@videojs/player');\n\nexport type PlayerContextValue<Store extends PlayerStore = AnyPlayerStore> = Store;\n\nexport type PlayerContext<Store extends PlayerStore = AnyPlayerStore> = Context<\n typeof PLAYER_CONTEXT_KEY,\n PlayerContextValue<Store>\n>;\n\n/*\n The default player context instance for consuming the player store in controllers.\n \n @public\n */\nexport const playerContext = createContext<PlayerContextValue, typeof PLAYER_CONTEXT_KEY>(PLAYER_CONTEXT_KEY);\n\n// ----------------------------------------\n// Media Context\n// ----------------------------------------\n\nexport const MEDIA_CONTEXT_KEY = Symbol.for('@videojs/media');\n\nexport interface MediaContextValue {\n media: Media \| null;\n setMedia: (media: Media \| null) => void;\n}\n\nexport type MediaContext = Context<typeof MEDIA_CONTEXT_KEY, MediaContextValue>;\n\nexport const mediaContext = createContext<MediaContextValue, typeof MEDIA_CONTEXT_KEY>(MEDIA_CONTEXT_KEY);\n\n// ----------------------------------------\n// Container Context\n// ----------------------------------------\n\nexport const CONTAINER_CONTEXT_KEY = Symbol.for('@videojs/container');\n\nexport interface ContainerContextValue {\n container: MediaContainer \| null;\n setContainer: (container: MediaContainer \| null) => void;\n}\n\nexport type ContainerContext = Context<typeof CONTAINER_CONTEXT_KEY, ContainerContextValue>;\n\nexport const containerContext = createContext<ContainerContextValue, typeof CONTAINER_CONTEXT_KEY>(\n CONTAINER_CONTEXT_KEY\n);\n"],"mappings":"~~;;;~~AAOA,MAAa,qBAAqB,OAAO,IAAI,kBAAkB;;;;;;AAc/D,MAAa,gBAAgB,cAA6D,mBAAmB;AAM7G,MAAa,oBAAoB,OAAO,IAAI,iBAAiB;AAS7D,MAAa,eAAe,cAA2D,kBAAkB;AAMzG,MAAa,wBAAwB,OAAO,IAAI,qBAAqB;AASrE,MAAa,mBAAmB,cAC9B,sBACD"}
1	+ {"version":3,"file":"context.js","names":[],"sources":["../../../src/player/context.ts"],"sourcesContent":["import type { AnyPlayerStore, Media, MediaContainer, PlayerStore } from '@videojs/core/dom';\nimport { type Context, createContext } from '@videojs/element/context';\n\n// ----------------------------------------\n// Player Context\n// ----------------------------------------\n\nexport const PLAYER_CONTEXT_KEY = Symbol.for('@videojs/player');\n\nexport type PlayerContextValue<Store extends PlayerStore = AnyPlayerStore> = Store;\n\nexport type PlayerContext<Store extends PlayerStore = AnyPlayerStore> = Context<\n typeof PLAYER_CONTEXT_KEY,\n PlayerContextValue<Store>\n>;\n\n/*\n The default player context instance for consuming the player store in controllers.\n \n @public\n */\nexport const playerContext = createContext<PlayerContextValue, typeof PLAYER_CONTEXT_KEY>(PLAYER_CONTEXT_KEY);\n\n// ----------------------------------------\n// Media Context\n// ----------------------------------------\n\nexport const MEDIA_CONTEXT_KEY = Symbol.for('@videojs/media');\n\nexport interface MediaContextValue {\n media: Media \| null;\n setMedia: (media: Media \| null) => void;\n}\n\nexport type MediaContext = Context<typeof MEDIA_CONTEXT_KEY, MediaContextValue>;\n\nexport const mediaContext = createContext<MediaContextValue, typeof MEDIA_CONTEXT_KEY>(MEDIA_CONTEXT_KEY);\n\n// ----------------------------------------\n// Container Context\n// ----------------------------------------\n\nexport const CONTAINER_CONTEXT_KEY = Symbol.for('@videojs/container');\n\nexport interface ContainerContextValue {\n container: MediaContainer \| null;\n setContainer: (container: MediaContainer \| null) => void;\n}\n\nexport type ContainerContext = Context<typeof CONTAINER_CONTEXT_KEY, ContainerContextValue>;\n\nexport const containerContext = createContext<ContainerContextValue, typeof CONTAINER_CONTEXT_KEY>(\n CONTAINER_CONTEXT_KEY\n);\n"],"mappings":";;AAOA,MAAa,qBAAqB,OAAO,IAAI,kBAAkB;;;;;;AAc/D,MAAa,gBAAgB,cAA6D,mBAAmB;AAM7G,MAAa,oBAAoB,OAAO,IAAI,iBAAiB;AAS7D,MAAa,eAAe,cAA2D,kBAAkB;AAMzG,MAAa,wBAAwB,OAAO,IAAI,qBAAqB;AASrE,MAAa,mBAAmB,cAC9B,sBACD"}

package/dist/default/player/create-player.js CHANGED Viewed

@@ -3,7 +3,6 @@ import { createContainerMixin } from "../store/container-mixin.js";
 import { createProviderMixin } from "../store/provider-mixin.js";
 import { PlayerController } from "./player-controller.js";
 import { combine, createStore } from "@videojs/store";
 //#region src/player/create-player.ts
 function createPlayer(config) {
 	const slice = combine(...config.features);
@@ -26,7 +25,7 @@ function createPlayer(config) {
 		})
 	};
 }
 //#endregion
 export { createPlayer };
 //# sourceMappingURL=create-player.js.map

package/dist/default/player/create-player.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create-player.js","names":[],"sources":["../../../src/player/create-player.ts"],"sourcesContent":["import type {\n AnyPlayerFeature,\n AudioFeatures,\n AudioPlayerStore,\n PlayerStore,\n PlayerTarget,\n VideoFeatures,\n VideoPlayerStore,\n} from '@videojs/core/dom';\nimport { combine, createStore } from '@videojs/store';\n\nimport { type ContainerMixin, createContainerMixin } from '../store/container-mixin';\nimport { createProviderMixin, type ProviderMixin } from '../store/provider-mixin';\nimport { containerContext, mediaContext, type PlayerContext, playerContext } from './context';\nimport { PlayerController } from './player-controller';\n\nexport interface CreatePlayerConfig<Features extends AnyPlayerFeature[]> {\n features: Features;\n}\n\nexport interface CreatePlayerResult<Store extends PlayerStore> {\n /** Context for consuming player in controllers. /\n context: PlayerContext<Store>;\n\n /* Creates a store instance for imperative access. /\n create: () => Store;\n\n /* Player controller bound to this player's context. /\n PlayerController: PlayerController.Constructor<Store>;\n\n /* Mixin that provides player context to descendants. /\n ProviderMixin: ProviderMixin<Store>;\n\n /* Mixin that consumes player context and registers as the container element. /\n ContainerMixin: ContainerMixin<Store>;\n}\n\n/\n Creates a player factory with typed store, mixins, and controller.\n \n @example\n * ```ts\n * import { createPlayer, MediaElement, selectPlayback } from '@videojs/html';\n * import { videoFeatures } from '@videojs/html/video';\n \n const { ProviderMixin, ContainerMixin, PlayerController, context } = createPlayer({\n * features: videoFeatures,\n * });\n \n // Provider element: owns the store, provides context to descendants\n * class VideoPlayer extends ProviderMixin(MediaElement) {}\n * customElements.define('video-player', VideoPlayer);\n \n // Control element with selector\n * class PlayButton extends MediaElement {\n * #playback = new PlayerController(this, context, selectPlayback);\n * }\n * ```\n \n @label Video\n * @param config - Player configuration with features.\n /\nexport function createPlayer(config: CreatePlayerConfig<VideoFeatures>): CreatePlayerResult<VideoPlayerStore>;\n\n/\n Creates a player factory for audio media.\n \n @label Audio\n * @param config - Player configuration with features.\n /\nexport function createPlayer(config: CreatePlayerConfig<AudioFeatures>): CreatePlayerResult<AudioPlayerStore>;\n\n/\n Creates a player factory with custom features.\n \n @label Generic\n * @param config - Player configuration with features.\n */\nexport function createPlayer<const Features extends AnyPlayerFeature[]>(\n config: CreatePlayerConfig<Features>\n): CreatePlayerResult<PlayerStore<Features>>;\n\nexport function createPlayer(config: CreatePlayerConfig<AnyPlayerFeature[]>): CreatePlayerResult<PlayerStore> {\n const slice = combine<PlayerTarget, AnyPlayerFeature[]>(...config.features);\n\n function create(): PlayerStore {\n return createStore<PlayerTarget>()(slice);\n }\n\n const ProviderMixin = createProviderMixin<PlayerStore>({\n playerContext,\n mediaContext,\n containerContext,\n factory: create,\n });\n\n const ContainerMixin = createContainerMixin<PlayerStore>({\n playerContext,\n containerContext,\n });\n\n return {\n context: playerContext,\n create,\n PlayerController,\n ProviderMixin,\n ContainerMixin,\n };\n}\n"],"mappings":"~~;;;;;;;~~AAkFA,SAAgB,aAAa,QAAiF;CAC5G,MAAM,QAAQ,QAA0C,GAAG,OAAO,SAAS;CAE3E,SAAS,SAAsB;AAC7B,SAAO,aAA2B,CAAC,MAAM;;AAe3C,QAAO;EACL,SAAS;EACT;EACA;EACA,eAhBoB,oBAAiC;GACrD;GACA;GACA;GACA,SAAS;GACV,CAAC;EAYA,gBAVqB,qBAAkC;GACvD;GACA;GACD,CAAC;EAQD"}
1	+ {"version":3,"file":"create-player.js","names":[],"sources":["../../../src/player/create-player.ts"],"sourcesContent":["import type {\n AnyPlayerFeature,\n AudioFeatures,\n AudioPlayerStore,\n PlayerStore,\n PlayerTarget,\n VideoFeatures,\n VideoPlayerStore,\n} from '@videojs/core/dom';\nimport { combine, createStore } from '@videojs/store';\n\nimport { type ContainerMixin, createContainerMixin } from '../store/container-mixin';\nimport { createProviderMixin, type ProviderMixin } from '../store/provider-mixin';\nimport { containerContext, mediaContext, type PlayerContext, playerContext } from './context';\nimport { PlayerController } from './player-controller';\n\nexport interface CreatePlayerConfig<Features extends AnyPlayerFeature[]> {\n features: Features;\n}\n\nexport interface CreatePlayerResult<Store extends PlayerStore> {\n /** Context for consuming player in controllers. /\n context: PlayerContext<Store>;\n\n /* Creates a store instance for imperative access. /\n create: () => Store;\n\n /* Player controller bound to this player's context. /\n PlayerController: PlayerController.Constructor<Store>;\n\n /* Mixin that provides player context to descendants. /\n ProviderMixin: ProviderMixin<Store>;\n\n /* Mixin that consumes player context and registers as the container element. /\n ContainerMixin: ContainerMixin<Store>;\n}\n\n/\n Creates a player factory with typed store, mixins, and controller.\n \n @example\n * ```ts\n * import { createPlayer, MediaElement, selectPlayback } from '@videojs/html';\n * import { videoFeatures } from '@videojs/html/video';\n \n const { ProviderMixin, ContainerMixin, PlayerController, context } = createPlayer({\n * features: videoFeatures,\n * });\n \n // Provider element: owns the store, provides context to descendants\n * class VideoPlayer extends ProviderMixin(MediaElement) {}\n * customElements.define('video-player', VideoPlayer);\n \n // Control element with selector\n * class PlayButton extends MediaElement {\n * #playback = new PlayerController(this, context, selectPlayback);\n * }\n * ```\n \n @label Video\n * @param config - Player configuration with features.\n /\nexport function createPlayer(config: CreatePlayerConfig<VideoFeatures>): CreatePlayerResult<VideoPlayerStore>;\n\n/\n Creates a player factory for audio media.\n \n @label Audio\n * @param config - Player configuration with features.\n /\nexport function createPlayer(config: CreatePlayerConfig<AudioFeatures>): CreatePlayerResult<AudioPlayerStore>;\n\n/\n Creates a player factory with custom features.\n \n @label Generic\n * @param config - Player configuration with features.\n */\nexport function createPlayer<const Features extends AnyPlayerFeature[]>(\n config: CreatePlayerConfig<Features>\n): CreatePlayerResult<PlayerStore<Features>>;\n\nexport function createPlayer(config: CreatePlayerConfig<AnyPlayerFeature[]>): CreatePlayerResult<PlayerStore> {\n const slice = combine<PlayerTarget, AnyPlayerFeature[]>(...config.features);\n\n function create(): PlayerStore {\n return createStore<PlayerTarget>()(slice);\n }\n\n const ProviderMixin = createProviderMixin<PlayerStore>({\n playerContext,\n mediaContext,\n containerContext,\n factory: create,\n });\n\n const ContainerMixin = createContainerMixin<PlayerStore>({\n playerContext,\n containerContext,\n });\n\n return {\n context: playerContext,\n create,\n PlayerController,\n ProviderMixin,\n ContainerMixin,\n };\n}\n"],"mappings":";;;;;;AAkFA,SAAgB,aAAa,QAAiF;CAC5G,MAAM,QAAQ,QAA0C,GAAG,OAAO,SAAS;CAE3E,SAAS,SAAsB;AAC7B,SAAO,aAA2B,CAAC,MAAM;;AAe3C,QAAO;EACL,SAAS;EACT;EACA;EACA,eAhBoB,oBAAiC;GACrD;GACA;GACA;GACA,SAAS;GACV,CAAC;EAYA,gBAVqB,qBAAkC;GACvD;GACA;GACD,CAAC;EAQD"}

package/dist/default/player/player-controller.js CHANGED Viewed

@@ -1,6 +1,5 @@
 import { ContextConsumer } from "@videojs/element/context";
 import { StoreController } from "@videojs/store/html";
 //#region src/player/player-controller.ts
 /**
 * Reactive controller for accessing player store state.
@@ -60,7 +59,7 @@ var PlayerController = class {
 		if (!this.#store && this.#selector) this.#store = new StoreController(this.#host, store, this.#selector);
 	}
 };
 //#endregion
 export { PlayerController };
 //# sourceMappingURL=player-controller.js.map

package/dist/default/player/player-controller.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"player-controller.js","names":["#host","#selector","#consumer","#connect","#store"],"sources":["../../../src/player/player-controller.ts"],"sourcesContent":["import type { PlayerStore } from '@videojs/core/dom';\nimport type { ReactiveController, ReactiveControllerHost } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\nimport type { InferStoreState, Selector } from '@videojs/store';\nimport { StoreController } from '@videojs/store/html';\n\nimport type { PlayerContext } from './context';\n\nexport type PlayerControllerHost = ReactiveControllerHost & HTMLElement;\n\n/*\n Reactive controller for accessing player store state.\n \n Without selector: Returns the store, does NOT subscribe to changes.\n * With selector: Returns selected state, subscribes with shallowEqual comparison.\n \n @example\n * ```ts\n * // Store access (no subscription)\n * class Controls extends MediaElement {\n * #player = new PlayerController(this, playerContext);\n \n handleClick() {\n * this.#player.value.setVolume(0.5);\n * }\n * }\n \n // Selector-based subscription\n * class PlayButton extends MediaElement {\n * #playback = new PlayerController(this, playerContext, selectPlayback);\n * }\n * ```\n /\nexport class PlayerController<Store extends PlayerStore, Result = Store> implements ReactiveController {\n readonly #host: PlayerControllerHost;\n readonly #selector: Selector<InferStoreState<Store>, Result> \| undefined;\n\n #consumer: ContextConsumer<PlayerContext<Store>, PlayerControllerHost>;\n #store: StoreController<Store, Result> \| null = null;\n\n /\n @label Without Selector\n * @param host - The host element that owns this controller.\n * @param context - Player context to resolve the store from.\n /\n constructor(host: PlayerControllerHost, context: PlayerContext<Store>);\n /\n @label With Selector\n * @param host - The host element that owns this controller.\n * @param context - Player context to resolve the store from.\n * @param selector - Derives a value from the player store state.\n */\n constructor(\n host: PlayerControllerHost,\n context: PlayerContext<Store>,\n selector: Selector<InferStoreState<Store>, Result>\n );\n constructor(\n host: PlayerControllerHost,\n context: PlayerContext<Store>,\n selector?: Selector<InferStoreState<Store>, Result>\n ) {\n this.#host = host;\n this.#selector = selector;\n\n this.#consumer = new ContextConsumer(host, {\n context,\n callback: (ctx) => this.#connect(ctx),\n subscribe: true,\n });\n\n host.addController(this);\n }\n\n get value(): Result \| undefined {\n const store = this.#consumer.value;\n if (!store) return undefined;\n\n // Without selector: return store directly\n if (!this.#selector) return store as unknown as Result;\n\n // With selector: use StoreController\n return this.#store?.value;\n }\n\n get displayName(): string \| undefined {\n return this.#selector?.displayName;\n }\n\n hostConnected(): void {\n const store = this.#consumer.value;\n if (store) this.#connect(store);\n }\n\n hostDisconnected(): void {\n this.#store = null;\n }\n\n #connect(store: Store): void {\n if (!this.#store && this.#selector) {\n this.#store = new StoreController(this.#host, store, this.#selector);\n }\n }\n}\n\nexport namespace PlayerController {\n export type Host = PlayerControllerHost;\n\n export type Constructor<Store extends PlayerStore = PlayerStore, Result = Store> = typeof PlayerController<\n Store,\n Result\n >;\n}\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAiCA,IAAa,mBAAb,MAAuG;CACrG~~,CAASA~~;~~CACT,CAASC~~;~~CAET~~;CACA,SAAgD;CAmBhD,YACE,MACA,SACA,UACA;AACA,~~QAAKD~~,~~OAAQ~~;AACb,~~QAAKC~~,~~WAAY~~;AAEjB,~~QAAKC~~,~~WAAY~~,IAAI,gBAAgB,MAAM;GACzC;GACA,WAAW,QAAQ,~~MAAKC~~,~~QAAS~~,IAAI;GACrC,WAAW;GACZ,CAAC;AAEF,OAAK,cAAc,KAAK;;CAG1B,IAAI,QAA4B;EAC9B,MAAM,QAAQ,~~MAAKD~~,~~SAAU~~;AAC7B,MAAI,CAAC,MAAO,QAAO;AAGnB,MAAI,CAAC,~~MAAKD~~,~~SAAW~~,QAAO;AAG5B,SAAO,~~MAAKG~~,~~OAAQ~~;;CAGtB,IAAI,cAAkC;AACpC,SAAO,~~MAAKH~~,~~UAAW~~;;CAGzB,gBAAsB;EACpB,MAAM,QAAQ,~~MAAKC~~,~~SAAU~~;AAC7B,MAAI,MAAO,~~OAAKC~~,~~QAAS~~,MAAM;;CAGjC,mBAAyB;AACvB,~~QAAKC~~,~~QAAS~~;;CAGhB,SAAS,OAAoB;AAC3B,MAAI,CAAC,~~MAAKA~~,~~SAAU~~,~~MAAKH~~,~~SACvB~~,~~OAAKG~~,~~QAAS~~,IAAI,gBAAgB,~~MAAKJ~~,~~MAAO~~,OAAO,~~MAAKC~~,~~SAAU~~"}
1	+ {"version":3,"file":"player-controller.js","names":["#host","#selector","#consumer","#connect","#store"],"sources":["../../../src/player/player-controller.ts"],"sourcesContent":["import type { PlayerStore } from '@videojs/core/dom';\nimport type { ReactiveController, ReactiveControllerHost } from '@videojs/element';\nimport { ContextConsumer } from '@videojs/element/context';\nimport type { InferStoreState, Selector } from '@videojs/store';\nimport { StoreController } from '@videojs/store/html';\n\nimport type { PlayerContext } from './context';\n\nexport type PlayerControllerHost = ReactiveControllerHost & HTMLElement;\n\n/*\n Reactive controller for accessing player store state.\n \n Without selector: Returns the store, does NOT subscribe to changes.\n * With selector: Returns selected state, subscribes with shallowEqual comparison.\n \n @example\n * ```ts\n * // Store access (no subscription)\n * class Controls extends MediaElement {\n * #player = new PlayerController(this, playerContext);\n \n handleClick() {\n * this.#player.value.setVolume(0.5);\n * }\n * }\n \n // Selector-based subscription\n * class PlayButton extends MediaElement {\n * #playback = new PlayerController(this, playerContext, selectPlayback);\n * }\n * ```\n /\nexport class PlayerController<Store extends PlayerStore, Result = Store> implements ReactiveController {\n readonly #host: PlayerControllerHost;\n readonly #selector: Selector<InferStoreState<Store>, Result> \| undefined;\n\n #consumer: ContextConsumer<PlayerContext<Store>, PlayerControllerHost>;\n #store: StoreController<Store, Result> \| null = null;\n\n /\n @label Without Selector\n * @param host - The host element that owns this controller.\n * @param context - Player context to resolve the store from.\n /\n constructor(host: PlayerControllerHost, context: PlayerContext<Store>);\n /\n @label With Selector\n * @param host - The host element that owns this controller.\n * @param context - Player context to resolve the store from.\n * @param selector - Derives a value from the player store state.\n */\n constructor(\n host: PlayerControllerHost,\n context: PlayerContext<Store>,\n selector: Selector<InferStoreState<Store>, Result>\n );\n constructor(\n host: PlayerControllerHost,\n context: PlayerContext<Store>,\n selector?: Selector<InferStoreState<Store>, Result>\n ) {\n this.#host = host;\n this.#selector = selector;\n\n this.#consumer = new ContextConsumer(host, {\n context,\n callback: (ctx) => this.#connect(ctx),\n subscribe: true,\n });\n\n host.addController(this);\n }\n\n get value(): Result \| undefined {\n const store = this.#consumer.value;\n if (!store) return undefined;\n\n // Without selector: return store directly\n if (!this.#selector) return store as unknown as Result;\n\n // With selector: use StoreController\n return this.#store?.value;\n }\n\n get displayName(): string \| undefined {\n return this.#selector?.displayName;\n }\n\n hostConnected(): void {\n const store = this.#consumer.value;\n if (store) this.#connect(store);\n }\n\n hostDisconnected(): void {\n this.#store = null;\n }\n\n #connect(store: Store): void {\n if (!this.#store && this.#selector) {\n this.#store = new StoreController(this.#host, store, this.#selector);\n }\n }\n}\n\nexport namespace PlayerController {\n export type Host = PlayerControllerHost;\n\n export type Constructor<Store extends PlayerStore = PlayerStore, Result = Store> = typeof PlayerController<\n Store,\n Result\n >;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAiCA,IAAa,mBAAb,MAAuG;CACrG;CACA;CAEA;CACA,SAAgD;CAmBhD,YACE,MACA,SACA,UACA;AACA,QAAA,OAAa;AACb,QAAA,WAAiB;AAEjB,QAAA,WAAiB,IAAI,gBAAgB,MAAM;GACzC;GACA,WAAW,QAAQ,MAAA,QAAc,IAAI;GACrC,WAAW;GACZ,CAAC;AAEF,OAAK,cAAc,KAAK;;CAG1B,IAAI,QAA4B;EAC9B,MAAM,QAAQ,MAAA,SAAe;AAC7B,MAAI,CAAC,MAAO,QAAO,KAAA;AAGnB,MAAI,CAAC,MAAA,SAAgB,QAAO;AAG5B,SAAO,MAAA,OAAa;;CAGtB,IAAI,cAAkC;AACpC,SAAO,MAAA,UAAgB;;CAGzB,gBAAsB;EACpB,MAAM,QAAQ,MAAA,SAAe;AAC7B,MAAI,MAAO,OAAA,QAAc,MAAM;;CAGjC,mBAAyB;AACvB,QAAA,QAAc;;CAGhB,SAAS,OAAoB;AAC3B,MAAI,CAAC,MAAA,SAAe,MAAA,SAClB,OAAA,QAAc,IAAI,gBAAgB,MAAA,MAAY,OAAO,MAAA,SAAe"}

package/dist/default/presets/audio.js CHANGED Viewed

@@ -3,5 +3,4 @@ import { MinimalAudioSkinElement } from "../define/audio/minimal-skin.js";
 import { AudioSkinTailwindElement } from "../define/audio/skin.tailwind.js";
 import { AudioSkinElement } from "../define/audio/skin.js";
 import { audioFeatures } from "@videojs/core/dom";
-export { AudioSkinElement, AudioSkinTailwindElement, MinimalAudioSkinElement, MinimalAudioSkinTailwindElement, audioFeatures };
+export { AudioSkinElement, AudioSkinTailwindElement, MinimalAudioSkinElement, MinimalAudioSkinTailwindElement, audioFeatures };

package/dist/default/presets/background.js CHANGED Viewed

@@ -1,3 +1,2 @@
 import { backgroundFeatures } from "@videojs/core/dom";
-export { backgroundFeatures };
+export { backgroundFeatures };

package/dist/default/presets/video.js CHANGED Viewed

@@ -3,5 +3,4 @@ import { MinimalVideoSkinElement } from "../define/video/minimal-skin.js";
 import { VideoSkinTailwindElement } from "../define/video/skin.tailwind.js";
 import { VideoSkinElement } from "../define/video/skin.js";
 import { videoFeatures } from "@videojs/core/dom";
-export { MinimalVideoSkinElement, MinimalVideoSkinTailwindElement, VideoSkinElement, VideoSkinTailwindElement, videoFeatures };
+export { MinimalVideoSkinElement, MinimalVideoSkinTailwindElement, VideoSkinElement, VideoSkinTailwindElement, videoFeatures };

package/dist/default/skins/dist/default/default/tailwind/audio.tailwind.js CHANGED Viewed

@@ -1,22 +1,21 @@
-import { iconState } from "../../shared/tailwind/icon-state.js";
-import { tooltipState } from "../../shared/tailwind/tooltip-state.js";
+import "../../shared/tailwind/icon-state.js";
+import "../../shared/tailwind/tooltip-state.js";
 import { bufferingIndicator as bufferingIndicator$1 } from "./components/buffering.js";
 import { controls as controls$1 } from "./components/controls.js";
 import { error as error$1 } from "./components/error.js";
 import { popup as popup$1 } from "./components/popup.js";
 import { root as root$1 } from "./components/root.js";
 import { slider as slider$1 } from "./components/slider.js";
-import { surface as surface$1 } from "./components/surface.js";
-import { button } from "./components/button.js";
-import { icon, iconContainer, iconFlipped } from "./components/icon.js";
-import { playbackRate } from "./components/playback-rate.js";
-import { seek } from "./components/seek.js";
-import { time } from "./components/time.js";
+import { surface } from "./components/surface.js";
+import "./components/button.js";
+import "./components/button-group.js";
+import "./components/icon.js";
+import "./components/playback-rate.js";
+import "./components/seek.js";
+import "./components/time.js";
 import { cn } from "@videojs/utils/style";
 //#region ../skins/dist/default/default/tailwind/audio.tailwind.js
-const root = cn(root$1, "[--media-text-color:var(--media-color-primary,oklch(0_0_0))]", "[--media-error-dialog-transition-duration:250ms]", "[--media-error-dialog-transition-delay:100ms]", "[--media-popup-transition-duration:100ms]", "[--media-popup-transition-timing-function:ease-out]", "motion-reduce:[--media-error-dialog-transition-duration:50ms]", "motion-reduce:[--media-error-dialog-transition-delay:0ms]", "motion-reduce:[--media-popup-transition-duration:0ms]", "dark:[--media-text-color:var(--media-color-primary,oklch(1_0_0))]");
-const surface = cn(surface$1, "bg-white/50 dark:bg-black/40", "backdrop-blur-lg backdrop-saturate-150", "ring-black/5 shadow-sm shadow-black/15", "after:ring-white/10", "[@media(prefers-reduced-transparency:reduce)]:bg-white/70 dark:[@media(prefers-reduced-transparency:reduce)]:bg-black/70", "contrast-more:bg-white/90 dark:contrast-more:bg-black/90");
+const root = cn(root$1, "[--media-text-color:var(--media-color-primary,oklch(0_0_0))]", "[--media-surface-background-color:oklch(1_0_0/0.5)]", "[--media-surface-inner-border-color:oklch(1_0_0/0.1)]", "[--media-surface-outer-border-color:oklch(0_0_0/0.05)]", "[--media-surface-shadow-color:oklch(0_0_0/0.15)]", "[--media-surface-backdrop-filter:blur(16px)_saturate(1.5)]", "[--media-error-dialog-transition-duration:250ms]", "[--media-error-dialog-transition-delay:100ms]", "[--media-popup-transition-duration:100ms]", "[--media-popup-transition-timing-function:ease-out]", "[--media-tooltip-side-offset:0.75rem]", "[--media-popover-side-offset:0.75rem]", "motion-reduce:[--media-error-dialog-transition-duration:50ms]", "motion-reduce:[--media-error-dialog-transition-delay:0ms]", "motion-reduce:[--media-popup-transition-duration:0ms]", "dark:[--media-surface-background-color:oklch(0_0_0/0.4)]", "dark:[--media-text-color:var(--media-color-primary,oklch(1_0_0))]", "[@media(prefers-reduced-transparency:reduce)]:[--media-surface-background-color:oklch(1_0_0)]", "contrast-more:[--media-surface-background-color:oklch(1_0_0)]", "[@media(prefers-reduced-transparency:reduce)]:[--media-surface-outer-border-color:oklch(0_0_0/0.05)]", "contrast-more:[--media-surface-outer-border-color:oklch(0_0_0/0.05)]", "dark:[@media(prefers-reduced-transparency:reduce)]:[--media-surface-background-color:oklch(0_0_0)]", "dark:contrast-more:[--media-surface-background-color:oklch(0_0_0)]", "dark:[@media(prefers-reduced-transparency:reduce)]:[--media-surface-inner-border-color:oklch(1_0_0/0.2)]", "dark:contrast-more:[--media-surface-inner-border-color:oklch(1_0_0/0.2)]", "dark:[@media(prefers-reduced-transparency:reduce)]:[--media-surface-outer-border-color:transparent]", "dark:contrast-more:[--media-surface-outer-border-color:transparent]");
 const controls = cn(controls$1, surface, "text-(--media-text-color)", "peer-data-open/error:[&_*]:invisible");
 const slider = {
 	...slider$1,
@@ -27,16 +26,13 @@ const popup = {
 	popover: cn(surface, popup$1.popover),
 	tooltip: cn(surface, popup$1.tooltip)
 };
-const bufferingIndicator = {
-	...bufferingIndicator$1,
-	container: cn(bufferingIndicator$1.container, surface)
-};
+({ ...bufferingIndicator$1 }), cn(bufferingIndicator$1.container, surface);
 const error = {
 	...error$1,
-	dialog: cn("absolute inset-0 z-20 flex items-center gap-3 rounded-full px-5 pr-0.5", "bg-(--media-surface-background-color) text-(--media-text-color)", "backdrop-blur-lg backdrop-saturate-150", "transition-[opacity,filter] ease-out", "duration-(--media-error-dialog-transition-duration)", "delay-(--media-error-dialog-transition-delay)", "group-data-starting-style/error:opacity-0 group-data-starting-style/error:blur-[4px]", "group-data-ending-style/error:opacity-0 group-data-ending-style/error:blur-[4px]", "group-data-ending-style/error:delay-0"),
+	dialog: cn("absolute inset-0 z-20 flex items-center gap-3 rounded-full px-5 pr-0.5", "bg-(--media-surface-background-color) text-(--media-text-color)", "backdrop-blur-lg backdrop-saturate-150", "transition-[opacity,filter] ease-out", "duration-(--media-error-dialog-transition-duration)", "delay-(--media-error-dialog-transition-delay)", "group-data-starting-style/error:opacity-0 group-data-starting-style/error:blur-xs", "group-data-ending-style/error:opacity-0 group-data-ending-style/error:blur-xs", "group-data-ending-style/error:delay-0"),
 	content: "flex flex-1 items-center gap-2"
 };
 //#endregion
-export { controls, popup, root, slider };
+export { controls, error, popup, root, slider };
 //# sourceMappingURL=audio.tailwind.js.map

package/dist/default/skins/dist/default/default/tailwind/audio.tailwind.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"audio.tailwind.js","names":[],"sources":["../../../../../../../../skins/dist/default/default/tailwind/audio.tailwind.js"],"sourcesContent":["import { iconState } from \"../../shared/tailwind/icon-state.js\";\nimport { tooltipState } from \"../../shared/tailwind/tooltip-state.js\";\nimport { bufferingIndicator as bufferingIndicator$1 } from \"./components/buffering.js\";\nimport { controls as controls$1 } from \"./components/controls.js\";\nimport { error as error$1 } from \"./components/error.js\";\nimport { popup as popup$1 } from \"./components/popup.js\";\nimport { root as root$1 } from \"./components/root.js\";\nimport { slider as slider$1 } from \"./components/slider.js\";\nimport { surface as surface$1 } from \"./components/~~surface~~.js\";\nimport { ~~button~~ } from \"./components/button.js\";\nimport { icon, iconContainer, iconFlipped, iconHidden } from \"./components/icon.js\";\nimport { playbackRate } from \"./components/playback-rate.js\";\nimport { seek } from \"./components/seek.js\";\nimport { time } from \"./components/time.js\";\nimport { cn } from \"@videojs/utils/style\";\n\n//#region src/default/tailwind/audio.tailwind.ts\nconst root = cn(root$1, \"[--media-text-color:var(--media-color-primary,oklch(0_0_0))]\", \"[--media-error-dialog-transition-duration:250ms]\", \"[--media-error-dialog-transition-delay:100ms]\", \"[--media-popup-transition-duration:100ms]\", \"[--media-popup-transition-timing-function:ease-out]\", \"motion-reduce:[--media-error-dialog-transition-duration:50ms]\", \"motion-reduce:[--media-error-dialog-transition-delay:0ms]\", \"motion-reduce:[--media-popup-transition-duration:0ms]\", \"dark:[--media-text-color:var(--media-color-primary,oklch(1_0_0))]\"~~);\nconst surface = cn(surface$1~~, \"bg-~~white/50 dark~~:bg-~~black/40~~\", \"~~backdrop~~-~~blur~~-~~lg backdrop~~-~~saturate~~-~~150~~\", \"~~ring~~-~~black/5 shadow~~-~~sm shadow~~-~~black~~/15\", \"~~after~~:~~ring~~-~~white~~/10\", \"[@media(prefers-reduced-transparency:reduce)]:bg-~~white/70~~ dark:[@media(prefers-reduced-transparency:reduce)]:bg-~~black~~/70\", \"contrast-more:bg-~~white~~/90 dark:contrast-more:bg-~~black/90~~\");\nconst controls = cn(controls$1, surface, \"text-(--media-text-color)\", \"peer-data-open/error:[&_*]:invisible\");\nconst slider = {\n\t...slider$1,\n\ttrack: cn(slider$1.track, \"bg-black/10\", \"dark:bg-white/20 dark:ring-1 dark:ring-black/5\")\n};\nconst popup = {\n\t...popup$1,\n\tpopover: cn(surface, popup$1.popover),\n\ttooltip: cn(surface, popup$1.tooltip)\n};\nconst bufferingIndicator = {\n\t...bufferingIndicator$1,\n\tcontainer: cn(bufferingIndicator$1.container, surface)\n};\nconst error = {\n\t...error$1,\n\tdialog: cn(\"absolute inset-0 z-20 flex items-center gap-3 rounded-full px-5 pr-0.5\", \"bg-(--media-surface-background-color) text-(--media-text-color)\", \"backdrop-blur-lg backdrop-saturate-150\", \"transition-[opacity,filter] ease-out\", \"duration-(--media-error-dialog-transition-duration)\", \"delay-(--media-error-dialog-transition-delay)\", \"group-data-starting-style/error:opacity-0 group-data-starting-style/error:blur-~~[4px]~~\", \"group-data-ending-style/error:opacity-0 group-data-ending-style/error:blur-~~[4px]~~\", \"group-data-ending-style/error:delay-0\"),\n\tcontent: \"flex flex-1 items-center gap-2\"\n};\n\n//#endregion\nexport { bufferingIndicator, button, controls, error, icon, iconContainer, iconFlipped, iconHidden, iconState, playbackRate, popup, root, seek, slider, ~~surface,~~ time, tooltipState };\n//# sourceMappingURL=audio.tailwind.js.map"],"mappings":";;;;;;;;;;;;;;;;;AAiBA,MAAM,OAAO,GAAG,QAAQ,gEAAgE,oDAAoD,iDAAiD,6CAA6C,uDAAuD,iEAAiE,6DAA6D,yDAAyD,~~oEAAoE;AAC5hB~~,~~MAAM~~,~~UAAU~~,~~GAAG~~,~~WAAW~~,~~gCAAgC~~,~~0CAA0C~~,~~0CAA0C~~,~~uBAAuB~~,~~4HAA4H~~,~~2DAA2D~~;~~AAChW~~,MAAM,WAAW,GAAG,YAAY,SAAS,6BAA6B,uCAAuC;AAC7G,MAAM,SAAS;CACd,GAAG;CACH,OAAO,GAAG,SAAS,OAAO,eAAe,iDAAiD;CAC1F;AACD,MAAM,QAAQ;CACb,GAAG;CACH,SAAS,GAAG,SAAS,QAAQ,QAAQ;CACrC,SAAS,GAAG,SAAS,QAAQ,QAAQ;CACrC;~~AACD~~,~~MAAM~~,~~qBAAqB;CAC1B,~~GAAG~~;CACH~~,~~WAAW~~,GAAG,qBAAqB,WAAW,QAAQ;~~CACtD;AACD~~,MAAM,QAAQ;CACb,GAAG;CACH,QAAQ,GAAG,0EAA0E,mEAAmE,0CAA0C,wCAAwC,uDAAuD,iDAAiD,~~wFAAwF~~,~~oFAAoF~~,wCAAwC;~~CACtiB~~,SAAS;CACT"}
1	+ {"version":3,"file":"audio.tailwind.js","names":[],"sources":["../../../../../../../../skins/dist/default/default/tailwind/audio.tailwind.js"],"sourcesContent":["import { iconState } from \"../../shared/tailwind/icon-state.js\";\nimport { tooltipState } from \"../../shared/tailwind/tooltip-state.js\";\nimport { bufferingIndicator as bufferingIndicator$1 } from \"./components/buffering.js\";\nimport { controls as controls$1 } from \"./components/controls.js\";\nimport { error as error$1 } from \"./components/error.js\";\nimport { popup as popup$1 } from \"./components/popup.js\";\nimport { root as root$1 } from \"./components/root.js\";\nimport { slider as slider$1 } from \"./components/slider.js\";\nimport { surface } from \"./components/surface.js\";\nimport { button } from \"./components/button.js\";\nimport { buttonGroup } from \"./components/button-group.js\";\nimport { icon, iconContainer, iconFlipped, iconHidden } from \"./components/icon.js\";\nimport { playbackRate } from \"./components/playback-rate.js\";\nimport { seek } from \"./components/seek.js\";\nimport { time } from \"./components/time.js\";\nimport { cn } from \"@videojs/utils/style\";\n//#region src/default/tailwind/audio.tailwind.ts\nconst root = cn(root$1, \"[--media-text-color:var(--media-color-primary,oklch(0_0_0))]\", \"[--media-surface-background-color:oklch(1_0_0/0.5)]\", \"[--media-surface-inner-border-color:oklch(1_0_0/0.1)]\", \"[--media-surface-outer-border-color:oklch(0_0_0/0.05)]\", \"[--media-surface-shadow-color:oklch(0_0_0/0.15)]\", \"[--media-surface-backdrop-filter:blur(16px)_saturate(1.5)]\", \"[--media-error-dialog-transition-duration:250ms]\", \"[--media-error-dialog-transition-delay:100ms]\", \"[--media-popup-transition-duration:100ms]\", \"[--media-popup-transition-timing-function:ease-out]\", \"[--media-tooltip-side-offset:0.75rem]\", \"[--media-popover-side-offset:0.75rem]\", \"motion-reduce:[--media-error-dialog-transition-duration:50ms]\", \"motion-reduce:[--media-error-dialog-transition-delay:0ms]\", \"motion-reduce:[--media-popup-transition-duration:0ms]\", \"dark:[--media-surface-background-color:oklch(0_0_0/0.4)]\", \"dark:[--media-text-color:var(--media-color-primary,oklch(1_0_0))]\", \"[@media(prefers-reduced-transparency:reduce)]:[--media-surface-background-color:oklch(1_0_0)]\", \"contrast-more:[--media-surface-background-color:oklch(1_0_0)]\", \"[@media(prefers-reduced-transparency:reduce)]:[--media-surface-outer-border-color:oklch(0_0_0/0.05)]\", \"contrast-more:[--media-surface-outer-border-color:oklch(0_0_0/0.05)]\", \"dark:[@media(prefers-reduced-transparency:reduce)]:[--media-surface-background-color:oklch(0_0_0)]\", \"dark:contrast-more:[--media-surface-background-color:oklch(0_0_0)]\", \"dark:[@media(prefers-reduced-transparency:reduce)]:[--media-surface-inner-border-color:oklch(1_0_0/0.2)]\", \"dark:contrast-more:[--media-surface-inner-border-color:oklch(1_0_0/0.2)]\", \"dark:[@media(prefers-reduced-transparency:reduce)]:[--media-surface-outer-border-color:transparent]\", \"dark:contrast-more:[--media-surface-outer-border-color:transparent]\");\nconst controls = cn(controls$1, surface, \"text-(--media-text-color)\", \"peer-data-open/error:[&_*]:invisible\");\nconst slider = {\n\t...slider$1,\n\ttrack: cn(slider$1.track, \"bg-black/10\", \"dark:bg-white/20 dark:ring-1 dark:ring-black/5\")\n};\nconst popup = {\n\t...popup$1,\n\tpopover: cn(surface, popup$1.popover),\n\ttooltip: cn(surface, popup$1.tooltip)\n};\nconst bufferingIndicator = {\n\t...bufferingIndicator$1,\n\tcontainer: cn(bufferingIndicator$1.container, surface)\n};\nconst error = {\n\t...error$1,\n\tdialog: cn(\"absolute inset-0 z-20 flex items-center gap-3 rounded-full px-5 pr-0.5\", \"bg-(--media-surface-background-color) text-(--media-text-color)\", \"backdrop-blur-lg backdrop-saturate-150\", \"transition-[opacity,filter] ease-out\", \"duration-(--media-error-dialog-transition-duration)\", \"delay-(--media-error-dialog-transition-delay)\", \"group-data-starting-style/error:opacity-0 group-data-starting-style/error:blur-xs\", \"group-data-ending-style/error:opacity-0 group-data-ending-style/error:blur-xs\", \"group-data-ending-style/error:delay-0\"),\n\tcontent: \"flex flex-1 items-center gap-2\"\n};\n//#endregion\nexport { bufferingIndicator, button, buttonGroup, controls, error, icon, iconContainer, iconFlipped, iconHidden, iconState, playbackRate, popup, root, seek, slider, time, tooltipState };\n\n//# sourceMappingURL=audio.tailwind.js.map"],"mappings":";;;;;;;;;;;;;;;;;AAiBA,MAAM,OAAO,GAAG,QAAQ,gEAAgE,uDAAuD,yDAAyD,0DAA0D,oDAAoD,8DAA8D,oDAAoD,iDAAiD,6CAA6C,uDAAuD,yCAAyC,yCAAyC,iEAAiE,6DAA6D,yDAAyD,4DAA4D,qEAAqE,iGAAiG,iEAAiE,wGAAwG,wEAAwE,sGAAsG,sEAAsE,4GAA4G,4EAA4E,uGAAuG,sEAAsE;AAC1yD,MAAM,WAAW,GAAG,YAAY,SAAS,6BAA6B,uCAAuC;AAC7G,MAAM,SAAS;CACd,GAAG;CACH,OAAO,GAAG,SAAS,OAAO,eAAe,iDAAiD;CAC1F;AACD,MAAM,QAAQ;CACb,GAAG;CACH,SAAS,GAAG,SAAS,QAAQ,QAAQ;CACrC,SAAS,GAAG,SAAS,QAAQ,QAAQ;CACrC;CAGA,EADA,GAAG,sBACmD,GAA3C,GAAG,qBAAqB,WAAW,QAAQ;AAEvD,MAAM,QAAQ;CACb,GAAG;CACH,QAAQ,GAAG,0EAA0E,mEAAmE,0CAA0C,wCAAwC,uDAAuD,iDAAiD,qFAAqF,iFAAiF,wCAAwC;CAChiB,SAAS;CACT"}

package/dist/default/skins/dist/default/default/tailwind/components/buffering.js CHANGED Viewed

@@ -3,7 +3,7 @@ const bufferingIndicator = {
 	root: "absolute inset-0 hidden items-center justify-center pointer-events-none text-white data-visible:flex",
 	container: "p-1 rounded-full"
 };
 //#endregion
 export { bufferingIndicator };
 //# sourceMappingURL=buffering.js.map

package/dist/default/skins/dist/default/default/tailwind/components/buffering.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"buffering.js","names":[],"sources":["../../../../../../../../../skins/dist/default/default/tailwind/components/buffering.js"],"sourcesContent":["//#region src/default/tailwind/components/buffering.ts\nconst bufferingIndicator = {\n\troot: \"absolute inset-0 hidden items-center justify-center pointer-events-none text-white data-visible:flex\",\n\tcontainer: \"p-1 rounded-full\"\n};\n\n//#endregion\nexport { bufferingIndicator };\n//# sourceMappingURL=buffering.js.map"],"mappings":";AACA,MAAM,qBAAqB;CAC1B,MAAM;CACN,WAAW;CACX"}
1	+ {"version":3,"file":"buffering.js","names":[],"sources":["../../../../../../../../../skins/dist/default/default/tailwind/components/buffering.js"],"sourcesContent":["//#region src/default/tailwind/components/buffering.ts\nconst bufferingIndicator = {\n\troot: \"absolute inset-0 hidden items-center justify-center pointer-events-none text-white data-visible:flex\",\n\tcontainer: \"p-1 rounded-full\"\n};\n//#endregion\nexport { bufferingIndicator };\n\n//# sourceMappingURL=buffering.js.map"],"mappings":";AACA,MAAM,qBAAqB;CAC1B,MAAM;CACN,WAAW;CACX"}