@videojs/html 10.0.0-beta.28 → 10.0.0-beta.29

package/dist/default/skins/dist/default/minimal/tailwind/components/slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/slider.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n//#region src/minimal/tailwind/components/slider.ts\nconst previewContent = cn(\"absolute [left:var(--preview-left,var(--media-slider-pointer))] max-w-(--max-width)\", \"-translate-x-1/2 translate-y-2 scale-80 opacity-0 blur-lg origin-bottom\", \"transition-[filter,opacity,scale] duration-150 ease-out\", \"group-data-pointing/slider:scale-100 group-data-pointing/slider:opacity-100\", \"group-data-pointing/slider:blur-none\", \"group-has-focus-visible/slider:scale-100 group-has-focus-visible/slider:opacity-100\", \"group-has-focus-visible/slider:blur-none\");\nconst slider = {\n\troot: cn(\"group/slider relative flex flex-1 items-center justify-center rounded-(--track-border-radius) outline-none cursor-pointer\", \"[--track-border-radius:calc(infinity*1px)]\", \"data-[orientation=horizontal]:min-w-20 data-[orientation=horizontal]:w-(--slider-width,100%) data-[orientation=horizontal]:h-(--slider-height,--spacing(8))\", \"data-[orientation=vertical]:w-(--slider-width,--spacing(8)) data-[orientation=vertical]:h-(--slider-height,--spacing(20))\"),\n\ttrack: cn(\"relative isolate overflow-hidden bg-current/20 rounded-(--track-border-radius) select-none\", \"data-[orientation=horizontal]:w-full data-[orientation=horizontal]:h-0.75\", \"data-[orientation=vertical]:w-0.75 data-[orientation=vertical]:h-full\"),\n\tchapters: cn(\"relative flex flex-1 items-center min-w-0 min-h-0 size-full rounded-[inherit]\"),\n\tchapter: {\n\t\tbase: cn(\"group/chapter absolute inset-0 flex items-center justify-center min-w-0 min-h-0\", \"[--chapter-gap:calc(var(--spacing)*1)] [--chapter-inset-start:calc(var(--chapter-gap)/2)] [--chapter-inset-end:calc(var(--chapter-gap)/2)]\", \"first:[--chapter-inset-start:0px] last:[--chapter-inset-end:0px]\", \"data-[orientation=horizontal]:[clip-path:inset(0_calc(100%-var(--media-slider-chapter-end))_0_var(--media-slider-chapter-start))]\", \"data-[orientation=vertical]:[clip-path:inset(calc(100%-var(--media-slider-chapter-end))_0_var(--media-slider-chapter-start)_0)]\"),\n\t\ttrack: cn(\"relative isolate overflow-hidden bg-current/20 rounded-(--track-border-radius) select-none\", \"motion-safe:transition-[height,width] motion-safe:duration-200 motion-safe:ease-out\", \"data-[orientation=horizontal]:w-full data-[orientation=horizontal]:h-0.75\", \"group-data-highlighted/chapter:data-[orientation=horizontal]:h-[--spacing(1.25)]\", \"data-[orientation=horizontal]:[clip-path:inset(0_calc(100%-var(--media-slider-chapter-end)+var(--chapter-inset-end))_0_calc(var(--media-slider-chapter-start)+var(--chapter-inset-start))_round_var(--track-border-radius))]\", \"data-[orientation=vertical]:w-0.75 data-[orientation=vertical]:h-full\", \"group-data-highlighted/chapter:data-[orientation=vertical]:w-[--spacing(1.25)]\", \"data-[orientation=vertical]:[clip-path:inset(calc(100%-var(--media-slider-chapter-end)+var(--chapter-inset-end))_0_calc(var(--media-slider-chapter-start)+var(--chapter-inset-start))_0_round_var(--track-border-radius))]\")\n\t},\n\tfill: {\n\t\tbase: cn(\"absolute rounded-[inherit] pointer-events-none\", \"motion-safe:duration-200 motion-safe:ease-linear\", \"data-dragging:duration-0 data-seeking:duration-0\"),\n\t\tfill: cn(\"bg-(--accent-color)\", \"data-[orientation=horizontal]:inset-y-0 data-[orientation=horizontal]:left-0 data-[orientation=horizontal]:w-full\", \"data-[orientation=horizontal]:transition-[clip-path] data-[orientation=horizontal]:[clip-path:inset(0_calc(100%-var(--media-slider-fill))_0_0_round_var(--track-border-radius))]\", \"group-data-dragging/slider:data-[orientation=horizontal]:[clip-path:inset(0_calc(100%-var(--media-slider-pointer))_0_0_round_var(--track-border-radius))]\", \"data-[orientation=vertical]:inset-x-0 data-[orientation=vertical]:bottom-0 data-[orientation=vertical]:h-full\", \"data-[orientation=vertical]:transition-[clip-path] data-[orientation=vertical]:[clip-path:inset(calc(100%-var(--media-slider-fill))_0_0_0_round_var(--track-border-radius))]\", \"group-data-dragging/slider:data-[orientation=vertical]:[clip-path:inset(calc(100%-var(--media-slider-pointer))_0_0_0_round_var(--track-border-radius))]\"),\n\t\tbuffer: cn(\"bg-current/20 motion-safe:duration-250 motion-safe:ease-out\", \"data-[orientation=horizontal]:inset-y-0 data-[orientation=horizontal]:left-0 data-[orientation=horizontal]:w-full\", \"data-[orientation=horizontal]:transition-[clip-path] data-[orientation=horizontal]:[clip-path:inset(0_calc(100%-var(--media-slider-buffer))_0_0_round_var(--track-border-radius))]\", \"data-[orientation=vertical]:inset-x-0 data-[orientation=vertical]:bottom-0 data-[orientation=vertical]:h-full\", \"data-[orientation=vertical]:transition-[clip-path] data-[orientation=vertical]:[clip-path:inset(calc(100%-var(--media-slider-buffer))_0_0_0_round_var(--track-border-radius))]\")\n\t},\n\tthumb: {\n\t\tbase: cn(\"z-10 absolute size-3 -translate-x-1/2 -translate-y-1/2\", \"bg-current rounded-full\", \"shadow-[0_0_0_1px_var(--shadow-current-color,oklch(0_0_0/0.15)),0_1px_3px_0_oklch(0_0_0/0.15),0_1px_2px_-1px_oklch(0_0_0/0.15)]\", \"transition-[opacity,scale,outline-offset] motion-safe:transition-[opacity,scale,outline-offset,left,top] duration-150 ease-out select-none\", \"data-dragging:duration-0 data-seeking:duration-0\", \"outline-2 outline-transparent -outline-offset-2\", \"focus-visible:outline-(--focus-ring-color) focus-visible:outline-offset-2\", \"data-[orientation=horizontal]:top-1/2 data-[orientation=horizontal]:left-(--media-slider-fill,0)\", \"group-data-dragging/slider:data-[orientation=horizontal]:left-(--media-slider-pointer)\", \"data-[orientation=vertical]:left-1/2 data-[orientation=vertical]:top-[calc(100%-var(--media-slider-fill,0))]\", \"group-data-dragging/slider:data-[orientation=vertical]:top-[calc(100%-var(--media-slider-pointer))]\"),\n\t\tinteractive: cn(\"opacity-0 scale-70 origin-center\", \"pointer-fine:group-hover/slider:opacity-100 pointer-fine:group-hover/slider:scale-100\", \"group-focus-within/slider:opacity-100 group-focus-within/slider:scale-100\")\n\t},\n\tpreview: cn(\"[--max-width:min(--spacing(48),100cqi)] [--max-height:--spacing(32)] min-w-full h-1\", \"before:absolute before:z-1 before:bg-current/35 before:pointer-events-none\", \"before:-translate-1/2 before:opacity-0 before:scale-50\", \"before:transition-[opacity,scale] before:duration-200 before:ease-out\", \"data-pointing:not-data-dragging:before:opacity-100 data-pointing:not-data-dragging:before:scale-100\", \"data-[orientation=horizontal]:before:top-1/2 data-[orientation=horizontal]:before:left-(--media-slider-pointer)\", \"data-[orientation=horizontal]:before:w-px data-[orientation=horizontal]:before:h-5\", \"data-[orientation=vertical]:before:top-[calc(100%-var(--media-slider-pointer))] data-[orientation=vertical]:before:left-1/2\", \"data-[orientation=vertical]:before:w-5 data-[orientation=vertical]:before:h-px\"),\n\tthumbnail: cn(previewContent, \"[--thumbnail-max-width:var(--max-width)] [bottom:calc(100%+--spacing(12))]\"),\n\tvalue: cn(previewContent, \"[bottom:calc(100%+--spacing(5))] flex flex-row-reverse justify-center gap-2 px-3 tabular-nums\", \"text-shadow-2xs text-shadow-(color:--shadow-current-color)\"),\n\tchapterTitle: \"min-w-0 overflow-hidden text-ellipsis whitespace-nowrap empty:hidden\"\n};\n//#endregion\nexport { slider };\n\n//# sourceMappingURL=slider.js.map"],"mappings":";;AAEA,MAAM,iBAAiB,GAAG,uFAAuF,2EAA2E,2DAA2D,+EAA+E,wCAAwC,uFAAuF,0CAA0C;AAC/e,MAAM,SAAS;CACd,MAAM,GAAG,6HAA6H,8CAA8C,+JAA+J,2HAA2H;CAC9c,OAAO,GAAG,8FAA8F,6EAA6E,uEAAuE;CAC5P,UAAU,GAAG,+EAA+E;CAC5F,SAAS;EACR,MAAM,GAAG,mFAAmF,8IAA8I,oEAAoE,qIAAqI,iIAAiI;EACpjB,OAAO,GAAG,8FAA8F,uFAAuF,6EAA6E,oFAAoF,gOAAgO,yEAAyE,kFAAkF,4NAA4N;CACx7B;CACA,MAAM;EACL,MAAM,GAAG,kDAAkD,oDAAoD,kDAAkD;EACjK,MAAM,GAAG,uBAAuB,qHAAqH,oLAAoL,6JAA6J,iHAAiH,gLAAgL,yJAAyJ;EACh6B,QAAQ,GAAG,+DAA+D,qHAAqH,sLAAsL,iHAAiH,gLAAgL;CACvpB;CACA,OAAO;EACN,MAAM,GAAG,0DAA0D,2BAA2B,mIAAmI,8IAA8I,oDAAoD,mDAAmD,6EAA6E,oGAAoG,0FAA0F,gHAAgH,qGAAqG;EACt7B,aAAa,GAAG,oCAAoC,yFAAyF,2EAA2E;CACzN;CACA,SAAS,GAAG,uFAAuF,8EAA8E,0DAA0D,yEAAyE,uGAAuG,mHAAmH,sFAAsF,+HAA+H,gFAAgF;CACnzB,WAAW,GAAG,gBAAgB,4EAA4E;CAC1G,OAAO,GAAG,gBAAgB,iGAAiG,4DAA4D;CACvL,cAAc;AACf"}
+{"version":3,"file":"slider.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/slider.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n//#region src/minimal/tailwind/components/slider.ts\nconst previewContent = cn(\"absolute [left:var(--preview-left,var(--media-slider-pointer))] max-w-(--max-size)\", \"-translate-x-1/2 translate-y-2 scale-80 opacity-0 blur-lg origin-bottom\", \"transition-[filter,opacity,scale] duration-150 ease-out\", \"group-data-pointing/slider:scale-100 group-data-pointing/slider:opacity-100\", \"group-data-pointing/slider:blur-none\", \"group-has-focus-visible/slider:scale-100 group-has-focus-visible/slider:opacity-100\", \"group-has-focus-visible/slider:blur-none\");\nconst slider = {\n\troot: cn(\"group/slider relative flex flex-1 items-center justify-center rounded-(--track-border-radius) outline-none cursor-pointer\", \"[--track-border-radius:99px]\", \"[--chapter-gap:calc(var(--spacing)*1)] [--chapter-inset-start:calc(var(--chapter-gap)/2)] [--chapter-inset-end:calc(var(--chapter-gap)/2)]\", \"data-[orientation=horizontal]:min-w-20 data-[orientation=horizontal]:w-(--slider-width,100%) data-[orientation=horizontal]:h-(--slider-height,--spacing(8))\", \"data-[orientation=vertical]:w-(--slider-width,--spacing(8)) data-[orientation=vertical]:h-(--slider-height,--spacing(20))\"),\n\ttrack: cn(\"relative isolate overflow-hidden bg-current/20 rounded-(--track-border-radius) select-none\", \"data-[orientation=horizontal]:w-full data-[orientation=horizontal]:h-1\", \"data-[orientation=vertical]:w-1 data-[orientation=vertical]:h-full\"),\n\tchapters: cn(\"relative flex flex-1 items-center min-w-0 min-h-0 size-full rounded-[inherit]\"),\n\tchapter: {\n\t\tbase: cn(\"group/chapter absolute inset-0 flex items-center justify-center min-w-0 min-h-0\", \"first:[--chapter-inset-start:0px] last:[--chapter-inset-end:0px]\", \"data-[orientation=horizontal]:[clip-path:inset(0_calc(100%-var(--media-slider-chapter-end))_0_var(--media-slider-chapter-start))]\", \"data-[orientation=vertical]:[clip-path:inset(calc(100%-var(--media-slider-chapter-end))_0_var(--media-slider-chapter-start)_0)]\"),\n\t\ttrack: cn(\"relative isolate overflow-hidden bg-current/20 rounded-(--track-border-radius) select-none\", \"motion-safe:transition-[height,width] motion-safe:duration-200 motion-safe:ease-out\", \"data-[orientation=horizontal]:w-full data-[orientation=horizontal]:h-1\", \"group-data-highlighted/chapter:data-[orientation=horizontal]:h-1.75\", \"data-[orientation=horizontal]:[clip-path:inset(0_calc(100%-var(--media-slider-chapter-end)+var(--chapter-inset-end))_0_calc(var(--media-slider-chapter-start)+var(--chapter-inset-start))_round_var(--track-border-radius))]\", \"data-[orientation=vertical]:w-1 data-[orientation=vertical]:h-full\", \"group-data-highlighted/chapter:data-[orientation=vertical]:w-1.75\", \"data-[orientation=vertical]:[clip-path:inset(calc(100%-var(--media-slider-chapter-end)+var(--chapter-inset-end))_0_calc(var(--media-slider-chapter-start)+var(--chapter-inset-start))_0_round_var(--track-border-radius))]\")\n\t},\n\tfill: {\n\t\tbase: cn(\"absolute rounded-[inherit] pointer-events-none\", \"motion-safe:transition-[clip-path] motion-safe:duration-200 motion-safe:ease-out\", \"data-dragging:duration-0 data-seeking:duration-0\"),\n\t\tfill: cn(\"bg-(--accent-color)\", \"data-[orientation=horizontal]:inset-y-0 data-[orientation=horizontal]:left-0 data-[orientation=horizontal]:w-full\", \"data-[orientation=horizontal]:[clip-path:inset(0_calc(100%-var(--media-slider-fill))_0_0_round_var(--track-border-radius))]\", \"group-data-dragging/slider:data-[orientation=horizontal]:[clip-path:inset(0_calc(100%-var(--media-slider-pointer))_0_0_round_var(--track-border-radius))]\", \"data-[orientation=vertical]:inset-x-0 data-[orientation=vertical]:bottom-0 data-[orientation=vertical]:h-full\", \"data-[orientation=vertical]:[clip-path:inset(calc(100%-var(--media-slider-fill))_0_0_0_round_var(--track-border-radius))]\", \"group-data-dragging/slider:data-[orientation=vertical]:[clip-path:inset(calc(100%-var(--media-slider-pointer))_0_0_0_round_var(--track-border-radius))]\"),\n\t\tbuffer: cn(\"bg-current/20\", \"data-[orientation=horizontal]:inset-y-0 data-[orientation=horizontal]:left-0 data-[orientation=horizontal]:w-full\", \"data-[orientation=horizontal]:[clip-path:inset(0_calc(100%-var(--media-slider-buffer))_0_0_round_var(--track-border-radius))]\", \"data-[orientation=vertical]:inset-x-0 data-[orientation=vertical]:bottom-0 data-[orientation=vertical]:h-full\", \"data-[orientation=vertical]:[clip-path:inset(calc(100%-var(--media-slider-buffer))_0_0_0_round_var(--track-border-radius))]\")\n\t},\n\tthumb: {\n\t\tbase: cn(\"z-10 absolute size-3 -translate-x-1/2 -translate-y-1/2\", \"bg-current rounded-full\", \"opacity-0 scale-70 origin-center\", \"shadow-[0_0_0_1px_var(--shadow-current-color,oklch(0_0_0/0.15)),0_1px_3px_0_oklch(0_0_0/0.15),0_1px_2px_-1px_oklch(0_0_0/0.15)]\", \"transition-none motion-safe:transition-[opacity,height,width,outline-offset,left,top,scale] duration-150 ease-out select-none\", \"data-dragging:duration-0 data-seeking:duration-0\", \"group-active/slider:size-3.5\", \"outline-2 outline-transparent -outline-offset-2\", \"focus-visible:outline-(--focus-ring-color) focus-visible:outline-offset-2\", \"focus-visible:opacity-100 focus-visible:scale-100\", \"data-[orientation=horizontal]:top-1/2 data-[orientation=horizontal]:left-(--media-slider-fill,0)\", \"group-data-dragging/slider:data-[orientation=horizontal]:left-(--media-slider-pointer)\", \"data-[orientation=vertical]:left-1/2 data-[orientation=vertical]:top-[calc(100%-var(--media-slider-fill,0))]\", \"group-data-dragging/slider:data-[orientation=vertical]:top-[calc(100%-var(--media-slider-pointer))]\"),\n\t\tpersistent: \"opacity-100 scale-100\",\n\t\tinteractive: cn(\"pointer-fine:group-hover/slider:opacity-100 pointer-fine:group-hover/slider:scale-100\")\n\t},\n\tpreview: cn(\"[--max-size-factor:28]\", \"[--max-size:min(calc(var(--spacing)*var(--max-size-factor)),100cqi)]\", \"@lg/media-root:[--max-size-factor:36] @2xl/media-root:[--max-size-factor:48]\", \"min-w-full h-1\", \"before:absolute before:z-1 before:bg-current/35 before:pointer-events-none\", \"before:-translate-1/2 before:opacity-0 before:scale-50\", \"before:transition-[opacity,scale] before:duration-200 before:ease-out\", \"data-pointing:not-data-dragging:before:opacity-100 data-pointing:not-data-dragging:before:scale-100\", \"data-[orientation=horizontal]:before:top-1/2 data-[orientation=horizontal]:before:left-(--media-slider-pointer)\", \"data-[orientation=horizontal]:before:w-px data-[orientation=horizontal]:before:h-5\", \"data-[orientation=vertical]:before:top-[calc(100%-var(--media-slider-pointer))] data-[orientation=vertical]:before:left-1/2\", \"data-[orientation=vertical]:before:w-5 data-[orientation=vertical]:before:h-px\"),\n\tthumbnail: cn(previewContent, \"[--thumbnail-max-width:var(--max-size)] [--thumbnail-max-height:var(--max-size)]\", \"[bottom:calc(100%+--spacing(11))]\"),\n\tvalue: cn(previewContent, \"[bottom:calc(100%+--spacing(5))] flex flex-row-reverse justify-center gap-2 px-3 tabular-nums\", \"text-shadow-2xs text-shadow-(color:--shadow-current-color)\"),\n\tchapterTitle: \"min-w-0 overflow-hidden text-ellipsis whitespace-nowrap empty:hidden\"\n};\n//#endregion\nexport { slider };\n\n//# sourceMappingURL=slider.js.map"],"mappings":";;AAEA,MAAM,iBAAiB,GAAG,sFAAsF,2EAA2E,2DAA2D,+EAA+E,wCAAwC,uFAAuF,0CAA0C;AAC9e,MAAM,SAAS;CACd,MAAM,GAAG,6HAA6H,gCAAgC,8IAA8I,+JAA+J,2HAA2H;CAC9kB,OAAO,GAAG,8FAA8F,0EAA0E,oEAAoE;CACtP,UAAU,GAAG,+EAA+E;CAC5F,SAAS;EACR,MAAM,GAAG,mFAAmF,oEAAoE,qIAAqI,iIAAiI;EACta,OAAO,GAAG,8FAA8F,uFAAuF,0EAA0E,uEAAuE,gOAAgO,sEAAsE,qEAAqE,4NAA4N;CACx5B;CACA,MAAM;EACL,MAAM,GAAG,kDAAkD,oFAAoF,kDAAkD;EACjM,MAAM,GAAG,uBAAuB,qHAAqH,+HAA+H,6JAA6J,iHAAiH,6HAA6H,yJAAyJ;EACxzB,QAAQ,GAAG,iBAAiB,qHAAqH,iIAAiI,iHAAiH,6HAA6H;CACjgB;CACA,OAAO;EACN,MAAM,GAAG,0DAA0D,2BAA2B,oCAAoC,mIAAmI,iIAAiI,oDAAoD,gCAAgC,mDAAmD,6EAA6E,qDAAqD,oGAAoG,0FAA0F,gHAAgH,qGAAqG;EACliC,YAAY;EACZ,aAAa,GAAG,uFAAuF;CACxG;CACA,SAAS,GAAG,0BAA0B,wEAAwE,gFAAgF,kBAAkB,8EAA8E,0DAA0D,yEAAyE,uGAAuG,mHAAmH,sFAAsF,+HAA+H,gFAAgF;CACh6B,WAAW,GAAG,gBAAgB,oFAAoF,mCAAmC;CACrJ,OAAO,GAAG,gBAAgB,iGAAiG,4DAA4D;CACvL,cAAc;AACf"}

package/dist/default/skins/dist/default/minimal/tailwind/components/thumbnail.js

@@ -2,7 +2,7 @@ import { cn } from "@videojs/utils/style";
 //#region ../skins/dist/default/minimal/tailwind/components/thumbnail.js
 const thumbnail = {
 	root: cn("group/thumbnail pointer-events-none bg-black/90 rounded-[--spacing(2)]", "after:absolute after:inset-0 after:rounded-[inherit]", "after:ring-1 after:ring-black/5 after:shadow-sm after:shadow-black/20", "has-data-loading:w-(--thumbnail-max-width) has-data-loading:max-w-full", "has-data-loading:aspect-video has-data-loading:overflow-hidden"),
-	image: cn("relative block max-w-(--thumbnail-max-width) max-h-(--max-height) overflow-clip rounded-[inherit]", "transition-opacity duration-150 ease-out data-loading:opacity-0"),
+	image: cn("relative block max-w-(--thumbnail-max-width) max-h-(--thumbnail-max-height) overflow-clip rounded-[inherit]", "transition-opacity duration-150 ease-out data-loading:opacity-0"),
 	spinner: cn("absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 opacity-0", "transition-opacity duration-150 ease-out", "group-not-has-[[role=img][data-loading]]/thumbnail:[--media-spinner-animation:none] motion-reduce:[--media-spinner-animation:none] group-has-[[role=img][data-loading]]/thumbnail:opacity-100")
 };
 //#endregion

package/dist/default/skins/dist/default/minimal/tailwind/components/thumbnail.js.map

@@ -1 +1 @@
-{"version":3,"file":"thumbnail.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/thumbnail.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n//#region src/minimal/tailwind/components/thumbnail.ts\nconst thumbnail = {\n\troot: cn(\"group/thumbnail pointer-events-none bg-black/90 rounded-[--spacing(2)]\", \"after:absolute after:inset-0 after:rounded-[inherit]\", \"after:ring-1 after:ring-black/5 after:shadow-sm after:shadow-black/20\", \"has-data-loading:w-(--thumbnail-max-width) has-data-loading:max-w-full\", \"has-data-loading:aspect-video has-data-loading:overflow-hidden\"),\n\timage: cn(\"relative block max-w-(--thumbnail-max-width) max-h-(--max-height) overflow-clip rounded-[inherit]\", \"transition-opacity duration-150 ease-out data-loading:opacity-0\"),\n\tspinner: cn(\"absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 opacity-0\", \"transition-opacity duration-150 ease-out\", \"group-not-has-[[role=img][data-loading]]/thumbnail:[--media-spinner-animation:none] motion-reduce:[--media-spinner-animation:none] group-has-[[role=img][data-loading]]/thumbnail:opacity-100\")\n};\n//#endregion\nexport { thumbnail };\n\n//# sourceMappingURL=thumbnail.js.map"],"mappings":";;AAEA,MAAM,YAAY;CACjB,MAAM,GAAG,0EAA0E,wDAAwD,yEAAyE,0EAA0E,gEAAgE;CAC9V,OAAO,GAAG,qGAAqG,iEAAiE;CAChL,SAAS,GAAG,yEAAyE,4CAA4C,+LAA+L;AACjU"}
+{"version":3,"file":"thumbnail.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/thumbnail.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n//#region src/minimal/tailwind/components/thumbnail.ts\nconst thumbnail = {\n\troot: cn(\"group/thumbnail pointer-events-none bg-black/90 rounded-[--spacing(2)]\", \"after:absolute after:inset-0 after:rounded-[inherit]\", \"after:ring-1 after:ring-black/5 after:shadow-sm after:shadow-black/20\", \"has-data-loading:w-(--thumbnail-max-width) has-data-loading:max-w-full\", \"has-data-loading:aspect-video has-data-loading:overflow-hidden\"),\n\timage: cn(\"relative block max-w-(--thumbnail-max-width) max-h-(--thumbnail-max-height) overflow-clip rounded-[inherit]\", \"transition-opacity duration-150 ease-out data-loading:opacity-0\"),\n\tspinner: cn(\"absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 opacity-0\", \"transition-opacity duration-150 ease-out\", \"group-not-has-[[role=img][data-loading]]/thumbnail:[--media-spinner-animation:none] motion-reduce:[--media-spinner-animation:none] group-has-[[role=img][data-loading]]/thumbnail:opacity-100\")\n};\n//#endregion\nexport { thumbnail };\n\n//# sourceMappingURL=thumbnail.js.map"],"mappings":";;AAEA,MAAM,YAAY;CACjB,MAAM,GAAG,0EAA0E,wDAAwD,yEAAyE,0EAA0E,gEAAgE;CAC9V,OAAO,GAAG,+GAA+G,iEAAiE;CAC1L,SAAS,GAAG,yEAAyE,4CAA4C,+LAA+L;AACjU"}

package/dist/default/skins/dist/default/minimal/tailwind/video.tailwind.js

@@ -47,13 +47,14 @@ const container = (isShadowDOM) => cn(container$1, "group/skin", "bg-black overf
 	"[&:fullscreen_video]:object-contain": !isShadowDOM,
 	"[&:fullscreen_::slotted(video)]:object-contain": isShadowDOM
 });
-const controls = cn(controls$1, "absolute bottom-1 inset-x-1", "[--base-side-offset:5] [--base-boundary-offset:1]", "gap-x-2 flex-wrap rounded-[--spacing(3)] group/controls", "text-white z-20", "peer-data-open/error:hidden", "ease-(--controls-transition-timing-function)", "duration-[calc(var(--controls-transition-duration)/2)]", "not-data-visible:duration-(--controls-transition-duration)", "pointer-fine:will-change-[translate,filter,opacity]", "pointer-fine:transition-[translate,filter,opacity]", "pointer-coarse:will-change-[translate,opacity]", "pointer-coarse:transition-[translate,opacity]", "not-data-visible:opacity-0 not-data-visible:pointer-events-none", "motion-safe:not-data-visible:translate-y-full", "pointer-fine:motion-safe:not-data-visible:blur-sm", "@2xl/media-root:flex-nowrap @2xl/media-root:[--controls-padding:2] @2xl/media-root:[--base-side-offset:2]");
+const controls = cn(controls$1, "absolute bottom-1 inset-x-1", "[--base-side-offset:5] [--base-boundary-offset:1]", "[--volume-mask:linear-gradient(to_right,transparent_10%,black_25%,black_100%)]", "gap-x-2 flex-wrap rounded-[--spacing(3)] group/controls", "text-white z-20", "peer-data-open/error:hidden", "ease-(--controls-transition-timing-function)", "duration-[calc(var(--controls-transition-duration)/2)]", "not-data-visible:duration-(--controls-transition-duration)", "pointer-fine:will-change-[translate,filter,opacity]", "pointer-fine:transition-[translate,filter,opacity]", "pointer-coarse:will-change-[translate,opacity]", "pointer-coarse:transition-[translate,opacity]", "not-data-visible:opacity-0 not-data-visible:pointer-events-none", "motion-safe:not-data-visible:translate-y-full", "pointer-fine:motion-safe:not-data-visible:blur-sm", "@2xl/media-root:flex-nowrap @2xl/media-root:[--controls-padding:2] @2xl/media-root:[--base-side-offset:2]");
+const volumeMaskTarget = cn("[mask-image:var(--volume-mask-image,none)]", "[mask-repeat:no-repeat]", "[mask-position:var(--volume-mask-position,100%_0)]", "[mask-size:var(--volume-mask-size,200%_100%)]", "[transition:mask-position_50ms_ease-out]");
 const buttonGroupStart = cn(buttonGroup, "flex-1 @2xl/media-root:flex-none");
-const buttonGroupEnd = cn(buttonGroup, "flex-1 justify-end @2xl/media-root:flex-none");
+const buttonGroupEnd = cn(buttonGroup, volumeMaskTarget, "flex-1 justify-end @2xl/media-root:flex-none", "group-has-[[data-volume-level][aria-expanded=true]]/controls:@max-2xl/media-root:[--volume-mask-image:var(--volume-mask)]", "group-has-[[data-volume-level][aria-expanded=true]]/controls:@max-2xl/media-root:[--volume-mask-position:0_0]", "group-has-[[data-volume-level][aria-expanded=true]]/controls:@max-2xl/media-root:[--volume-mask-size:400%_100%]");
 const spacer = "grow";
 const time = {
 	...time$1,
-	controls: cn(time$1.controls, "[--slider-height:--spacing(5)] grow-0 shrink-0 basis-full order-[-1] px-1.5", "@2xl/media-root:[--slider-height:--spacing(8)] @2xl/media-root:grow @2xl/media-root:shrink @2xl/media-root:basis-0 @2xl/media-root:order-[unset]", "@2xl/media-root:[mask-position:100%_0] @2xl/media-root:[mask-size:200%_100%]", "@2xl/media-root:[transition:mask-position_50ms_ease-out]", "group-has-[[data-volume-level][aria-expanded=true]]/controls:@2xl/media-root:[mask-image:linear-gradient(to_right,transparent_10%,black_25%,black_100%)]", "group-has-[[data-volume-level][aria-expanded=true]]/controls:@2xl/media-root:[mask-position:0_0]")
+	controls: cn(time$1.controls, volumeMaskTarget, "[--slider-height:--spacing(5)] grow-0 shrink-0 basis-full order-[-1] px-1.5", "@2xl/media-root:[--slider-height:--spacing(8)] @2xl/media-root:grow @2xl/media-root:shrink @2xl/media-root:basis-0 @2xl/media-root:order-[unset]", "group-has-[[data-volume-level][aria-expanded=true]]/controls:@2xl/media-root:[--volume-mask-image:var(--volume-mask)]", "group-has-[[data-volume-level][aria-expanded=true]]/controls:@2xl/media-root:[--volume-mask-position:0_0]")
 };
 const error = {
 	...error$1,
@@ -66,11 +67,11 @@ const thumbnail = thumbnail$1;
 const slider = {
 	...slider$1,
 	track: cn(slider$1.track, "ring-1 ring-black/5"),
-	preview: cn(slider$1.preview, "[--preview-end-inset:calc(100cqi-100%)]", "[--preview-left:clamp(calc(var(--max-width)/2),var(--media-slider-pointer),calc(100%-var(--max-width)/2+var(--preview-end-inset)))]", "@2xl/media-root:[--preview-left:var(--media-slider-pointer)]")
+	preview: cn(slider$1.preview, "[--preview-end-inset:calc(100cqi-100%)]", "[--preview-left:clamp(calc(var(--max-size)/2),var(--media-slider-pointer),calc(100%-var(--max-size)/2+var(--preview-end-inset)))]", "@2xl/media-root:[--preview-left:var(--media-slider-pointer)]")
 };
 const popup = {
 	...popup$1,
-	volume: cn(popup$1.popover, "p-0 bg-transparent")
+	volume: cn(popup$1.popover, "p-0 bg-transparent", "@max-2xl/media-root:[--media-popover-side-offset:--spacing(3)]")
 };
 const menu = {
 	...menu$1,

package/dist/default/skins/dist/default/minimal/tailwind/video.tailwind.js.map

@@ -1 +1 @@
-{"version":3,"file":"video.tailwind.js","names":[],"sources":["../../../../../../../../skins/dist/default/minimal/tailwind/video.tailwind.js"],"sourcesContent":["import { container as container$1 } from \"./components/container.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 { slider as slider$1 } from \"./components/slider.js\";\nimport { iconState } from \"../../shared/tailwind/icon-state.js\";\nimport { badge } from \"./components/badge.js\";\nimport { bufferingIndicator } from \"./components/buffering.js\";\nimport { button } from \"./components/button.js\";\nimport { buttonGroup } from \"./components/button-group.js\";\nimport { icon, iconContainer, iconFlipped, iconHidden } from \"./components/icon.js\";\nimport { menu as menu$1 } from \"./components/menu.js\";\nimport { playbackRate } from \"./components/playback-rate.js\";\nimport { seek } from \"./components/seek.js\";\nimport { time as time$1 } from \"./components/time.js\";\nimport { thumbnail as thumbnail$1 } from \"./components/thumbnail.js\";\nimport { inputIndicatorOverlay } from \"./components/input-indicator-overlay.js\";\nimport { overlay } from \"./components/overlay.js\";\nimport { poster } from \"./components/poster.js\";\nimport { seekIndicator } from \"./components/seek-indicator.js\";\nimport { statusIndicator } from \"./components/status-indicator.js\";\nimport { volumeIndicator } from \"./components/volume-indicator.js\";\nimport { cn } from \"@videojs/utils/style\";\n//#region src/minimal/tailwind/video.tailwind.ts\nconst container = (isShadowDOM) => cn(container$1, \"group/skin\", \"bg-black overflow-clip\", \"after:absolute after:pointer-events-none after:rounded-[inherit] after:z-10\", \"[&:fullscreen]:after:hidden\", \"after:inset-0 after:ring-1 after:ring-inset after:ring-(color:--border-color)\", {\n\t\"[&_::slotted(video)]:block [&_::slotted(video)]:w-full [&_::slotted(video)]:h-full [&_::slotted(video)]:rounded-(--container-border-radius) [&_::slotted(video)]:[object-fit:var(--media-object-fit,cover)] [&_::slotted(video)]:[object-position:var(--media-object-position,center)]\": isShadowDOM,\n\t\"[&_video]:block [&_video]:w-full [&_video]:h-full [&_video]:rounded-[inherit] [&_video]:[object-fit:var(--media-object-fit,contain)] [&_video]:[object-position:var(--media-object-position,center)]\": !isShadowDOM\n}, \"[--default-accent-color:oklch(1_0_0)]\", \"[--border-color:light-dark(oklch(0_0_0/0.15),oklch(1_0_0/0.15))]\", \"[--focus-ring-color:light-dark(oklch(0_0_0),oklch(1_0_0))]\", \"**:[--focus-ring-color:oklch(1_0_0)]\", \"[--container-border-radius:var(--media-border-radius,0.75rem)]\", \"[--media-video-border-radius:var(--container-border-radius)]\", \"[--controls-background-color:transparent]\", \"[--controls-transition-duration:100ms]\", \"[--controls-transition-timing-function:ease-out]\", \"[--error-dialog-transition-duration:150ms]\", \"[--error-dialog-transition-delay:100ms]\", \"[--error-dialog-transition-timing-function:ease-out]\", \"[--popup-transition-duration:100ms]\", \"[--popup-transition-timing-function:ease-out]\", \"[--popover-backdrop-filter:blur(16px)_saturate(1.5)]\", \"[--popover-background-color:oklch(0_0_0/0.5)]\", \"[--popover-border-color:oklch(1_0_0/0.1)]\", \"[--tooltip-backdrop-filter:var(--popover-backdrop-filter)]\", \"[--tooltip-background-color:var(--popover-background-color)]\", \"[--tooltip-border-color:var(--popover-border-color)]\", \"[--tooltip-text-color:currentColor]\", \"min-[1280px]:[&:fullscreen]:[--scale:1.25]\", \"min-[1536px]:[&:fullscreen]:[--scale:1.5]\", \"min-[1920px]:[&:fullscreen]:[--scale:1.75]\", \"motion-reduce:[--error-dialog-transition-duration:50ms]\", \"motion-reduce:[--error-dialog-transition-delay:0ms]\", \"motion-reduce:[--popup-transition-duration:0ms]\", \"[@media(prefers-reduced-transparency:reduce)]:[--controls-background-color:oklch(0_0_0)]\", \"contrast-more:[--controls-background-color:oklch(0_0_0)]\", \"[@media(prefers-reduced-transparency:reduce)]:[--tooltip-background-color:oklch(0_0_0)]\", \"contrast-more:[--tooltip-background-color:oklch(0_0_0)]\", \"pointer-fine:has-[[data-controls]:not([data-visible])]:[--controls-transition-duration:300ms]\", \"pointer-coarse:has-[[data-controls]:not([data-visible])]:[--controls-transition-duration:150ms]\", \"motion-reduce:has-[[data-controls]:not([data-visible])]:[--controls-transition-duration:50ms]\", \"[--media-caption-track-y:--spacing(-2)]\", \"[--media-caption-track-delay:25ms]\", \"[--media-caption-track-duration:var(--controls-transition-duration)]\", \"has-[[data-controls][data-visible]]:[--media-caption-track-y:--spacing(-18)]\", \"@2xl/media-root:has-[[data-controls][data-visible]]:*:[--media-caption-track-y:--spacing(-12)]\", !isShadowDOM ? [\n\t\"[&_video::-webkit-media-text-track-container]:transition-[translate]\",\n\t\"[&_video::-webkit-media-text-track-container]:duration-(--media-caption-track-duration)\",\n\t\"[&_video::-webkit-media-text-track-container]:ease-out\",\n\t\"[&_video::-webkit-media-text-track-container]:delay-(--media-caption-track-delay)\",\n\t\"[&_video::-webkit-media-text-track-container]:translate-y-(--media-caption-track-y)\",\n\t\"[&_video::-webkit-media-text-track-container]:scale-98\",\n\t\"[&_video::-webkit-media-text-track-container]:z-1\",\n\t\"[&_video::-webkit-media-text-track-container]:font-[inherit]\"\n] : [], !isShadowDOM ? [\n\t\"before:absolute before:inset-0 before:pointer-events-none\",\n\t\"before:[background-image:var(--media-poster-placeholder,none)]\",\n\t\"before:bg-no-repeat\",\n\t\"before:[background-position:var(--media-object-position,center)]\",\n\t\"before:[background-size:var(--media-object-fit,contain)]\",\n\t\"before:opacity-0 before:[filter:blur(var(--media-poster-placeholder-blur,20px))]\",\n\t\"before:transition-opacity before:duration-250\",\n\t\"has-[img[data-visible]:not([data-loaded])]:before:opacity-100\"\n] : [], \"[&:fullscreen]:[--container-border-radius:0]\", {\n\t\"[&:fullscreen_video]:object-contain\": !isShadowDOM,\n\t\"[&:fullscreen_::slotted(video)]:object-contain\": isShadowDOM\n});\nconst controls = cn(controls$1, \"absolute bottom-1 inset-x-1\", \"[--base-side-offset:5] [--base-boundary-offset:1]\", \"gap-x-2 flex-wrap rounded-[--spacing(3)] group/controls\", \"text-white z-20\", \"peer-data-open/error:hidden\", \"ease-(--controls-transition-timing-function)\", \"duration-[calc(var(--controls-transition-duration)/2)]\", \"not-data-visible:duration-(--controls-transition-duration)\", \"pointer-fine:will-change-[translate,filter,opacity]\", \"pointer-fine:transition-[translate,filter,opacity]\", \"pointer-coarse:will-change-[translate,opacity]\", \"pointer-coarse:transition-[translate,opacity]\", \"not-data-visible:opacity-0 not-data-visible:pointer-events-none\", \"motion-safe:not-data-visible:translate-y-full\", \"pointer-fine:motion-safe:not-data-visible:blur-sm\", \"@2xl/media-root:flex-nowrap @2xl/media-root:[--controls-padding:2] @2xl/media-root:[--base-side-offset:2]\");\nconst buttonGroupStart = cn(buttonGroup, \"flex-1 @2xl/media-root:flex-none\");\nconst buttonGroupEnd = cn(buttonGroup, \"flex-1 justify-end @2xl/media-root:flex-none\");\nconst spacer = \"grow\";\nconst time = {\n\t...time$1,\n\tcontrols: cn(time$1.controls, \"[--slider-height:--spacing(5)] grow-0 shrink-0 basis-full order-[-1] px-1.5\", \"@2xl/media-root:[--slider-height:--spacing(8)] @2xl/media-root:grow @2xl/media-root:shrink @2xl/media-root:basis-0 @2xl/media-root:order-[unset]\", \"@2xl/media-root:[mask-position:100%_0] @2xl/media-root:[mask-size:200%_100%]\", \"@2xl/media-root:[transition:mask-position_50ms_ease-out]\", \"group-has-[[data-volume-level][aria-expanded=true]]/controls:@2xl/media-root:[mask-image:linear-gradient(to_right,transparent_10%,black_25%,black_100%)]\", \"group-has-[[data-volume-level][aria-expanded=true]]/controls:@2xl/media-root:[mask-position:0_0]\")\n};\nconst error = {\n\t...error$1,\n\troot: cn(error$1.root, \"pointer-events-none outline-none\"),\n\tdialog: cn(error$1.dialog, \"pointer-events-auto w-full max-w-64 p-4 rounded-none\"),\n\tcontent: cn(error$1.content, \"p-0 py-1.5\"),\n\ttitle: \"text-(length:--font-size-medium)\"\n};\nconst thumbnail = thumbnail$1;\nconst slider = {\n\t...slider$1,\n\ttrack: cn(slider$1.track, \"ring-1 ring-black/5\"),\n\tpreview: cn(slider$1.preview, \"[--preview-end-inset:calc(100cqi-100%)]\", \"[--preview-left:clamp(calc(var(--max-width)/2),var(--media-slider-pointer),calc(100%-var(--max-width)/2+var(--preview-end-inset)))]\", \"@2xl/media-root:[--preview-left:var(--media-slider-pointer)]\")\n};\nconst popup = {\n\t...popup$1,\n\tvolume: cn(popup$1.popover, \"p-0 bg-transparent\")\n};\nconst menu = {\n\t...menu$1,\n\troot: menu$1.root,\n\tsettings: menu$1.settings\n};\n//#endregion\nexport { badge, bufferingIndicator, button, buttonGroup, buttonGroupEnd, buttonGroupStart, container, controls, error, icon, iconContainer, iconFlipped, iconHidden, iconState, inputIndicatorOverlay, menu, overlay, playbackRate, popup, poster, seek, seekIndicator, slider, spacer, statusIndicator, thumbnail, time, volumeIndicator };\n\n//# sourceMappingURL=video.tailwind.js.map"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAM,aAAa,gBAAgB,GAAG,aAAa,cAAc,0BAA0B,+EAA+E,+BAA+B,iFAAiF;CACzR,0RAA0R;CAC1R,wMAAwM,CAAC;AAC1M,GAAG,yCAAyC,oEAAoE,8DAA8D,wCAAwC,kEAAkE,gEAAgE,6CAA6C,0CAA0C,oDAAoD,8CAA8C,2CAA2C,wDAAwD,uCAAuC,iDAAiD,wDAAwD,iDAAiD,6CAA6C,8DAA8D,gEAAgE,wDAAwD,uCAAuC,8CAA8C,6CAA6C,8CAA8C,2DAA2D,uDAAuD,mDAAmD,4FAA4F,4DAA4D,2FAA2F,2DAA2D,iGAAiG,mGAAmG,iGAAiG,2CAA2C,sCAAsC,wEAAwE,gFAAgF,kGAAkG,CAAC,cAAc;CACzxE;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACD,IAAI,CAAC,GAAG,CAAC,cAAc;CACtB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACD,IAAI,CAAC,GAAG,gDAAgD;CACvD,uCAAuC,CAAC;CACxC,kDAAkD;AACnD,CAAC;AACD,MAAM,WAAW,GAAG,YAAY,+BAA+B,qDAAqD,2DAA2D,mBAAmB,+BAA+B,gDAAgD,0DAA0D,8DAA8D,uDAAuD,sDAAsD,kDAAkD,iDAAiD,mEAAmE,iDAAiD,qDAAqD,2GAA2G;AAC72B,MAAM,mBAAmB,GAAG,aAAa,kCAAkC;AAC3E,MAAM,iBAAiB,GAAG,aAAa,8CAA8C;AACrF,MAAM,SAAS;AACf,MAAM,OAAO;CACZ,GAAG;CACH,UAAU,GAAG,OAAO,UAAU,+EAA+E,oJAAoJ,gFAAgF,4DAA4D,4JAA4J,kGAAkG;AAC5oB;AACA,MAAM,QAAQ;CACb,GAAG;CACH,MAAM,GAAG,QAAQ,MAAM,kCAAkC;CACzD,QAAQ,GAAG,QAAQ,QAAQ,sDAAsD;CACjF,SAAS,GAAG,QAAQ,SAAS,YAAY;CACzC,OAAO;AACR;AACA,MAAM,YAAY;AAClB,MAAM,SAAS;CACd,GAAG;CACH,OAAO,GAAG,SAAS,OAAO,qBAAqB;CAC/C,SAAS,GAAG,SAAS,SAAS,2CAA2C,uIAAuI,8DAA8D;AAC/Q;AACA,MAAM,QAAQ;CACb,GAAG;CACH,QAAQ,GAAG,QAAQ,SAAS,oBAAoB;AACjD;AACA,MAAM,OAAO;CACZ,GAAG;CACH,MAAM,OAAO;CACb,UAAU,OAAO;AAClB"}
+{"version":3,"file":"video.tailwind.js","names":[],"sources":["../../../../../../../../skins/dist/default/minimal/tailwind/video.tailwind.js"],"sourcesContent":["import { container as container$1 } from \"./components/container.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 { slider as slider$1 } from \"./components/slider.js\";\nimport { iconState } from \"../../shared/tailwind/icon-state.js\";\nimport { badge } from \"./components/badge.js\";\nimport { bufferingIndicator } from \"./components/buffering.js\";\nimport { button } from \"./components/button.js\";\nimport { buttonGroup } from \"./components/button-group.js\";\nimport { icon, iconContainer, iconFlipped, iconHidden } from \"./components/icon.js\";\nimport { menu as menu$1 } from \"./components/menu.js\";\nimport { playbackRate } from \"./components/playback-rate.js\";\nimport { seek } from \"./components/seek.js\";\nimport { time as time$1 } from \"./components/time.js\";\nimport { thumbnail as thumbnail$1 } from \"./components/thumbnail.js\";\nimport { inputIndicatorOverlay } from \"./components/input-indicator-overlay.js\";\nimport { overlay } from \"./components/overlay.js\";\nimport { poster } from \"./components/poster.js\";\nimport { seekIndicator } from \"./components/seek-indicator.js\";\nimport { statusIndicator } from \"./components/status-indicator.js\";\nimport { volumeIndicator } from \"./components/volume-indicator.js\";\nimport { cn } from \"@videojs/utils/style\";\n//#region src/minimal/tailwind/video.tailwind.ts\nconst container = (isShadowDOM) => cn(container$1, \"group/skin\", \"bg-black overflow-clip\", \"after:absolute after:pointer-events-none after:rounded-[inherit] after:z-10\", \"[&:fullscreen]:after:hidden\", \"after:inset-0 after:ring-1 after:ring-inset after:ring-(color:--border-color)\", {\n\t\"[&_::slotted(video)]:block [&_::slotted(video)]:w-full [&_::slotted(video)]:h-full [&_::slotted(video)]:rounded-(--container-border-radius) [&_::slotted(video)]:[object-fit:var(--media-object-fit,cover)] [&_::slotted(video)]:[object-position:var(--media-object-position,center)]\": isShadowDOM,\n\t\"[&_video]:block [&_video]:w-full [&_video]:h-full [&_video]:rounded-[inherit] [&_video]:[object-fit:var(--media-object-fit,contain)] [&_video]:[object-position:var(--media-object-position,center)]\": !isShadowDOM\n}, \"[--default-accent-color:oklch(1_0_0)]\", \"[--border-color:light-dark(oklch(0_0_0/0.15),oklch(1_0_0/0.15))]\", \"[--focus-ring-color:light-dark(oklch(0_0_0),oklch(1_0_0))]\", \"**:[--focus-ring-color:oklch(1_0_0)]\", \"[--container-border-radius:var(--media-border-radius,0.75rem)]\", \"[--media-video-border-radius:var(--container-border-radius)]\", \"[--controls-background-color:transparent]\", \"[--controls-transition-duration:100ms]\", \"[--controls-transition-timing-function:ease-out]\", \"[--error-dialog-transition-duration:150ms]\", \"[--error-dialog-transition-delay:100ms]\", \"[--error-dialog-transition-timing-function:ease-out]\", \"[--popup-transition-duration:100ms]\", \"[--popup-transition-timing-function:ease-out]\", \"[--popover-backdrop-filter:blur(16px)_saturate(1.5)]\", \"[--popover-background-color:oklch(0_0_0/0.5)]\", \"[--popover-border-color:oklch(1_0_0/0.1)]\", \"[--tooltip-backdrop-filter:var(--popover-backdrop-filter)]\", \"[--tooltip-background-color:var(--popover-background-color)]\", \"[--tooltip-border-color:var(--popover-border-color)]\", \"[--tooltip-text-color:currentColor]\", \"min-[1280px]:[&:fullscreen]:[--scale:1.25]\", \"min-[1536px]:[&:fullscreen]:[--scale:1.5]\", \"min-[1920px]:[&:fullscreen]:[--scale:1.75]\", \"motion-reduce:[--error-dialog-transition-duration:50ms]\", \"motion-reduce:[--error-dialog-transition-delay:0ms]\", \"motion-reduce:[--popup-transition-duration:0ms]\", \"[@media(prefers-reduced-transparency:reduce)]:[--controls-background-color:oklch(0_0_0)]\", \"contrast-more:[--controls-background-color:oklch(0_0_0)]\", \"[@media(prefers-reduced-transparency:reduce)]:[--tooltip-background-color:oklch(0_0_0)]\", \"contrast-more:[--tooltip-background-color:oklch(0_0_0)]\", \"pointer-fine:has-[[data-controls]:not([data-visible])]:[--controls-transition-duration:300ms]\", \"pointer-coarse:has-[[data-controls]:not([data-visible])]:[--controls-transition-duration:150ms]\", \"motion-reduce:has-[[data-controls]:not([data-visible])]:[--controls-transition-duration:50ms]\", \"[--media-caption-track-y:--spacing(-2)]\", \"[--media-caption-track-delay:25ms]\", \"[--media-caption-track-duration:var(--controls-transition-duration)]\", \"has-[[data-controls][data-visible]]:[--media-caption-track-y:--spacing(-18)]\", \"@2xl/media-root:has-[[data-controls][data-visible]]:*:[--media-caption-track-y:--spacing(-12)]\", !isShadowDOM ? [\n\t\"[&_video::-webkit-media-text-track-container]:transition-[translate]\",\n\t\"[&_video::-webkit-media-text-track-container]:duration-(--media-caption-track-duration)\",\n\t\"[&_video::-webkit-media-text-track-container]:ease-out\",\n\t\"[&_video::-webkit-media-text-track-container]:delay-(--media-caption-track-delay)\",\n\t\"[&_video::-webkit-media-text-track-container]:translate-y-(--media-caption-track-y)\",\n\t\"[&_video::-webkit-media-text-track-container]:scale-98\",\n\t\"[&_video::-webkit-media-text-track-container]:z-1\",\n\t\"[&_video::-webkit-media-text-track-container]:font-[inherit]\"\n] : [], !isShadowDOM ? [\n\t\"before:absolute before:inset-0 before:pointer-events-none\",\n\t\"before:[background-image:var(--media-poster-placeholder,none)]\",\n\t\"before:bg-no-repeat\",\n\t\"before:[background-position:var(--media-object-position,center)]\",\n\t\"before:[background-size:var(--media-object-fit,contain)]\",\n\t\"before:opacity-0 before:[filter:blur(var(--media-poster-placeholder-blur,20px))]\",\n\t\"before:transition-opacity before:duration-250\",\n\t\"has-[img[data-visible]:not([data-loaded])]:before:opacity-100\"\n] : [], \"[&:fullscreen]:[--container-border-radius:0]\", {\n\t\"[&:fullscreen_video]:object-contain\": !isShadowDOM,\n\t\"[&:fullscreen_::slotted(video)]:object-contain\": isShadowDOM\n});\nconst controls = cn(controls$1, \"absolute bottom-1 inset-x-1\", \"[--base-side-offset:5] [--base-boundary-offset:1]\", \"[--volume-mask:linear-gradient(to_right,transparent_10%,black_25%,black_100%)]\", \"gap-x-2 flex-wrap rounded-[--spacing(3)] group/controls\", \"text-white z-20\", \"peer-data-open/error:hidden\", \"ease-(--controls-transition-timing-function)\", \"duration-[calc(var(--controls-transition-duration)/2)]\", \"not-data-visible:duration-(--controls-transition-duration)\", \"pointer-fine:will-change-[translate,filter,opacity]\", \"pointer-fine:transition-[translate,filter,opacity]\", \"pointer-coarse:will-change-[translate,opacity]\", \"pointer-coarse:transition-[translate,opacity]\", \"not-data-visible:opacity-0 not-data-visible:pointer-events-none\", \"motion-safe:not-data-visible:translate-y-full\", \"pointer-fine:motion-safe:not-data-visible:blur-sm\", \"@2xl/media-root:flex-nowrap @2xl/media-root:[--controls-padding:2] @2xl/media-root:[--base-side-offset:2]\");\nconst volumeMaskTarget = cn(\"[mask-image:var(--volume-mask-image,none)]\", \"[mask-repeat:no-repeat]\", \"[mask-position:var(--volume-mask-position,100%_0)]\", \"[mask-size:var(--volume-mask-size,200%_100%)]\", \"[transition:mask-position_50ms_ease-out]\");\nconst buttonGroupStart = cn(buttonGroup, \"flex-1 @2xl/media-root:flex-none\");\nconst buttonGroupEnd = cn(buttonGroup, volumeMaskTarget, \"flex-1 justify-end @2xl/media-root:flex-none\", \"group-has-[[data-volume-level][aria-expanded=true]]/controls:@max-2xl/media-root:[--volume-mask-image:var(--volume-mask)]\", \"group-has-[[data-volume-level][aria-expanded=true]]/controls:@max-2xl/media-root:[--volume-mask-position:0_0]\", \"group-has-[[data-volume-level][aria-expanded=true]]/controls:@max-2xl/media-root:[--volume-mask-size:400%_100%]\");\nconst spacer = \"grow\";\nconst time = {\n\t...time$1,\n\tcontrols: cn(time$1.controls, volumeMaskTarget, \"[--slider-height:--spacing(5)] grow-0 shrink-0 basis-full order-[-1] px-1.5\", \"@2xl/media-root:[--slider-height:--spacing(8)] @2xl/media-root:grow @2xl/media-root:shrink @2xl/media-root:basis-0 @2xl/media-root:order-[unset]\", \"group-has-[[data-volume-level][aria-expanded=true]]/controls:@2xl/media-root:[--volume-mask-image:var(--volume-mask)]\", \"group-has-[[data-volume-level][aria-expanded=true]]/controls:@2xl/media-root:[--volume-mask-position:0_0]\")\n};\nconst error = {\n\t...error$1,\n\troot: cn(error$1.root, \"pointer-events-none outline-none\"),\n\tdialog: cn(error$1.dialog, \"pointer-events-auto w-full max-w-64 p-4 rounded-none\"),\n\tcontent: cn(error$1.content, \"p-0 py-1.5\"),\n\ttitle: \"text-(length:--font-size-medium)\"\n};\nconst thumbnail = thumbnail$1;\nconst slider = {\n\t...slider$1,\n\ttrack: cn(slider$1.track, \"ring-1 ring-black/5\"),\n\tpreview: cn(slider$1.preview, \"[--preview-end-inset:calc(100cqi-100%)]\", \"[--preview-left:clamp(calc(var(--max-size)/2),var(--media-slider-pointer),calc(100%-var(--max-size)/2+var(--preview-end-inset)))]\", \"@2xl/media-root:[--preview-left:var(--media-slider-pointer)]\")\n};\nconst popup = {\n\t...popup$1,\n\tvolume: cn(popup$1.popover, \"p-0 bg-transparent\", \"@max-2xl/media-root:[--media-popover-side-offset:--spacing(3)]\")\n};\nconst menu = {\n\t...menu$1,\n\troot: menu$1.root,\n\tsettings: menu$1.settings\n};\n//#endregion\nexport { badge, bufferingIndicator, button, buttonGroup, buttonGroupEnd, buttonGroupStart, container, controls, error, icon, iconContainer, iconFlipped, iconHidden, iconState, inputIndicatorOverlay, menu, overlay, playbackRate, popup, poster, seek, seekIndicator, slider, spacer, statusIndicator, thumbnail, time, volumeIndicator };\n\n//# sourceMappingURL=video.tailwind.js.map"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAM,aAAa,gBAAgB,GAAG,aAAa,cAAc,0BAA0B,+EAA+E,+BAA+B,iFAAiF;CACzR,0RAA0R;CAC1R,wMAAwM,CAAC;AAC1M,GAAG,yCAAyC,oEAAoE,8DAA8D,wCAAwC,kEAAkE,gEAAgE,6CAA6C,0CAA0C,oDAAoD,8CAA8C,2CAA2C,wDAAwD,uCAAuC,iDAAiD,wDAAwD,iDAAiD,6CAA6C,8DAA8D,gEAAgE,wDAAwD,uCAAuC,8CAA8C,6CAA6C,8CAA8C,2DAA2D,uDAAuD,mDAAmD,4FAA4F,4DAA4D,2FAA2F,2DAA2D,iGAAiG,mGAAmG,iGAAiG,2CAA2C,sCAAsC,wEAAwE,gFAAgF,kGAAkG,CAAC,cAAc;CACzxE;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACD,IAAI,CAAC,GAAG,CAAC,cAAc;CACtB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACD,IAAI,CAAC,GAAG,gDAAgD;CACvD,uCAAuC,CAAC;CACxC,kDAAkD;AACnD,CAAC;AACD,MAAM,WAAW,GAAG,YAAY,+BAA+B,qDAAqD,kFAAkF,2DAA2D,mBAAmB,+BAA+B,gDAAgD,0DAA0D,8DAA8D,uDAAuD,sDAAsD,kDAAkD,iDAAiD,mEAAmE,iDAAiD,qDAAqD,2GAA2G;AAC/7B,MAAM,mBAAmB,GAAG,8CAA8C,2BAA2B,sDAAsD,iDAAiD,0CAA0C;AACtP,MAAM,mBAAmB,GAAG,aAAa,kCAAkC;AAC3E,MAAM,iBAAiB,GAAG,aAAa,kBAAkB,gDAAgD,6HAA6H,iHAAiH,iHAAiH;AACxc,MAAM,SAAS;AACf,MAAM,OAAO;CACZ,GAAG;CACH,UAAU,GAAG,OAAO,UAAU,kBAAkB,+EAA+E,oJAAoJ,yHAAyH,2GAA2G;AACxf;AACA,MAAM,QAAQ;CACb,GAAG;CACH,MAAM,GAAG,QAAQ,MAAM,kCAAkC;CACzD,QAAQ,GAAG,QAAQ,QAAQ,sDAAsD;CACjF,SAAS,GAAG,QAAQ,SAAS,YAAY;CACzC,OAAO;AACR;AACA,MAAM,YAAY;AAClB,MAAM,SAAS;CACd,GAAG;CACH,OAAO,GAAG,SAAS,OAAO,qBAAqB;CAC/C,SAAS,GAAG,SAAS,SAAS,2CAA2C,qIAAqI,8DAA8D;AAC7Q;AACA,MAAM,QAAQ;CACb,GAAG;CACH,QAAQ,GAAG,QAAQ,SAAS,sBAAsB,gEAAgE;AACnH;AACA,MAAM,OAAO;CACZ,GAAG;CACH,MAAM,OAAO;CACb,UAAU,OAAO;AAClB"}

package/dist/default/skins/dist/default/shared/tailwind/icon-state.js

@@ -41,10 +41,10 @@ const iconState = {
 	airplay: {
 		button: [
 			"group",
-			"not-data-[airplay-state=connected]:[--media-icon--airplay__fill-animation:none]",
-			"not-data-[airplay-state=connected]:[--media-icon--airplay__triangle-animation:none]",
-			"motion-reduce:[--media-icon--airplay__fill-animation:none]",
-			"motion-reduce:[--media-icon--airplay__triangle-animation:none]"
+			"not-data-[airplay-state=connected]:[--media-icon-airplay-fill-animation:none]",
+			"not-data-[airplay-state=connected]:[--media-icon-airplay-triangle-animation:none]",
+			"motion-reduce:[--media-icon-airplay-fill-animation:none]",
+			"motion-reduce:[--media-icon-airplay-triangle-animation:none]"
 		].join(" "),
 		enter: "opacity-0 group-not-data-[airplay-state=connected]:opacity-100 group-not-data-[airplay-state=connected]:scale-100",
 		exit: "opacity-0 group-data-[airplay-state=connected]:opacity-100 group-data-[airplay-state=connected]:scale-100"

package/dist/default/skins/dist/default/shared/tailwind/icon-state.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-state.js","names":[],"sources":["../../../../../../../../skins/dist/default/shared/tailwind/icon-state.js"],"sourcesContent":["//#region src/shared/tailwind/icon-state.ts\nconst iconState = {\n\tplay: {\n\t\tbutton: \"group\",\n\t\trestart: \"opacity-0 scale-0 group-data-ended:opacity-100 group-data-ended:scale-100\",\n\t\tplay: [\n\t\t\t\"opacity-0 scale-0\",\n\t\t\t\"group-not-data-ended:group-data-paused:opacity-100\",\n\t\t\t\"group-not-data-ended:group-data-paused:scale-100\",\n\t\t\t\"group-not-data-ended:group-not-data-started:opacity-100\",\n\t\t\t\"group-not-data-ended:group-not-data-started:scale-100\"\n\t\t].join(\" \"),\n\t\tpause: \"opacity-0 scale-0 group-data-started:group-not-data-paused:group-not-data-ended:opacity-100 group-data-started:group-not-data-paused:group-not-data-ended:scale-100\"\n\t},\n\tmute: {\n\t\tbutton: \"group\",\n\t\tvolumeOff: \"opacity-0 group-data-muted:opacity-100 group-data-muted:scale-100\",\n\t\tvolumeLow: \"opacity-0 group-not-data-muted:group-data-[volume-level=low]:opacity-100 group-not-data-muted:group-data-[volume-level=low]:scale-100\",\n\t\tvolumeHigh: \"opacity-0 group-not-data-muted:group-not-data-[volume-level=low]:opacity-100 group-not-data-muted:group-not-data-[volume-level=low]:scale-100\"\n\t},\n\tfullscreen: {\n\t\tbutton: \"group\",\n\t\tenter: \"opacity-0 group-not-data-fullscreen:opacity-100 group-not-data-fullscreen:scale-100\",\n\t\texit: \"opacity-0 group-data-fullscreen:opacity-100 group-data-fullscreen:scale-100\"\n\t},\n\tcaptions: {\n\t\tbutton: \"group\",\n\t\toff: \"opacity-0 group-not-data-active:opacity-100 group-not-data-active:scale-100\",\n\t\ton: \"opacity-0 group-data-active:opacity-100 group-data-active:scale-100\"\n\t},\n\tpip: {\n\t\tbutton: \"group\",\n\t\toff: \"opacity-0 group-not-data-pip:opacity-100 group-not-data-pip:scale-100\",\n\t\ton: \"opacity-0 group-data-pip:opacity-100 group-data-pip:scale-100\"\n\t},\n\tcast: {\n\t\tbutton: \"group\",\n\t\tenter: \"opacity-0 group-not-data-[cast-state=connected]:opacity-100 group-not-data-[cast-state=connected]:scale-100\",\n\t\texit: \"opacity-0 group-data-[cast-state=connected]:opacity-100 group-data-[cast-state=connected]:scale-100\"\n\t},\n\tairplay: {\n\t\tbutton: [\n\t\t\t\"group\",\n\t\t\t\"not-data-[airplay-state=connected]:[--media-icon--airplay__fill-animation:none]\",\n\t\t\t\"not-data-[airplay-state=connected]:[--media-icon--airplay__triangle-animation:none]\",\n\t\t\t\"motion-reduce:[--media-icon--airplay__fill-animation:none]\",\n\t\t\t\"motion-reduce:[--media-icon--airplay__triangle-animation:none]\"\n\t\t].join(\" \"),\n\t\tenter: \"opacity-0 group-not-data-[airplay-state=connected]:opacity-100 group-not-data-[airplay-state=connected]:scale-100\",\n\t\texit: \"opacity-0 group-data-[airplay-state=connected]:opacity-100 group-data-[airplay-state=connected]:scale-100\"\n\t}\n};\n//#endregion\nexport { iconState };\n\n//# sourceMappingURL=icon-state.js.map"],"mappings":";AACA,MAAM,YAAY;CACjB,MAAM;EACL,QAAQ;EACR,SAAS;EACT,MAAM;GACL;GACA;GACA;GACA;GACA;EACD,CAAC,CAAC,KAAK,GAAG;EACV,OAAO;CACR;CACA,MAAM;EACL,QAAQ;EACR,WAAW;EACX,WAAW;EACX,YAAY;CACb;CACA,YAAY;EACX,QAAQ;EACR,OAAO;EACP,MAAM;CACP;CACA,UAAU;EACT,QAAQ;EACR,KAAK;EACL,IAAI;CACL;CACA,KAAK;EACJ,QAAQ;EACR,KAAK;EACL,IAAI;CACL;CACA,MAAM;EACL,QAAQ;EACR,OAAO;EACP,MAAM;CACP;CACA,SAAS;EACR,QAAQ;GACP;GACA;GACA;GACA;GACA;EACD,CAAC,CAAC,KAAK,GAAG;EACV,OAAO;EACP,MAAM;CACP;AACD"}
+{"version":3,"file":"icon-state.js","names":[],"sources":["../../../../../../../../skins/dist/default/shared/tailwind/icon-state.js"],"sourcesContent":["//#region src/shared/tailwind/icon-state.ts\nconst iconState = {\n\tplay: {\n\t\tbutton: \"group\",\n\t\trestart: \"opacity-0 scale-0 group-data-ended:opacity-100 group-data-ended:scale-100\",\n\t\tplay: [\n\t\t\t\"opacity-0 scale-0\",\n\t\t\t\"group-not-data-ended:group-data-paused:opacity-100\",\n\t\t\t\"group-not-data-ended:group-data-paused:scale-100\",\n\t\t\t\"group-not-data-ended:group-not-data-started:opacity-100\",\n\t\t\t\"group-not-data-ended:group-not-data-started:scale-100\"\n\t\t].join(\" \"),\n\t\tpause: \"opacity-0 scale-0 group-data-started:group-not-data-paused:group-not-data-ended:opacity-100 group-data-started:group-not-data-paused:group-not-data-ended:scale-100\"\n\t},\n\tmute: {\n\t\tbutton: \"group\",\n\t\tvolumeOff: \"opacity-0 group-data-muted:opacity-100 group-data-muted:scale-100\",\n\t\tvolumeLow: \"opacity-0 group-not-data-muted:group-data-[volume-level=low]:opacity-100 group-not-data-muted:group-data-[volume-level=low]:scale-100\",\n\t\tvolumeHigh: \"opacity-0 group-not-data-muted:group-not-data-[volume-level=low]:opacity-100 group-not-data-muted:group-not-data-[volume-level=low]:scale-100\"\n\t},\n\tfullscreen: {\n\t\tbutton: \"group\",\n\t\tenter: \"opacity-0 group-not-data-fullscreen:opacity-100 group-not-data-fullscreen:scale-100\",\n\t\texit: \"opacity-0 group-data-fullscreen:opacity-100 group-data-fullscreen:scale-100\"\n\t},\n\tcaptions: {\n\t\tbutton: \"group\",\n\t\toff: \"opacity-0 group-not-data-active:opacity-100 group-not-data-active:scale-100\",\n\t\ton: \"opacity-0 group-data-active:opacity-100 group-data-active:scale-100\"\n\t},\n\tpip: {\n\t\tbutton: \"group\",\n\t\toff: \"opacity-0 group-not-data-pip:opacity-100 group-not-data-pip:scale-100\",\n\t\ton: \"opacity-0 group-data-pip:opacity-100 group-data-pip:scale-100\"\n\t},\n\tcast: {\n\t\tbutton: \"group\",\n\t\tenter: \"opacity-0 group-not-data-[cast-state=connected]:opacity-100 group-not-data-[cast-state=connected]:scale-100\",\n\t\texit: \"opacity-0 group-data-[cast-state=connected]:opacity-100 group-data-[cast-state=connected]:scale-100\"\n\t},\n\tairplay: {\n\t\tbutton: [\n\t\t\t\"group\",\n\t\t\t\"not-data-[airplay-state=connected]:[--media-icon-airplay-fill-animation:none]\",\n\t\t\t\"not-data-[airplay-state=connected]:[--media-icon-airplay-triangle-animation:none]\",\n\t\t\t\"motion-reduce:[--media-icon-airplay-fill-animation:none]\",\n\t\t\t\"motion-reduce:[--media-icon-airplay-triangle-animation:none]\"\n\t\t].join(\" \"),\n\t\tenter: \"opacity-0 group-not-data-[airplay-state=connected]:opacity-100 group-not-data-[airplay-state=connected]:scale-100\",\n\t\texit: \"opacity-0 group-data-[airplay-state=connected]:opacity-100 group-data-[airplay-state=connected]:scale-100\"\n\t}\n};\n//#endregion\nexport { iconState };\n\n//# sourceMappingURL=icon-state.js.map"],"mappings":";AACA,MAAM,YAAY;CACjB,MAAM;EACL,QAAQ;EACR,SAAS;EACT,MAAM;GACL;GACA;GACA;GACA;GACA;EACD,CAAC,CAAC,KAAK,GAAG;EACV,OAAO;CACR;CACA,MAAM;EACL,QAAQ;EACR,WAAW;EACX,WAAW;EACX,YAAY;CACb;CACA,YAAY;EACX,QAAQ;EACR,OAAO;EACP,MAAM;CACP;CACA,UAAU;EACT,QAAQ;EACR,KAAK;EACL,IAAI;CACL;CACA,KAAK;EACJ,QAAQ;EACR,KAAK;EACL,IAAI;CACL;CACA,MAAM;EACL,QAAQ;EACR,OAAO;EACP,MAAM;CACP;CACA,SAAS;EACR,QAAQ;GACP;GACA;GACA;GACA;GACA;EACD,CAAC,CAAC,KAAK,GAAG;EACV,OAAO;EACP,MAAM;CACP;AACD"}

package/dist/default/store/provider-mixin.js

@@ -1,9 +1,23 @@
 import { setPlayerConfigValue } from "@videojs/core/dom";
 import { ContextProvider } from "@videojs/element/context";
-import { kebabCase } from "@videojs/utils/string";
+import { camelCase, kebabCase } from "@videojs/utils/string";
 import { isNull } from "@videojs/utils/predicate";
 //#region src/store/provider-mixin.ts
 /**
+* Name each input on the element. A key whose own name is taken there declares
+* an `html.attribute` instead, and the property follows from that.
+*/
+function resolveInputs(config) {
+	return Object.entries(config).map(([key, entry]) => {
+		const attribute = entry.html?.attribute ?? kebabCase(key);
+		return {
+			property: camelCase(attribute),
+			attribute,
+			entry
+		};
+	});
+}
+/**
 * Create a mixin that provides player context to descendant elements and
 * owns the `store.attach()` lifecycle.
 *
@@ -17,15 +31,15 @@ import { isNull } from "@videojs/utils/predicate";
 * @param options - Provider options with contexts, store factory, and feature configuration.
 */
 function createProviderMixin(options) {
-	const configKeys = Object.keys(options.config);
+	const inputs = resolveInputs(options.config);
 	return (BaseClass) => {
 		class PlayerProviderElement extends BaseClass {
 			static {
 				this.properties = {
 					...BaseClass.properties,
-					...Object.fromEntries(configKeys.map((key) => [key, {
+					...Object.fromEntries(inputs.map(({ property, attribute }) => [property, {
 						type: String,
-						attribute: kebabCase(key)
+						attribute
 					}]))
 				};
 			}
@@ -102,9 +116,9 @@ function createProviderMixin(options) {
 			}
 			willUpdate(changed) {
 				super.willUpdate(changed);
-				for (const key of configKeys) {
-					if (!changed.has(key)) continue;
-					setPlayerConfigValue(this.store, options.config[key], this[key]);
+				for (const { property, entry } of inputs) {
+					if (!changed.has(property)) continue;
+					setPlayerConfigValue(this.store, entry, this[property]);
 				}
 			}
 			#tryAttach() {
@@ -132,7 +146,7 @@ function createProviderMixin(options) {
 			#syncInitialConfig() {
 				const store = this.store;
 				if (this.#configuredStore === store) return;
-				for (const key of configKeys) setPlayerConfigValue(store, options.config[key], this[key]);
+				for (const { property, entry } of inputs) setPlayerConfigValue(store, entry, this[property]);
 				this.#configuredStore = store;
 			}
 			#queueFallbackDiscovery() {

package/dist/default/store/provider-mixin.js.map

@@ -1 +1 @@
-{"version":3,"file":"provider-mixin.js","names":["#media","#mediaProvider","#setMedia","#tryAttach","#container","#containerProvider","#setContainer","#store","#syncInitialConfig","#playerProvider","#queueFallbackDiscovery","#detachStore","#detach","#configuredStore","#fallbackQueued"],"sources":["../../../src/store/provider-mixin.ts"],"sourcesContent":["import {\n  type MediaContainer,\n  type PlayerFeatureConfig,\n  type PlayerStore,\n  type PlayerTarget,\n  setPlayerConfigValue,\n} from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextProvider } from '@videojs/element/context';\nimport type { Media } from '@videojs/media/dom';\nimport { isNull } from '@videojs/utils/predicate';\nimport { kebabCase } from '@videojs/utils/string';\nimport type { MediaElementConstructor } from '@/ui/media-element';\nimport type { ContainerContext, MediaContext, PlayerContext } from '../player/context';\nimport type { PlayerProviderConstructor } from './types';\n\nexport interface ProviderMixinConfig<Store extends PlayerStore> {\n  playerContext: PlayerContext<Store>;\n  mediaContext: MediaContext;\n  containerContext: ContainerContext;\n  factory: () => Store;\n  config: PlayerFeatureConfig;\n}\n\nexport type ProviderMixin<Store extends PlayerStore> = <Class extends MediaElementConstructor>(\n  BaseClass: Class\n) => Class & PlayerProviderConstructor<Store>;\n\n/**\n * Create a mixin that provides player context to descendant elements and\n * owns the `store.attach()` lifecycle.\n *\n * Media and container elements register themselves via media/container\n * contexts that carry both the current value and a setter. When a media\n * element is available, the provider calls `store.attach({ media, container })`.\n *\n * As a fallback for plain `<video>`/`<audio>` that can't consume context,\n * the provider queries its subtree after a microtask.\n *\n * @param options - Provider options with contexts, store factory, and feature configuration.\n */\nexport function createProviderMixin<Store extends PlayerStore>(\n  options: ProviderMixinConfig<Store>\n): ProviderMixin<Store> {\n  const configKeys = Object.keys(options.config);\n\n  return <Class extends MediaElementConstructor>(BaseClass: Class) => {\n    class PlayerProviderElement extends BaseClass {\n      static properties = {\n        ...(BaseClass as unknown as { properties: PropertyDeclarationMap }).properties,\n        ...Object.fromEntries(configKeys.map((key) => [key, { type: String, attribute: kebabCase(key) }])),\n      };\n\n      #store: Store | null = options.factory();\n      #configuredStore: Store | null = null;\n      #detach: (() => void) | null = null;\n      #media: Media | null = null;\n      #container: MediaContainer | null = null;\n      #fallbackQueued = false;\n\n      #setMedia = (media: Media | null): void => {\n        if (this.#media === media) return;\n        this.#media = media;\n        this.#mediaProvider.setValue({ media, setMedia: this.#setMedia });\n        this.#tryAttach();\n      };\n\n      #setContainer = (container: MediaContainer | null): void => {\n        if (this.#container === container) return;\n        this.#container = container;\n        this.#containerProvider.setValue({\n          container,\n          setContainer: this.#setContainer,\n        });\n        this.#tryAttach();\n      };\n\n      #playerProvider = new ContextProvider(this, {\n        context: options.playerContext,\n        initialValue: this.store,\n      });\n\n      #mediaProvider = new ContextProvider(this, {\n        context: options.mediaContext,\n        initialValue: { media: this.#media, setMedia: this.#setMedia },\n      });\n\n      #containerProvider = new ContextProvider(this, {\n        context: options.containerContext,\n        initialValue: {\n          container: this.#container,\n          setContainer: this.#setContainer,\n        },\n      });\n\n      get store(): Store {\n        if (isNull(this.#store)) {\n          this.#store = options.factory();\n        }\n\n        return this.#store;\n      }\n\n      override connectedCallback() {\n        this.#syncInitialConfig();\n        super.connectedCallback();\n        this.#playerProvider.setValue(this.store);\n        this.#mediaProvider.setValue({ media: this.#media, setMedia: this.#setMedia });\n        this.#containerProvider.setValue({\n          container: this.#container,\n          setContainer: this.#setContainer,\n        });\n        this.#tryAttach();\n        this.#queueFallbackDiscovery();\n      }\n\n      override disconnectedCallback() {\n        super.disconnectedCallback();\n        this.#detachStore();\n      }\n\n      override destroyCallback() {\n        this.#detachStore();\n        this.#store?.destroy();\n        this.#store = null;\n        super.destroyCallback();\n      }\n\n      protected override willUpdate(changed: PropertyValues): void {\n        super.willUpdate(changed);\n\n        // Configuration flows one way: only actual reactive property changes\n        // write to the store. Store-side writers do not reflect back here.\n        for (const key of configKeys) {\n          if (!changed.has(key)) continue;\n          setPlayerConfigValue(this.store, options.config[key]!, (this as unknown as Record<string, unknown>)[key]);\n        }\n      }\n\n      #tryAttach(): void {\n        const store = this.#store;\n        if (!store) return;\n\n        if (!this.#media) {\n          this.#detachStore();\n          return;\n        }\n\n        const target: PlayerTarget = {\n          media: this.#media,\n          container: this.#container,\n        };\n\n        const hasMediaChanged = store.target?.media !== target.media;\n        const hasContainerChanged = store.target?.container !== target.container;\n\n        if (hasMediaChanged || hasContainerChanged) {\n          this.#detachStore();\n          this.#detach = store.attach(target);\n        }\n      }\n\n      #detachStore(): void {\n        this.#detach?.();\n        this.#detach = null;\n      }\n\n      #syncInitialConfig(): void {\n        const store = this.store;\n        if (this.#configuredStore === store) return;\n\n        for (const key of configKeys) {\n          setPlayerConfigValue(store, options.config[key]!, (this as unknown as Record<string, unknown>)[key]);\n        }\n        this.#configuredStore = store;\n      }\n\n      #queueFallbackDiscovery(): void {\n        if (this.#media || this.#fallbackQueued) return;\n        this.#fallbackQueued = true;\n\n        queueMicrotask(() => {\n          this.#fallbackQueued = false;\n\n          // Context already registered media — skip fallback.\n          if (this.#media) return;\n\n          const media = this.querySelector<HTMLMediaElement>('video, audio');\n          if (media) {\n            this.#setMedia(media);\n          }\n        });\n      }\n    }\n\n    return PlayerProviderElement as unknown as Class & PlayerProviderConstructor<Store>;\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAyCA,SAAgB,oBACd,SACsB;CACtB,MAAM,aAAa,OAAO,KAAK,QAAQ,MAAM;CAE7C,QAA+C,cAAqB;EAClE,MAAM,8BAA8B,UAAU;;IACxB,KAAA,aAAA;KAClB,GAAI,UAAgE;KACpE,GAAG,OAAO,YAAY,WAAW,KAAK,QAAQ,CAAC,KAAK;MAAE,MAAM;MAAQ,WAAW,UAAU,GAAG;KAAE,CAAC,CAAC,CAAC;IACnG;;GAEA,SAAuB,QAAQ,QAAQ;GACvC,mBAAiC;GACjC,UAA+B;GAC/B,SAAuB;GACvB,aAAoC;GACpC,kBAAkB;GAElB,aAAa,UAA8B;IACzC,IAAI,KAAKA,WAAW,OAAO;IAC3B,KAAKA,SAAS;IACd,KAAKC,eAAe,SAAS;KAAE;KAAO,UAAU,KAAKC;IAAU,CAAC;IAChE,KAAKC,WAAW;GAClB;GAEA,iBAAiB,cAA2C;IAC1D,IAAI,KAAKC,eAAe,WAAW;IACnC,KAAKA,aAAa;IAClB,KAAKC,mBAAmB,SAAS;KAC/B;KACA,cAAc,KAAKC;IACrB,CAAC;IACD,KAAKH,WAAW;GAClB;GAEA,kBAAkB,IAAI,gBAAgB,MAAM;IAC1C,SAAS,QAAQ;IACjB,cAAc,KAAK;GACrB,CAAC;GAED,iBAAiB,IAAI,gBAAgB,MAAM;IACzC,SAAS,QAAQ;IACjB,cAAc;KAAE,OAAO,KAAKH;KAAQ,UAAU,KAAKE;IAAU;GAC/D,CAAC;GAED,qBAAqB,IAAI,gBAAgB,MAAM;IAC7C,SAAS,QAAQ;IACjB,cAAc;KACZ,WAAW,KAAKE;KAChB,cAAc,KAAKE;IACrB;GACF,CAAC;GAED,IAAI,QAAe;IACjB,IAAI,OAAO,KAAKC,MAAM,GACpB,KAAKA,SAAS,QAAQ,QAAQ;IAGhC,OAAO,KAAKA;GACd;GAEA,oBAA6B;IAC3B,KAAKC,mBAAmB;IACxB,MAAM,kBAAkB;IACxB,KAAKC,gBAAgB,SAAS,KAAK,KAAK;IACxC,KAAKR,eAAe,SAAS;KAAE,OAAO,KAAKD;KAAQ,UAAU,KAAKE;IAAU,CAAC;IAC7E,KAAKG,mBAAmB,SAAS;KAC/B,WAAW,KAAKD;KAChB,cAAc,KAAKE;IACrB,CAAC;IACD,KAAKH,WAAW;IAChB,KAAKO,wBAAwB;GAC/B;GAEA,uBAAgC;IAC9B,MAAM,qBAAqB;IAC3B,KAAKC,aAAa;GACpB;GAEA,kBAA2B;IACzB,KAAKA,aAAa;IAClB,KAAKJ,QAAQ,QAAQ;IACrB,KAAKA,SAAS;IACd,MAAM,gBAAgB;GACxB;GAEA,WAA8B,SAA+B;IAC3D,MAAM,WAAW,OAAO;IAIxB,KAAK,MAAM,OAAO,YAAY;KAC5B,IAAI,CAAC,QAAQ,IAAI,GAAG,GAAG;KACvB,qBAAqB,KAAK,OAAO,QAAQ,OAAO,MAAQ,KAA4C,IAAI;IAC1G;GACF;GAEA,aAAmB;IACjB,MAAM,QAAQ,KAAKA;IACnB,IAAI,CAAC,OAAO;IAEZ,IAAI,CAAC,KAAKP,QAAQ;KAChB,KAAKW,aAAa;KAClB;IACF;IAEA,MAAM,SAAuB;KAC3B,OAAO,KAAKX;KACZ,WAAW,KAAKI;IAClB;IAEA,MAAM,kBAAkB,MAAM,QAAQ,UAAU,OAAO;IACvD,MAAM,sBAAsB,MAAM,QAAQ,cAAc,OAAO;IAE/D,IAAI,mBAAmB,qBAAqB;KAC1C,KAAKO,aAAa;KAClB,KAAKC,UAAU,MAAM,OAAO,MAAM;IACpC;GACF;GAEA,eAAqB;IACnB,KAAKA,UAAU;IACf,KAAKA,UAAU;GACjB;GAEA,qBAA2B;IACzB,MAAM,QAAQ,KAAK;IACnB,IAAI,KAAKC,qBAAqB,OAAO;IAErC,KAAK,MAAM,OAAO,YAChB,qBAAqB,OAAO,QAAQ,OAAO,MAAQ,KAA4C,IAAI;IAErG,KAAKA,mBAAmB;GAC1B;GAEA,0BAAgC;IAC9B,IAAI,KAAKb,UAAU,KAAKc,iBAAiB;IACzC,KAAKA,kBAAkB;IAEvB,qBAAqB;KACnB,KAAKA,kBAAkB;KAGvB,IAAI,KAAKd,QAAQ;KAEjB,MAAM,QAAQ,KAAK,cAAgC,cAAc;KACjE,IAAI,OACF,KAAKE,UAAU,KAAK;IAExB,CAAC;GACH;EACF;EAEA,OAAO;CACT;AACF"}
+{"version":3,"file":"provider-mixin.js","names":["#media","#mediaProvider","#setMedia","#tryAttach","#container","#containerProvider","#setContainer","#store","#syncInitialConfig","#playerProvider","#queueFallbackDiscovery","#detachStore","#detach","#configuredStore","#fallbackQueued"],"sources":["../../../src/store/provider-mixin.ts"],"sourcesContent":["import {\n  type MediaContainer,\n  type PlayerFeatureConfig,\n  type PlayerStore,\n  type PlayerTarget,\n  setPlayerConfigValue,\n} from '@videojs/core/dom';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { ContextProvider } from '@videojs/element/context';\nimport type { Media } from '@videojs/media/dom';\nimport { isNull } from '@videojs/utils/predicate';\nimport { camelCase, kebabCase } from '@videojs/utils/string';\nimport type { MediaElementConstructor } from '@/ui/media-element';\nimport type { ContainerContext, MediaContext, PlayerContext } from '../player/context';\nimport type { PlayerProviderConstructor } from './types';\n\nexport interface ProviderMixinConfig<Store extends PlayerStore> {\n  playerContext: PlayerContext<Store>;\n  mediaContext: MediaContext;\n  containerContext: ContainerContext;\n  factory: () => Store;\n  config: PlayerFeatureConfig;\n}\n\nexport type ProviderMixin<Store extends PlayerStore> = <Class extends MediaElementConstructor>(\n  BaseClass: Class\n) => Class & PlayerProviderConstructor<Store>;\n\n/** One configuration input, under the names it goes by on the element. */\ninterface ConfigInput {\n  /** Reactive property mirroring the attribute. */\n  property: string;\n  attribute: string;\n  entry: PlayerFeatureConfig[string];\n}\n\n/**\n * Name each input on the element. A key whose own name is taken there declares\n * an `html.attribute` instead, and the property follows from that.\n */\nfunction resolveInputs(config: PlayerFeatureConfig): ConfigInput[] {\n  return Object.entries(config).map(([key, entry]) => {\n    const declared = entry.html?.attribute;\n    const attribute = declared ?? kebabCase(key);\n\n    if (__DEV__ && declared && declared !== kebabCase(declared)) {\n      // Markup lowercases attribute names, so an uppercase letter here never matches.\n      console.warn(`[vjs-html] config html.attribute \"${declared}\" is not kebab-case and will never match`);\n    }\n\n    return { property: camelCase(attribute), attribute, entry };\n  });\n}\n\n/**\n * Create a mixin that provides player context to descendant elements and\n * owns the `store.attach()` lifecycle.\n *\n * Media and container elements register themselves via media/container\n * contexts that carry both the current value and a setter. When a media\n * element is available, the provider calls `store.attach({ media, container })`.\n *\n * As a fallback for plain `<video>`/`<audio>` that can't consume context,\n * the provider queries its subtree after a microtask.\n *\n * @param options - Provider options with contexts, store factory, and feature configuration.\n */\nexport function createProviderMixin<Store extends PlayerStore>(\n  options: ProviderMixinConfig<Store>\n): ProviderMixin<Store> {\n  const inputs = resolveInputs(options.config);\n\n  return <Class extends MediaElementConstructor>(BaseClass: Class) => {\n    class PlayerProviderElement extends BaseClass {\n      static properties = {\n        ...(BaseClass as unknown as { properties: PropertyDeclarationMap }).properties,\n        ...Object.fromEntries(inputs.map(({ property, attribute }) => [property, { type: String, attribute }])),\n      };\n\n      #store: Store | null = options.factory();\n      #configuredStore: Store | null = null;\n      #detach: (() => void) | null = null;\n      #media: Media | null = null;\n      #container: MediaContainer | null = null;\n      #fallbackQueued = false;\n\n      #setMedia = (media: Media | null): void => {\n        if (this.#media === media) return;\n        this.#media = media;\n        this.#mediaProvider.setValue({ media, setMedia: this.#setMedia });\n        this.#tryAttach();\n      };\n\n      #setContainer = (container: MediaContainer | null): void => {\n        if (this.#container === container) return;\n        this.#container = container;\n        this.#containerProvider.setValue({\n          container,\n          setContainer: this.#setContainer,\n        });\n        this.#tryAttach();\n      };\n\n      #playerProvider = new ContextProvider(this, {\n        context: options.playerContext,\n        initialValue: this.store,\n      });\n\n      #mediaProvider = new ContextProvider(this, {\n        context: options.mediaContext,\n        initialValue: { media: this.#media, setMedia: this.#setMedia },\n      });\n\n      #containerProvider = new ContextProvider(this, {\n        context: options.containerContext,\n        initialValue: {\n          container: this.#container,\n          setContainer: this.#setContainer,\n        },\n      });\n\n      get store(): Store {\n        if (isNull(this.#store)) {\n          this.#store = options.factory();\n        }\n\n        return this.#store;\n      }\n\n      override connectedCallback() {\n        this.#syncInitialConfig();\n        super.connectedCallback();\n        this.#playerProvider.setValue(this.store);\n        this.#mediaProvider.setValue({ media: this.#media, setMedia: this.#setMedia });\n        this.#containerProvider.setValue({\n          container: this.#container,\n          setContainer: this.#setContainer,\n        });\n        this.#tryAttach();\n        this.#queueFallbackDiscovery();\n      }\n\n      override disconnectedCallback() {\n        super.disconnectedCallback();\n        this.#detachStore();\n      }\n\n      override destroyCallback() {\n        this.#detachStore();\n        this.#store?.destroy();\n        this.#store = null;\n        super.destroyCallback();\n      }\n\n      protected override willUpdate(changed: PropertyValues): void {\n        super.willUpdate(changed);\n\n        // Configuration flows one way: only actual reactive property changes\n        // write to the store. Store-side writers do not reflect back here.\n        for (const { property, entry } of inputs) {\n          if (!changed.has(property)) continue;\n          setPlayerConfigValue(this.store, entry, (this as unknown as Record<string, unknown>)[property]);\n        }\n      }\n\n      #tryAttach(): void {\n        const store = this.#store;\n        if (!store) return;\n\n        if (!this.#media) {\n          this.#detachStore();\n          return;\n        }\n\n        const target: PlayerTarget = {\n          media: this.#media,\n          container: this.#container,\n        };\n\n        const hasMediaChanged = store.target?.media !== target.media;\n        const hasContainerChanged = store.target?.container !== target.container;\n\n        if (hasMediaChanged || hasContainerChanged) {\n          this.#detachStore();\n          this.#detach = store.attach(target);\n        }\n      }\n\n      #detachStore(): void {\n        this.#detach?.();\n        this.#detach = null;\n      }\n\n      #syncInitialConfig(): void {\n        const store = this.store;\n        if (this.#configuredStore === store) return;\n\n        for (const { property, entry } of inputs) {\n          setPlayerConfigValue(store, entry, (this as unknown as Record<string, unknown>)[property]);\n        }\n        this.#configuredStore = store;\n      }\n\n      #queueFallbackDiscovery(): void {\n        if (this.#media || this.#fallbackQueued) return;\n        this.#fallbackQueued = true;\n\n        queueMicrotask(() => {\n          this.#fallbackQueued = false;\n\n          // Context already registered media — skip fallback.\n          if (this.#media) return;\n\n          const media = this.querySelector<HTMLMediaElement>('video, audio');\n          if (media) {\n            this.#setMedia(media);\n          }\n        });\n      }\n    }\n\n    return PlayerProviderElement as unknown as Class & PlayerProviderConstructor<Store>;\n  };\n}\n"],"mappings":";;;;;;;;;AAwCA,SAAS,cAAc,QAA4C;CACjE,OAAO,OAAO,QAAQ,MAAM,CAAC,CAAC,KAAK,CAAC,KAAK,WAAW;EAElD,MAAM,YADW,MAAM,MAAM,aACC,UAAU,GAAG;EAO3C,OAAO;GAAE,UAAU,UAAU,SAAS;GAAG;GAAW;EAAM;CAC5D,CAAC;AACH;;;;;;;;;;;;;;AAeA,SAAgB,oBACd,SACsB;CACtB,MAAM,SAAS,cAAc,QAAQ,MAAM;CAE3C,QAA+C,cAAqB;EAClE,MAAM,8BAA8B,UAAU;;IACxB,KAAA,aAAA;KAClB,GAAI,UAAgE;KACpE,GAAG,OAAO,YAAY,OAAO,KAAK,EAAE,UAAU,gBAAgB,CAAC,UAAU;MAAE,MAAM;MAAQ;KAAU,CAAC,CAAC,CAAC;IACxG;;GAEA,SAAuB,QAAQ,QAAQ;GACvC,mBAAiC;GACjC,UAA+B;GAC/B,SAAuB;GACvB,aAAoC;GACpC,kBAAkB;GAElB,aAAa,UAA8B;IACzC,IAAI,KAAKA,WAAW,OAAO;IAC3B,KAAKA,SAAS;IACd,KAAKC,eAAe,SAAS;KAAE;KAAO,UAAU,KAAKC;IAAU,CAAC;IAChE,KAAKC,WAAW;GAClB;GAEA,iBAAiB,cAA2C;IAC1D,IAAI,KAAKC,eAAe,WAAW;IACnC,KAAKA,aAAa;IAClB,KAAKC,mBAAmB,SAAS;KAC/B;KACA,cAAc,KAAKC;IACrB,CAAC;IACD,KAAKH,WAAW;GAClB;GAEA,kBAAkB,IAAI,gBAAgB,MAAM;IAC1C,SAAS,QAAQ;IACjB,cAAc,KAAK;GACrB,CAAC;GAED,iBAAiB,IAAI,gBAAgB,MAAM;IACzC,SAAS,QAAQ;IACjB,cAAc;KAAE,OAAO,KAAKH;KAAQ,UAAU,KAAKE;IAAU;GAC/D,CAAC;GAED,qBAAqB,IAAI,gBAAgB,MAAM;IAC7C,SAAS,QAAQ;IACjB,cAAc;KACZ,WAAW,KAAKE;KAChB,cAAc,KAAKE;IACrB;GACF,CAAC;GAED,IAAI,QAAe;IACjB,IAAI,OAAO,KAAKC,MAAM,GACpB,KAAKA,SAAS,QAAQ,QAAQ;IAGhC,OAAO,KAAKA;GACd;GAEA,oBAA6B;IAC3B,KAAKC,mBAAmB;IACxB,MAAM,kBAAkB;IACxB,KAAKC,gBAAgB,SAAS,KAAK,KAAK;IACxC,KAAKR,eAAe,SAAS;KAAE,OAAO,KAAKD;KAAQ,UAAU,KAAKE;IAAU,CAAC;IAC7E,KAAKG,mBAAmB,SAAS;KAC/B,WAAW,KAAKD;KAChB,cAAc,KAAKE;IACrB,CAAC;IACD,KAAKH,WAAW;IAChB,KAAKO,wBAAwB;GAC/B;GAEA,uBAAgC;IAC9B,MAAM,qBAAqB;IAC3B,KAAKC,aAAa;GACpB;GAEA,kBAA2B;IACzB,KAAKA,aAAa;IAClB,KAAKJ,QAAQ,QAAQ;IACrB,KAAKA,SAAS;IACd,MAAM,gBAAgB;GACxB;GAEA,WAA8B,SAA+B;IAC3D,MAAM,WAAW,OAAO;IAIxB,KAAK,MAAM,EAAE,UAAU,WAAW,QAAQ;KACxC,IAAI,CAAC,QAAQ,IAAI,QAAQ,GAAG;KAC5B,qBAAqB,KAAK,OAAO,OAAQ,KAA4C,SAAS;IAChG;GACF;GAEA,aAAmB;IACjB,MAAM,QAAQ,KAAKA;IACnB,IAAI,CAAC,OAAO;IAEZ,IAAI,CAAC,KAAKP,QAAQ;KAChB,KAAKW,aAAa;KAClB;IACF;IAEA,MAAM,SAAuB;KAC3B,OAAO,KAAKX;KACZ,WAAW,KAAKI;IAClB;IAEA,MAAM,kBAAkB,MAAM,QAAQ,UAAU,OAAO;IACvD,MAAM,sBAAsB,MAAM,QAAQ,cAAc,OAAO;IAE/D,IAAI,mBAAmB,qBAAqB;KAC1C,KAAKO,aAAa;KAClB,KAAKC,UAAU,MAAM,OAAO,MAAM;IACpC;GACF;GAEA,eAAqB;IACnB,KAAKA,UAAU;IACf,KAAKA,UAAU;GACjB;GAEA,qBAA2B;IACzB,MAAM,QAAQ,KAAK;IACnB,IAAI,KAAKC,qBAAqB,OAAO;IAErC,KAAK,MAAM,EAAE,UAAU,WAAW,QAChC,qBAAqB,OAAO,OAAQ,KAA4C,SAAS;IAE3F,KAAKA,mBAAmB;GAC1B;GAEA,0BAAgC;IAC9B,IAAI,KAAKb,UAAU,KAAKc,iBAAiB;IACzC,KAAKA,kBAAkB;IAEvB,qBAAqB;KACnB,KAAKA,kBAAkB;KAGvB,IAAI,KAAKd,QAAQ;KAEjB,MAAM,QAAQ,KAAK,cAAgC,cAAc;KACjE,IAAI,OACF,KAAKE,UAAU,KAAK;IAExB,CAAC;GACH;EACF;EAEA,OAAO;CACT;AACF"}

package/dist/default/ui/audio-track-radio-group/audio-track-radio-group-element.js

@@ -56,7 +56,7 @@ var AudioTrackRadioGroupElement = class extends MenuRadioGroupElement {
 			state = this.#core.getState();
 			this.applyDefaultAriaLabel(translateText(this.#core.getLabel(state), this.#i18n.value));
 			this.#options.sync(state, this.#i18n.value, this.#i18n.locale);
-			this.publishMenuMetadata(state.disabled, state.availability);
+			this.publishMenuTriggerState(state.disabled, state.availability);
 		}
 		super.update(changed);
 		if (state) applyStateDataAttrs(this, state, AudioTrackRadioGroupDataAttrs);

package/dist/default/ui/audio-track-radio-group/audio-track-radio-group-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"audio-track-radio-group-element.js","names":["#mediaState","#core","#i18n","#options"],"sources":["../../../../src/ui/audio-track-radio-group/audio-track-radio-group-element.ts"],"sourcesContent":["import {\n  AudioTrackRadioGroupCore,\n  AudioTrackRadioGroupDataAttrs,\n  type AudioTrackRadioGroupOption,\n} from '@videojs/core';\nimport { applyStateDataAttrs, logMissingFeature, selectAudioTrack } from '@videojs/core/dom';\nimport { type Text, translateText } from '@videojs/core/i18n';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { i18nContext } from '../../i18n/context';\nimport { I18nController } from '../../i18n/controller';\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MenuRadioGroupElement } from '../menu/menu-radio-group-element';\nimport { RadioOptionsController } from '../radio-options/radio-options-controller';\n\nexport class AudioTrackRadioGroupElement extends MenuRadioGroupElement {\n  static override readonly tagName = 'media-audio-track-radio-group';\n\n  static override properties = {\n    ...MenuRadioGroupElement.properties,\n    disabled: { type: Boolean },\n    label: { type: String },\n  } satisfies PropertyDeclarationMap<'value' | 'label' | 'disabled'>;\n\n  disabled = false;\n  label: Text | string = '';\n  formatTrack = AudioTrackRadioGroupCore.defaultProps.formatTrack;\n\n  readonly #core = new AudioTrackRadioGroupCore();\n  readonly #i18n = new I18nController(this, i18nContext);\n  readonly #mediaState = new PlayerController(this, playerContext, selectAudioTrack);\n  readonly #options = new RadioOptionsController<AudioTrackRadioGroupOption>(this, {\n    setItemAttributes: (item, option) => item.setAttribute('data-track', option.value),\n    onValueChange: (value) => {\n      const media = this.#mediaState.value;\n      if (media) this.#core.selectValue(media, value);\n    },\n  });\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    if (__DEV__ && !this.#mediaState.value && this.#mediaState.displayName) {\n      logMissingFeature(this.localName, this.#mediaState.displayName);\n    }\n  }\n\n  protected override update(changed: PropertyValues): void {\n    const media = this.#mediaState.value;\n    let state: AudioTrackRadioGroupCore.State | null = null;\n\n    if (media) {\n      this.#core.setProps({ formatTrack: this.formatTrack, disabled: this.disabled, label: this.label });\n      this.#core.setMedia(media);\n      state = this.#core.getState();\n\n      this.applyDefaultAriaLabel(translateText(this.#core.getLabel(state), this.#i18n.value));\n      this.#options.sync(state, this.#i18n.value, this.#i18n.locale);\n      this.publishMenuMetadata(state.disabled, state.availability);\n    }\n\n    super.update(changed);\n\n    if (state) applyStateDataAttrs(this, state, AudioTrackRadioGroupDataAttrs);\n  }\n}\n\nexport namespace AudioTrackRadioGroupElement {\n  export type State = AudioTrackRadioGroupCore.State;\n}\n"],"mappings":";;;;;;;;;;AAeA,IAAa,8BAAb,cAAiD,sBAAsB;;;EAS1D,KAAA,WAAA;EACY,KAAA,QAAA;EACT,KAAA,cAAA,yBAAyB,aAAa;EAEnC,KAAA,QAAA,IAAI,yBAAyB;EAC7B,KAAA,QAAA,IAAI,eAAe,MAAM,WAAW;EAC9B,KAAA,cAAA,IAAI,iBAAiB,MAAM,eAAe,gBAAgB;EAC7D,KAAA,WAAA,IAAI,uBAAmD,MAAM;GAC/E,oBAAoB,MAAM,WAAW,KAAK,aAAa,cAAc,OAAO,KAAK;GACjF,gBAAgB,UAAU;IACxB,MAAM,QAAQ,KAAKA,YAAY;IAC/B,IAAI,OAAO,KAAKC,MAAM,YAAY,OAAO,KAAK;GAChD;EACF,CAAC;;;EArBkC,KAAA,UAAA;;;EAEN,KAAA,aAAA;GAC3B,GAAG,sBAAsB;GACzB,UAAU,EAAE,MAAM,QAAQ;GAC1B,OAAO,EAAE,MAAM,OAAO;EACxB;;CAMA;CACA;CACA;CACA;CAQA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,IAAI,KAAK,WAAW;CAKtB;CAEA,OAA0B,SAA+B;EACvD,MAAM,QAAQ,KAAKD,YAAY;EAC/B,IAAI,QAA+C;EAEnD,IAAI,OAAO;GACT,KAAKC,MAAM,SAAS;IAAE,aAAa,KAAK;IAAa,UAAU,KAAK;IAAU,OAAO,KAAK;GAAM,CAAC;GACjG,KAAKA,MAAM,SAAS,KAAK;GACzB,QAAQ,KAAKA,MAAM,SAAS;GAE5B,KAAK,sBAAsB,cAAc,KAAKA,MAAM,SAAS,KAAK,GAAG,KAAKC,MAAM,KAAK,CAAC;GACtF,KAAKC,SAAS,KAAK,OAAO,KAAKD,MAAM,OAAO,KAAKA,MAAM,MAAM;GAC7D,KAAK,oBAAoB,MAAM,UAAU,MAAM,YAAY;EAC7D;EAEA,MAAM,OAAO,OAAO;EAEpB,IAAI,OAAO,oBAAoB,MAAM,OAAO,6BAA6B;CAC3E;AACF"}
+{"version":3,"file":"audio-track-radio-group-element.js","names":["#mediaState","#core","#i18n","#options"],"sources":["../../../../src/ui/audio-track-radio-group/audio-track-radio-group-element.ts"],"sourcesContent":["import {\n  AudioTrackRadioGroupCore,\n  AudioTrackRadioGroupDataAttrs,\n  type AudioTrackRadioGroupOption,\n} from '@videojs/core';\nimport { applyStateDataAttrs, logMissingFeature, selectAudioTrack } from '@videojs/core/dom';\nimport { type Text, translateText } from '@videojs/core/i18n';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { i18nContext } from '../../i18n/context';\nimport { I18nController } from '../../i18n/controller';\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MenuRadioGroupElement } from '../menu/menu-radio-group-element';\nimport { RadioOptionsController } from '../radio-options/radio-options-controller';\n\nexport class AudioTrackRadioGroupElement extends MenuRadioGroupElement {\n  static override readonly tagName = 'media-audio-track-radio-group';\n\n  static override properties = {\n    ...MenuRadioGroupElement.properties,\n    disabled: { type: Boolean },\n    label: { type: String },\n  } satisfies PropertyDeclarationMap<'value' | 'label' | 'disabled'>;\n\n  disabled = false;\n  label: Text | string = '';\n  formatTrack = AudioTrackRadioGroupCore.defaultProps.formatTrack;\n\n  readonly #core = new AudioTrackRadioGroupCore();\n  readonly #i18n = new I18nController(this, i18nContext);\n  readonly #mediaState = new PlayerController(this, playerContext, selectAudioTrack);\n  readonly #options = new RadioOptionsController<AudioTrackRadioGroupOption>(this, {\n    setItemAttributes: (item, option) => item.setAttribute('data-track', option.value),\n    onValueChange: (value) => {\n      const media = this.#mediaState.value;\n      if (media) this.#core.selectValue(media, value);\n    },\n  });\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    if (__DEV__ && !this.#mediaState.value && this.#mediaState.displayName) {\n      logMissingFeature(this.localName, this.#mediaState.displayName);\n    }\n  }\n\n  protected override update(changed: PropertyValues): void {\n    const media = this.#mediaState.value;\n    let state: AudioTrackRadioGroupCore.State | null = null;\n\n    if (media) {\n      this.#core.setProps({ formatTrack: this.formatTrack, disabled: this.disabled, label: this.label });\n      this.#core.setMedia(media);\n      state = this.#core.getState();\n\n      this.applyDefaultAriaLabel(translateText(this.#core.getLabel(state), this.#i18n.value));\n      this.#options.sync(state, this.#i18n.value, this.#i18n.locale);\n      this.publishMenuTriggerState(state.disabled, state.availability);\n    }\n\n    super.update(changed);\n\n    if (state) applyStateDataAttrs(this, state, AudioTrackRadioGroupDataAttrs);\n  }\n}\n\nexport namespace AudioTrackRadioGroupElement {\n  export type State = AudioTrackRadioGroupCore.State;\n}\n"],"mappings":";;;;;;;;;;AAeA,IAAa,8BAAb,cAAiD,sBAAsB;;;EAS1D,KAAA,WAAA;EACY,KAAA,QAAA;EACT,KAAA,cAAA,yBAAyB,aAAa;EAEnC,KAAA,QAAA,IAAI,yBAAyB;EAC7B,KAAA,QAAA,IAAI,eAAe,MAAM,WAAW;EAC9B,KAAA,cAAA,IAAI,iBAAiB,MAAM,eAAe,gBAAgB;EAC7D,KAAA,WAAA,IAAI,uBAAmD,MAAM;GAC/E,oBAAoB,MAAM,WAAW,KAAK,aAAa,cAAc,OAAO,KAAK;GACjF,gBAAgB,UAAU;IACxB,MAAM,QAAQ,KAAKA,YAAY;IAC/B,IAAI,OAAO,KAAKC,MAAM,YAAY,OAAO,KAAK;GAChD;EACF,CAAC;;;EArBkC,KAAA,UAAA;;;EAEN,KAAA,aAAA;GAC3B,GAAG,sBAAsB;GACzB,UAAU,EAAE,MAAM,QAAQ;GAC1B,OAAO,EAAE,MAAM,OAAO;EACxB;;CAMA;CACA;CACA;CACA;CAQA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,IAAI,KAAK,WAAW;CAKtB;CAEA,OAA0B,SAA+B;EACvD,MAAM,QAAQ,KAAKD,YAAY;EAC/B,IAAI,QAA+C;EAEnD,IAAI,OAAO;GACT,KAAKC,MAAM,SAAS;IAAE,aAAa,KAAK;IAAa,UAAU,KAAK;IAAU,OAAO,KAAK;GAAM,CAAC;GACjG,KAAKA,MAAM,SAAS,KAAK;GACzB,QAAQ,KAAKA,MAAM,SAAS;GAE5B,KAAK,sBAAsB,cAAc,KAAKA,MAAM,SAAS,KAAK,GAAG,KAAKC,MAAM,KAAK,CAAC;GACtF,KAAKC,SAAS,KAAK,OAAO,KAAKD,MAAM,OAAO,KAAKA,MAAM,MAAM;GAC7D,KAAK,wBAAwB,MAAM,UAAU,MAAM,YAAY;EACjE;EAEA,MAAM,OAAO,OAAO;EAEpB,IAAI,OAAO,oBAAoB,MAAM,OAAO,6BAA6B;CAC3E;AACF"}

package/dist/default/ui/captions-radio-group/captions-radio-group-element.js

@@ -56,7 +56,7 @@ var CaptionsRadioGroupElement = class extends MenuRadioGroupElement {
 			state = this.#core.getState();
 			this.applyDefaultAriaLabel(translateText(this.#core.getLabel(state), this.#i18n.value));
 			this.#options.sync(state, this.#i18n.value, this.#i18n.locale);
-			this.publishMenuMetadata(state.disabled, state.availability);
+			this.publishMenuTriggerState(state.disabled, state.availability);
 		}
 		super.update(changed);
 		if (state) applyStateDataAttrs(this, state, CaptionsRadioGroupDataAttrs);

package/dist/default/ui/captions-radio-group/captions-radio-group-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"captions-radio-group-element.js","names":["#mediaState","#core","#i18n","#options"],"sources":["../../../../src/ui/captions-radio-group/captions-radio-group-element.ts"],"sourcesContent":["import { CaptionsRadioGroupCore, CaptionsRadioGroupDataAttrs, type CaptionsRadioGroupOption } from '@videojs/core';\nimport { applyStateDataAttrs, logMissingFeature, selectTextTrack } from '@videojs/core/dom';\nimport { type Text, translateText } from '@videojs/core/i18n';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { i18nContext } from '../../i18n/context';\nimport { I18nController } from '../../i18n/controller';\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MenuRadioGroupElement } from '../menu/menu-radio-group-element';\nimport { RadioOptionsController } from '../radio-options/radio-options-controller';\n\nexport class CaptionsRadioGroupElement extends MenuRadioGroupElement {\n  static override readonly tagName = 'media-captions-radio-group';\n\n  static override properties = {\n    ...MenuRadioGroupElement.properties,\n    disabled: { type: Boolean },\n    label: { type: String },\n  } satisfies PropertyDeclarationMap<'value' | 'label' | 'disabled'>;\n\n  disabled = false;\n  label: Text | string = '';\n  formatTrack = CaptionsRadioGroupCore.defaultProps.formatTrack;\n\n  readonly #core = new CaptionsRadioGroupCore();\n  readonly #i18n = new I18nController(this, i18nContext);\n  readonly #mediaState = new PlayerController(this, playerContext, selectTextTrack);\n  readonly #options = new RadioOptionsController<CaptionsRadioGroupOption>(this, {\n    setItemAttributes: (item, option) => item.setAttribute('data-track', option.value),\n    onValueChange: (value) => {\n      const media = this.#mediaState.value;\n      if (media) this.#core.selectValue(media, value);\n    },\n  });\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    if (__DEV__ && !this.#mediaState.value && this.#mediaState.displayName) {\n      logMissingFeature(this.localName, this.#mediaState.displayName);\n    }\n  }\n\n  protected override update(changed: PropertyValues): void {\n    const media = this.#mediaState.value;\n    let state: CaptionsRadioGroupCore.State | null = null;\n\n    if (media) {\n      this.#core.setProps({ formatTrack: this.formatTrack, disabled: this.disabled, label: this.label });\n      this.#core.setMedia(media);\n      state = this.#core.getState();\n\n      this.applyDefaultAriaLabel(translateText(this.#core.getLabel(state), this.#i18n.value));\n      this.#options.sync(state, this.#i18n.value, this.#i18n.locale);\n      this.publishMenuMetadata(state.disabled, state.availability);\n    }\n\n    super.update(changed);\n\n    if (state) applyStateDataAttrs(this, state, CaptionsRadioGroupDataAttrs);\n  }\n}\n\nexport namespace CaptionsRadioGroupElement {\n  export type State = CaptionsRadioGroupCore.State;\n}\n"],"mappings":";;;;;;;;;;AAWA,IAAa,4BAAb,cAA+C,sBAAsB;;;EASxD,KAAA,WAAA;EACY,KAAA,QAAA;EACT,KAAA,cAAA,uBAAuB,aAAa;EAEjC,KAAA,QAAA,IAAI,uBAAuB;EAC3B,KAAA,QAAA,IAAI,eAAe,MAAM,WAAW;EAC9B,KAAA,cAAA,IAAI,iBAAiB,MAAM,eAAe,eAAe;EAC5D,KAAA,WAAA,IAAI,uBAAiD,MAAM;GAC7E,oBAAoB,MAAM,WAAW,KAAK,aAAa,cAAc,OAAO,KAAK;GACjF,gBAAgB,UAAU;IACxB,MAAM,QAAQ,KAAKA,YAAY;IAC/B,IAAI,OAAO,KAAKC,MAAM,YAAY,OAAO,KAAK;GAChD;EACF,CAAC;;;EArBkC,KAAA,UAAA;;;EAEN,KAAA,aAAA;GAC3B,GAAG,sBAAsB;GACzB,UAAU,EAAE,MAAM,QAAQ;GAC1B,OAAO,EAAE,MAAM,OAAO;EACxB;;CAMA;CACA;CACA;CACA;CAQA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,IAAI,KAAK,WAAW;CAKtB;CAEA,OAA0B,SAA+B;EACvD,MAAM,QAAQ,KAAKD,YAAY;EAC/B,IAAI,QAA6C;EAEjD,IAAI,OAAO;GACT,KAAKC,MAAM,SAAS;IAAE,aAAa,KAAK;IAAa,UAAU,KAAK;IAAU,OAAO,KAAK;GAAM,CAAC;GACjG,KAAKA,MAAM,SAAS,KAAK;GACzB,QAAQ,KAAKA,MAAM,SAAS;GAE5B,KAAK,sBAAsB,cAAc,KAAKA,MAAM,SAAS,KAAK,GAAG,KAAKC,MAAM,KAAK,CAAC;GACtF,KAAKC,SAAS,KAAK,OAAO,KAAKD,MAAM,OAAO,KAAKA,MAAM,MAAM;GAC7D,KAAK,oBAAoB,MAAM,UAAU,MAAM,YAAY;EAC7D;EAEA,MAAM,OAAO,OAAO;EAEpB,IAAI,OAAO,oBAAoB,MAAM,OAAO,2BAA2B;CACzE;AACF"}
+{"version":3,"file":"captions-radio-group-element.js","names":["#mediaState","#core","#i18n","#options"],"sources":["../../../../src/ui/captions-radio-group/captions-radio-group-element.ts"],"sourcesContent":["import { CaptionsRadioGroupCore, CaptionsRadioGroupDataAttrs, type CaptionsRadioGroupOption } from '@videojs/core';\nimport { applyStateDataAttrs, logMissingFeature, selectTextTrack } from '@videojs/core/dom';\nimport { type Text, translateText } from '@videojs/core/i18n';\nimport type { PropertyDeclarationMap, PropertyValues } from '@videojs/element';\nimport { i18nContext } from '../../i18n/context';\nimport { I18nController } from '../../i18n/controller';\nimport { playerContext } from '../../player/context';\nimport { PlayerController } from '../../player/player-controller';\nimport { MenuRadioGroupElement } from '../menu/menu-radio-group-element';\nimport { RadioOptionsController } from '../radio-options/radio-options-controller';\n\nexport class CaptionsRadioGroupElement extends MenuRadioGroupElement {\n  static override readonly tagName = 'media-captions-radio-group';\n\n  static override properties = {\n    ...MenuRadioGroupElement.properties,\n    disabled: { type: Boolean },\n    label: { type: String },\n  } satisfies PropertyDeclarationMap<'value' | 'label' | 'disabled'>;\n\n  disabled = false;\n  label: Text | string = '';\n  formatTrack = CaptionsRadioGroupCore.defaultProps.formatTrack;\n\n  readonly #core = new CaptionsRadioGroupCore();\n  readonly #i18n = new I18nController(this, i18nContext);\n  readonly #mediaState = new PlayerController(this, playerContext, selectTextTrack);\n  readonly #options = new RadioOptionsController<CaptionsRadioGroupOption>(this, {\n    setItemAttributes: (item, option) => item.setAttribute('data-track', option.value),\n    onValueChange: (value) => {\n      const media = this.#mediaState.value;\n      if (media) this.#core.selectValue(media, value);\n    },\n  });\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    if (this.destroyed) return;\n\n    if (__DEV__ && !this.#mediaState.value && this.#mediaState.displayName) {\n      logMissingFeature(this.localName, this.#mediaState.displayName);\n    }\n  }\n\n  protected override update(changed: PropertyValues): void {\n    const media = this.#mediaState.value;\n    let state: CaptionsRadioGroupCore.State | null = null;\n\n    if (media) {\n      this.#core.setProps({ formatTrack: this.formatTrack, disabled: this.disabled, label: this.label });\n      this.#core.setMedia(media);\n      state = this.#core.getState();\n\n      this.applyDefaultAriaLabel(translateText(this.#core.getLabel(state), this.#i18n.value));\n      this.#options.sync(state, this.#i18n.value, this.#i18n.locale);\n      this.publishMenuTriggerState(state.disabled, state.availability);\n    }\n\n    super.update(changed);\n\n    if (state) applyStateDataAttrs(this, state, CaptionsRadioGroupDataAttrs);\n  }\n}\n\nexport namespace CaptionsRadioGroupElement {\n  export type State = CaptionsRadioGroupCore.State;\n}\n"],"mappings":";;;;;;;;;;AAWA,IAAa,4BAAb,cAA+C,sBAAsB;;;EASxD,KAAA,WAAA;EACY,KAAA,QAAA;EACT,KAAA,cAAA,uBAAuB,aAAa;EAEjC,KAAA,QAAA,IAAI,uBAAuB;EAC3B,KAAA,QAAA,IAAI,eAAe,MAAM,WAAW;EAC9B,KAAA,cAAA,IAAI,iBAAiB,MAAM,eAAe,eAAe;EAC5D,KAAA,WAAA,IAAI,uBAAiD,MAAM;GAC7E,oBAAoB,MAAM,WAAW,KAAK,aAAa,cAAc,OAAO,KAAK;GACjF,gBAAgB,UAAU;IACxB,MAAM,QAAQ,KAAKA,YAAY;IAC/B,IAAI,OAAO,KAAKC,MAAM,YAAY,OAAO,KAAK;GAChD;EACF,CAAC;;;EArBkC,KAAA,UAAA;;;EAEN,KAAA,aAAA;GAC3B,GAAG,sBAAsB;GACzB,UAAU,EAAE,MAAM,QAAQ;GAC1B,OAAO,EAAE,MAAM,OAAO;EACxB;;CAMA;CACA;CACA;CACA;CAQA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,IAAI,KAAK,WAAW;CAKtB;CAEA,OAA0B,SAA+B;EACvD,MAAM,QAAQ,KAAKD,YAAY;EAC/B,IAAI,QAA6C;EAEjD,IAAI,OAAO;GACT,KAAKC,MAAM,SAAS;IAAE,aAAa,KAAK;IAAa,UAAU,KAAK;IAAU,OAAO,KAAK;GAAM,CAAC;GACjG,KAAKA,MAAM,SAAS,KAAK;GACzB,QAAQ,KAAKA,MAAM,SAAS;GAE5B,KAAK,sBAAsB,cAAc,KAAKA,MAAM,SAAS,KAAK,GAAG,KAAKC,MAAM,KAAK,CAAC;GACtF,KAAKC,SAAS,KAAK,OAAO,KAAKD,MAAM,OAAO,KAAKA,MAAM,MAAM;GAC7D,KAAK,wBAAwB,MAAM,UAAU,MAAM,YAAY;EACjE;EAEA,MAAM,OAAO,OAAO;EAEpB,IAAI,OAAO,oBAAoB,MAAM,OAAO,2BAA2B;CACzE;AACF"}

package/dist/default/ui/gesture/gesture-element.js.map

@@ -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      value: this.value,\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;;;EAYH,KAAA,OAAA;EACA,KAAA,SAAA;EAChB,KAAA,QAAA,KAAA;EACc,KAAA,UAAA,KAAA;EACN,KAAA,SAAA,KAAA;EACzB,KAAA,WAAA;EAEQ,KAAA,UAAA,IAAI,iBAAiB,MAAM,aAAa;EACrC,KAAA,aAAA,IAAI,gBAAgB,MAAM;GAC9C,SAAS;GACT,gBAAgB,KAAK,cAAc;GACnC,WAAW;EACb,CAAC;EAC+B,KAAA,WAAA;;;EAxBN,KAAA,UAAA;;;EAE2B,KAAA,aAAA;GACnD,MAAM,EAAE,MAAM,OAAO;GACrB,QAAQ,EAAE,MAAM,OAAO;GACvB,OAAO,EAAE,MAAM,OAAO;GACtB,SAAS,EAAE,MAAM,OAAO;GACxB,QAAQ,EAAE,MAAM,OAAO;GACvB,UAAU,EAAE,MAAM,QAAQ;EAC5B;;CASA;CACA;CAKA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAK,MAAM,UAAU;EACrB,KAAKE,UAAU;CACjB;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKC,YAAY;CACnB;CAEA,OAA0B,SAA+B;EACvD,MAAM,OAAO,OAAO;EAGpB,IAAI,KAAK,aAAa;GACpB,KAAKA,YAAY;GACjB,KAAKD,UAAU;EACjB;CACF;CAEA,YAAkB;EAChB,MAAM,QAAQ,KAAKF,QAAQ;EAC3B,MAAM,YAAY,KAAKC,WAAW,OAAO;EACzC,IAAI,CAAC,KAAK,QAAQ,CAAC,KAAK,UAAU,CAAC,SAAS,CAAC,WAAW;EAExD,MAAM,WAAW,qBAAqB,KAAK,MAAM;EACjD,IAAI,CAAC,UAAU;EAEf,MAAM,EAAE,UAAU;EAElB,MAAM,cAAc,UAAwB;GAC1C,SAAS;IAAE;IAAO;IAAO;GAAM,CAAC;EAClC;EAEA,MAAM,UAAU;GACd,SAAS,KAAK;GACd,QAAQ,KAAK;GACb,UAAU,KAAK;GACf,QAAQ,KAAK;GACb,OAAO,KAAK;EACd;EAEA,IAAI,KAAK,SAAS,aAChB,KAAKG,WAAW,uBAAuB,WAAW,YAAY,OAAO;OAErE,KAAKA,WAAW,iBAAiB,WAAW,YAAY,OAAO;CAEnE;CAEA,cAAoB;EAClB,KAAKA,WAAW;EAChB,KAAKA,WAAW;CAClB;AACF"}
+{"version":3,"file":"gesture-element.js","names":["#player","#container","#register","#unregister","#cleanup"],"sources":["../../../../src/ui/gesture/gesture-element.ts"],"sourcesContent":["import type { GestureProps } from '@videojs/core';\nimport { createDoubleTapGesture, createTapGesture, resolveGestureAction } 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: GestureProps['type'] | '' = '';\n  action: GestureProps['action'] = '';\n  value: GestureProps['value'] = undefined;\n  pointer: GestureProps['pointer'] = undefined;\n  region: GestureProps['region'] = undefined;\n  disabled: NonNullable<GestureProps['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      value: this.value,\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":";;;;;;AASA,IAAa,iBAAb,cAAoC,aAAa;;;EAYb,KAAA,OAAA;EACD,KAAA,SAAA;EACF,KAAA,QAAA,KAAA;EACI,KAAA,UAAA,KAAA;EACF,KAAA,SAAA,KAAA;EACiB,KAAA,WAAA;EAE/B,KAAA,UAAA,IAAI,iBAAiB,MAAM,aAAa;EACrC,KAAA,aAAA,IAAI,gBAAgB,MAAM;GAC9C,SAAS;GACT,gBAAgB,KAAK,cAAc;GACnC,WAAW;EACb,CAAC;EAC+B,KAAA,WAAA;;;EAxBN,KAAA,UAAA;;;EAE2B,KAAA,aAAA;GACnD,MAAM,EAAE,MAAM,OAAO;GACrB,QAAQ,EAAE,MAAM,OAAO;GACvB,OAAO,EAAE,MAAM,OAAO;GACtB,SAAS,EAAE,MAAM,OAAO;GACxB,QAAQ,EAAE,MAAM,OAAO;GACvB,UAAU,EAAE,MAAM,QAAQ;EAC5B;;CASA;CACA;CAKA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAK,MAAM,UAAU;EACrB,KAAKE,UAAU;CACjB;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKC,YAAY;CACnB;CAEA,OAA0B,SAA+B;EACvD,MAAM,OAAO,OAAO;EAGpB,IAAI,KAAK,aAAa;GACpB,KAAKA,YAAY;GACjB,KAAKD,UAAU;EACjB;CACF;CAEA,YAAkB;EAChB,MAAM,QAAQ,KAAKF,QAAQ;EAC3B,MAAM,YAAY,KAAKC,WAAW,OAAO;EACzC,IAAI,CAAC,KAAK,QAAQ,CAAC,KAAK,UAAU,CAAC,SAAS,CAAC,WAAW;EAExD,MAAM,WAAW,qBAAqB,KAAK,MAAM;EACjD,IAAI,CAAC,UAAU;EAEf,MAAM,EAAE,UAAU;EAElB,MAAM,cAAc,UAAwB;GAC1C,SAAS;IAAE;IAAO;IAAO;GAAM,CAAC;EAClC;EAEA,MAAM,UAAU;GACd,SAAS,KAAK;GACd,QAAQ,KAAK;GACb,UAAU,KAAK;GACf,QAAQ,KAAK;GACb,OAAO,KAAK;EACd;EAEA,IAAI,KAAK,SAAS,aAChB,KAAKG,WAAW,uBAAuB,WAAW,YAAY,OAAO;OAErE,KAAKA,WAAW,iBAAiB,WAAW,YAAY,OAAO;CAEnE;CAEA,cAAoB;EAClB,KAAKA,WAAW;EAChB,KAAKA,WAAW;CAClB;AACF"}

package/dist/default/ui/hotkey/hotkey-element.js.map

@@ -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      value,\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;;;EAWvC,KAAA,OAAA;EACoC,KAAA,SAAA;EACf,KAAA,QAAA,KAAA;EACjB,KAAA,WAAA;EACqB,KAAA,SAAA;EAEb,KAAA,UAAA,IAAI,iBAAiB,MAAM,aAAa;EACrC,KAAA,aAAA,IAAI,gBAAgB,MAAM;GAC9C,SAAS;GACT,gBAAgB,KAAK,cAAc;GACnC,WAAW;EACb,CAAC;EAC+B,KAAA,WAAA;;;EAtBN,KAAA,UAAA;;;EAE2B,KAAA,aAAA;GACnD,MAAM,EAAE,MAAM,OAAO;GACrB,QAAQ,EAAE,MAAM,OAAO;GACvB,OAAO,EAAE,MAAM,OAAO;GACtB,UAAU,EAAE,MAAM,QAAQ;GAC1B,QAAQ,EAAE,MAAM,OAAO;EACzB;;CAQA;CACA;CAKA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAK,MAAM,UAAU;EACrB,KAAKE,UAAU;CACjB;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKC,YAAY;CACnB;CAEA,OAA0B,SAA+B;EACvD,MAAM,OAAO,OAAO;EAGpB,IAAI,KAAK,aAAa;GACpB,KAAKA,YAAY;GACjB,KAAKD,UAAU;EACjB;CACF;CAEA,YAAkB;EAChB,MAAM,QAAQ,KAAKF,QAAQ;EAC3B,MAAM,YAAY,KAAKC,WAAW,OAAO;EACzC,IAAI,CAAC,KAAK,QAAQ,CAAC,KAAK,UAAU,CAAC,SAAS,CAAC,WAAW;EAExD,MAAM,WAAW,oBAAoB,KAAK,MAAM;EAChD,IAAI,CAAC,UAAU;EAEf,MAAM,EAAE,OAAO,WAAW;EAE1B,KAAKG,WAAW,aAAa,WAAW;GACtC,MAAM,KAAK;GACX;GACA;GACA,QAAQ,KAAK;GACb,UAAU,KAAK;GACf,YAAY,CAAC,qBAAqB,MAAM;GACxC,aAAa,QAAQ,QAAQ;IAC3B,SAAS;KAAE;KAAO;KAAK;IAAM,CAAC;GAChC;EACF,CAAC;CACH;CAEA,cAAoB;EAClB,KAAKA,WAAW;EAChB,KAAKA,WAAW;CAClB;AACF"}
+{"version":3,"file":"hotkey-element.js","names":["#player","#container","#register","#unregister","#cleanup"],"sources":["../../../../src/ui/hotkey/hotkey-element.ts"],"sourcesContent":["import type { HotkeyProps } from '@videojs/core';\nimport { createHotkey, 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: HotkeyProps['keys'] = '';\n  action: HotkeyProps['action'] = '';\n  value: HotkeyProps['value'] = undefined;\n  disabled: NonNullable<HotkeyProps['disabled']> = false;\n  target: NonNullable<HotkeyProps['target']> = '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      value,\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":";;;;;;AASA,IAAa,gBAAb,cAAmC,aAAa;;;EAWlB,KAAA,OAAA;EACI,KAAA,SAAA;EACF,KAAA,QAAA,KAAA;EACmB,KAAA,WAAA;EACJ,KAAA,SAAA;EAE1B,KAAA,UAAA,IAAI,iBAAiB,MAAM,aAAa;EACrC,KAAA,aAAA,IAAI,gBAAgB,MAAM;GAC9C,SAAS;GACT,gBAAgB,KAAK,cAAc;GACnC,WAAW;EACb,CAAC;EAC+B,KAAA,WAAA;;;EAtBN,KAAA,UAAA;;;EAE2B,KAAA,aAAA;GACnD,MAAM,EAAE,MAAM,OAAO;GACrB,QAAQ,EAAE,MAAM,OAAO;GACvB,OAAO,EAAE,MAAM,OAAO;GACtB,UAAU,EAAE,MAAM,QAAQ;GAC1B,QAAQ,EAAE,MAAM,OAAO;EACzB;;CAQA;CACA;CAKA;CAEA,oBAAmC;EACjC,MAAM,kBAAkB;EACxB,KAAK,MAAM,UAAU;EACrB,KAAKE,UAAU;CACjB;CAEA,uBAAsC;EACpC,MAAM,qBAAqB;EAC3B,KAAKC,YAAY;CACnB;CAEA,OAA0B,SAA+B;EACvD,MAAM,OAAO,OAAO;EAGpB,IAAI,KAAK,aAAa;GACpB,KAAKA,YAAY;GACjB,KAAKD,UAAU;EACjB;CACF;CAEA,YAAkB;EAChB,MAAM,QAAQ,KAAKF,QAAQ;EAC3B,MAAM,YAAY,KAAKC,WAAW,OAAO;EACzC,IAAI,CAAC,KAAK,QAAQ,CAAC,KAAK,UAAU,CAAC,SAAS,CAAC,WAAW;EAExD,MAAM,WAAW,oBAAoB,KAAK,MAAM;EAChD,IAAI,CAAC,UAAU;EAEf,MAAM,EAAE,OAAO,WAAW;EAE1B,KAAKG,WAAW,aAAa,WAAW;GACtC,MAAM,KAAK;GACX;GACA;GACA,QAAQ,KAAK;GACb,UAAU,KAAK;GACf,YAAY,CAAC,qBAAqB,MAAM;GACxC,aAAa,QAAQ,QAAQ;IAC3B,SAAS;KAAE;KAAO;KAAK;IAAM,CAAC;GAChC;EACF,CAAC;CACH;CAEA,cAAoB;EAClB,KAAKA,WAAW;EAChB,KAAKA,WAAW;CAClB;AACF"}

package/dist/default/ui/menu/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/menu/context.ts"],"sourcesContent":["import type { MenuState, StateAttrMap } from '@videojs/core';\nimport type { MenuApi } from '@videojs/core/dom';\nimport { createContext } from '@videojs/element/context';\n\nexport interface MenuContextValue {\n  menu: MenuApi;\n  state: MenuState;\n  stateAttrMap: StateAttrMap<MenuState>;\n  /** Publish generic display and interaction state to this submenu's trigger. */\n  setTriggerMetadata: (metadata: MenuTriggerMetadata) => void;\n}\n\nexport interface MenuTriggerMetadata {\n  hint: string;\n  disabled: boolean;\n  availability?: 'available' | 'unavailable' | 'unsupported' | undefined;\n}\n\nexport interface MenuGroupContextValue {\n  registerLabel: (id: string) => () => void;\n}\n\nconst MENU_CONTEXT_KEY = Symbol('@videojs/menu');\nconst MENU_GROUP_CONTEXT_KEY = Symbol('@videojs/menu-group');\n\nexport const menuContext = createContext<MenuContextValue>(MENU_CONTEXT_KEY);\nexport const menuGroupContext = createContext<MenuGroupContextValue>(MENU_GROUP_CONTEXT_KEY);\n\nexport {\n  type RadioGroupContextValue as MenuRadioGroupContextValue,\n  radioGroupContext as menuRadioGroupContext,\n} from '../radio-group/context';\n"],"mappings":";;;AAsBA,MAAM,mBAAmB,OAAO,eAAe;AAC/C,MAAM,yBAAyB,OAAO,qBAAqB;AAE3D,MAAa,cAAc,cAAgC,gBAAgB;AAC3E,MAAa,mBAAmB,cAAqC,sBAAsB"}
+{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/menu/context.ts"],"sourcesContent":["import type { MenuState, StateAttrMap } from '@videojs/core';\nimport type { MenuApi } from '@videojs/core/dom';\nimport { createContext } from '@videojs/element/context';\n\nexport interface MenuTriggerState {\n  hint: string;\n  disabled: boolean;\n  availability?: 'available' | 'unavailable' | 'unsupported' | undefined;\n}\n\nexport interface MenuContextValue {\n  menu: MenuApi;\n  state: MenuState;\n  stateAttrMap: StateAttrMap<MenuState>;\n  /** Publish display and interaction state to this submenu's trigger. */\n  setTriggerState: (state: MenuTriggerState) => void;\n}\n\nexport interface MenuGroupContextValue {\n  registerLabel: (id: string) => () => void;\n}\n\nconst MENU_CONTEXT_KEY = Symbol('@videojs/menu');\nconst MENU_GROUP_CONTEXT_KEY = Symbol('@videojs/menu-group');\n\nexport const menuContext = createContext<MenuContextValue>(MENU_CONTEXT_KEY);\nexport const menuGroupContext = createContext<MenuGroupContextValue>(MENU_GROUP_CONTEXT_KEY);\n\nexport {\n  type RadioGroupContextValue as MenuRadioGroupContextValue,\n  radioGroupContext as menuRadioGroupContext,\n} from '../radio-group/context';\n"],"mappings":";;;AAsBA,MAAM,mBAAmB,OAAO,eAAe;AAC/C,MAAM,yBAAyB,OAAO,qBAAqB;AAE3D,MAAa,cAAc,cAAgC,gBAAgB;AAC3E,MAAa,mBAAmB,cAAqC,sBAAsB"}

package/dist/default/ui/menu/menu-element.js

@@ -10,7 +10,7 @@ import { tryHidePopover, tryShowPopover } from "@videojs/utils/dom";
 import { SnapshotController } from "@videojs/store/html";
 import { MenuCore, MenuDataAttrs, POPUP_HOST_ATTR } from "@videojs/core";
 //#region src/ui/menu/menu-element.ts
-const defaultTriggerMetadata = {
+const defaultTriggerState = {
 	hint: "",
 	disabled: false
 };
@@ -44,8 +44,8 @@ var MenuElement = class extends MediaElement {
 		this.#triggerAbort = null;
 		this.#cleanupSizeObserver = null;
 		this.#currentTrigger = null;
-		this.#metadataTrigger = null;
-		this.#triggerMetadata = defaultTriggerMetadata;
+		this.#stateTrigger = null;
+		this.#triggerState = defaultTriggerState;
 		this.#releaseControlsLock = null;
 		this.#registeredParentMenu = null;
 		this.#cleanupParentRegistration = null;
@@ -67,10 +67,10 @@ var MenuElement = class extends MediaElement {
 		this.#handleContentFocusOut = (event) => {
 			this.#menu?.contentProps.onFocusOut(event);
 		};
-		this.#setTriggerMetadata = (metadata) => {
-			if (metadata.hint === this.#triggerMetadata.hint && metadata.disabled === this.#triggerMetadata.disabled && metadata.availability === this.#triggerMetadata.availability) return;
-			this.#triggerMetadata = metadata;
-			if (metadata.disabled && this.open && this.#parentCtx.value) this.close("imperative-action");
+		this.#setTriggerState = (triggerState) => {
+			if (triggerState.hint === this.#triggerState.hint && triggerState.disabled === this.#triggerState.disabled && triggerState.availability === this.#triggerState.availability) return;
+			this.#triggerState = triggerState;
+			if (triggerState.disabled && this.open && this.#parentCtx.value) this.close("imperative-action");
 			this.requestUpdate();
 		};
 	}
@@ -111,8 +111,8 @@ var MenuElement = class extends MediaElement {
 	#triggerAbort;
 	#cleanupSizeObserver;
 	#currentTrigger;
-	#metadataTrigger;
-	#triggerMetadata;
+	#stateTrigger;
+	#triggerState;
 	#releaseControlsLock;
 	#registeredParentMenu;
 	#cleanupParentRegistration;
@@ -151,7 +151,7 @@ var MenuElement = class extends MediaElement {
 		super.disconnectedCallback();
 		this.#cleanupSizeObserver?.();
 		this.#cleanupSizeObserver = null;
-		this.#syncTriggerMetadata(null);
+		this.#syncTriggerState(null);
 		this.#cleanupTrigger();
 		this.#cleanupParentRegistration?.();
 		this.#cleanupParentRegistration = null;
@@ -171,7 +171,6 @@ var MenuElement = class extends MediaElement {
 		super.willUpdate(changed);
 		if (!this.hasUpdated && this.defaultOpen && !this.open) this.open = true;
 		const parentCtx = this.#parentCtx.value ?? null;
-		const isSubmenu = parentCtx !== null;
 		this.#syncParentRegistration(parentCtx);
 		this.#core.setProps({
 			open: this.open,
@@ -179,8 +178,7 @@ var MenuElement = class extends MediaElement {
 			side: this.side,
 			align: this.align,
 			closeOnEscape: this.closeOnEscape,
-			closeOnOutsideClick: this.closeOnOutsideClick,
-			isSubmenu
+			closeOnOutsideClick: this.closeOnOutsideClick
 		});
 		if (this.#menu && changed.has("open")) this.#menu.syncOpen(this.open);
 	}
@@ -190,7 +188,10 @@ var MenuElement = class extends MediaElement {
 		const parentCtx = this.#parentCtx.value ?? null;
 		const isSubmenu = parentCtx !== null;
 		const input = this.#menu.input.current;
-		this.#core.setInput(input);
+		this.#core.setInput({
+			...input,
+			isSubmenu
+		});
 		const state = this.#core.getState();
 		if (!isSubmenu && state.open) this.#releaseControlsLock ??= this.#controlsState.value?.requestControlsLock() ?? null;
 		else this.#releaseControlsVisibilityLock();
@@ -200,7 +201,7 @@ var MenuElement = class extends MediaElement {
 			menu: this.#menu,
 			state,
 			stateAttrMap: MenuDataAttrs,
-			setTriggerMetadata: this.#setTriggerMetadata
+			setTriggerState: this.#setTriggerState
 		});
 	}
 	#releaseControlsVisibilityLock() {
@@ -250,7 +251,7 @@ var MenuElement = class extends MediaElement {
 		const triggerElement = this.parentElement?.querySelector(`[data-has-submenu][commandfor="${this.id}"]`);
 		this.#menu?.setTriggerElement(triggerElement ?? null);
 		if (triggerElement) applyElementProps(triggerElement, this.#core.getTriggerAttrs(state, this.id));
-		this.#syncTriggerMetadata(triggerElement ?? null);
+		this.#syncTriggerState(triggerElement ?? null);
 		this.removeAttribute(MenuDataAttrs.side);
 		this.removeAttribute(MenuDataAttrs.align);
 		applyStateDataAttrs(this, state, MenuDataAttrs);
@@ -270,22 +271,22 @@ var MenuElement = class extends MediaElement {
 	}
 	#handleContentKeyDown;
 	#handleContentFocusOut;
-	#setTriggerMetadata;
-	#syncTriggerMetadata(trigger) {
-		if (trigger !== this.#metadataTrigger) {
-			this.#clearTriggerMetadata();
-			this.#metadataTrigger = trigger;
+	#setTriggerState;
+	#syncTriggerState(trigger) {
+		if (trigger !== this.#stateTrigger) {
+			this.#clearTriggerState();
+			this.#stateTrigger = trigger;
 		}
 		if (!trigger) return;
 		applyElementProps(trigger, {
-			"aria-disabled": this.#triggerMetadata.disabled || isTriggerExplicitlyDisabled(trigger) ? "true" : void 0,
-			"data-availability": this.#triggerMetadata.availability
+			"aria-disabled": this.#triggerState.disabled || isTriggerExplicitlyDisabled(trigger) ? "true" : void 0,
+			"data-availability": this.#triggerState.availability
 		});
 		const hint = trigger.querySelector("[data-part~=\"hint\"]");
-		if (hint && hint.textContent !== this.#triggerMetadata.hint) hint.textContent = this.#triggerMetadata.hint;
+		if (hint && hint.textContent !== this.#triggerState.hint) hint.textContent = this.#triggerState.hint;
 	}
-	#clearTriggerMetadata() {
-		const trigger = this.#metadataTrigger;
+	#clearTriggerState() {
+		const trigger = this.#stateTrigger;
 		if (!trigger) return;
 		applyElementProps(trigger, {
 			"aria-disabled": isTriggerExplicitlyDisabled(trigger) ? "true" : void 0,
@@ -293,7 +294,7 @@ var MenuElement = class extends MediaElement {
 		});
 		const hint = trigger.querySelector("[data-part~=\"hint\"]");
 		if (hint?.textContent) hint.textContent = "";
-		this.#metadataTrigger = null;
+		this.#stateTrigger = null;
 	}
 	#syncTrigger(triggerElement) {
 		if (triggerElement === this.#currentTrigger) return;