@videojs/react 0.1.0-preview.9 → 10.0.0-alpha.11

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

@@ -0,0 +1 @@
+{"version":3,"file":"icon-state.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/icon-state.js"],"sourcesContent":["//#region src/minimal/tailwind/components/icon-state.ts\nconst iconState = {\n\tplay: {\n\t\tbutton: \"group\",\n\t\trestart: \"hidden opacity-0 group-data-ended:block group-data-ended:opacity-100\",\n\t\tplay: \"hidden opacity-0 group-not-data-ended:group-data-paused:block group-not-data-ended:group-data-paused:opacity-100\",\n\t\tpause: \"hidden opacity-0 group-not-data-paused:group-not-data-ended:block group-not-data-paused:group-not-data-ended:opacity-100\"\n\t},\n\tmute: {\n\t\tbutton: \"group\",\n\t\tvolumeOff: \"hidden opacity-0 group-data-muted:block group-data-muted:opacity-100\",\n\t\tvolumeLow: \"hidden opacity-0 group-not-data-muted:group-data-[volume-level=low]:block group-not-data-muted:group-data-[volume-level=low]:opacity-100\",\n\t\tvolumeHigh: \"hidden opacity-0 group-not-data-muted:group-not-data-[volume-level=low]:block group-not-data-muted:group-not-data-[volume-level=low]:opacity-100\"\n\t},\n\tfullscreen: {\n\t\tbutton: \"group\",\n\t\tenter: \"hidden opacity-0 group-not-data-fullscreen:block group-not-data-fullscreen:opacity-100\",\n\t\texit: \"hidden opacity-0 group-data-fullscreen:block group-data-fullscreen:opacity-100\"\n\t},\n\tcaptions: {\n\t\tbutton: \"group\",\n\t\toff: \"hidden opacity-0 group-not-data-active:block group-not-data-active:opacity-100\",\n\t\ton: \"hidden opacity-0 group-data-active:block group-data-active:opacity-100\"\n\t}\n};\n\n//#endregion\nexport { iconState };\n//# sourceMappingURL=icon-state.js.map"],"mappings":";AACA,MAAM,YAAY;CACjB,MAAM;EACL,QAAQ;EACR,SAAS;EACT,MAAM;EACN,OAAO;EACP;CACD,MAAM;EACL,QAAQ;EACR,WAAW;EACX,WAAW;EACX,YAAY;EACZ;CACD,YAAY;EACX,QAAQ;EACR,OAAO;EACP,MAAM;EACN;CACD,UAAU;EACT,QAAQ;EACR,KAAK;EACL,IAAI;EACJ;CACD"}

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

@@ -0,0 +1,10 @@
+import { cn } from "@videojs/utils/style";
+
+//#region ../skins/dist/default/minimal/tailwind/components/icon.js
+const icon = cn("block [grid-area:1/1] size-4.5", "drop-shadow-[0_1px_0_var(--media-controls-current-shadow-color,oklch(0_0_0/0.25))]", "transition-discrete transition-[display,opacity] duration-150 ease-out");
+const iconFlipped = "[scale:-1_1]";
+const iconContainer = "relative";
+
+//#endregion
+export { icon, iconContainer, iconFlipped };
+//# sourceMappingURL=icon.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"icon.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/icon.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n\n//#region src/minimal/tailwind/components/icon.ts\nconst icon = cn(\"block [grid-area:1/1] size-4.5\", \"drop-shadow-[0_1px_0_var(--media-controls-current-shadow-color,oklch(0_0_0/0.25))]\", \"transition-discrete transition-[display,opacity] duration-150 ease-out\");\nconst iconHidden = \"hidden opacity-0\";\nconst iconFlipped = \"[scale:-1_1]\";\nconst iconContainer = \"relative\";\n\n//#endregion\nexport { icon, iconContainer, iconFlipped, iconHidden };\n//# sourceMappingURL=icon.js.map"],"mappings":";;;AAGA,MAAM,OAAO,GAAG,kCAAkC,sFAAsF,yEAAyE;AAEjN,MAAM,cAAc;AACpB,MAAM,gBAAgB"}

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

@@ -0,0 +1,8 @@
+import { cn } from "@videojs/utils/style";
+
+//#region ../skins/dist/default/minimal/tailwind/components/overlay.js
+const overlay = cn("absolute inset-0 flex flex-col items-start", "pointer-events-none rounded-[inherit]", "opacity-0", "bg-linear-to-t from-black/70 via-black/50 via-[7.5rem] to-transparent", "backdrop-blur-none backdrop-saturate-120 backdrop-brightness-90", "transition-[opacity,backdrop-filter] ease-out", "duration-500 delay-500", "peer-data-visible/controls:opacity-100", "peer-data-visible/controls:duration-150", "peer-data-visible/controls:delay-0", "peer-data-open/error:opacity-100", "peer-data-open/error:duration-150", "peer-data-open/error:delay-0", "peer-data-open/error:backdrop-blur", "motion-reduce:duration-100");
+
+//#endregion
+export { overlay };
+//# sourceMappingURL=overlay.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"overlay.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/overlay.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n\n//#region src/minimal/tailwind/components/overlay.ts\nconst overlay = cn(\"absolute inset-0 flex flex-col items-start\", \"pointer-events-none rounded-[inherit]\", \"opacity-0\", \"bg-linear-to-t from-black/70 via-black/50 via-[7.5rem] to-transparent\", \"backdrop-blur-none backdrop-saturate-120 backdrop-brightness-90\", \"transition-[opacity,backdrop-filter] ease-out\", \"duration-500 delay-500\", \"peer-data-visible/controls:opacity-100\", \"peer-data-visible/controls:duration-150\", \"peer-data-visible/controls:delay-0\", \"peer-data-open/error:opacity-100\", \"peer-data-open/error:duration-150\", \"peer-data-open/error:delay-0\", \"peer-data-open/error:backdrop-blur\", \"motion-reduce:duration-100\");\n\n//#endregion\nexport { overlay };\n//# sourceMappingURL=overlay.js.map"],"mappings":";;;AAGA,MAAM,UAAU,GAAG,8CAA8C,yCAAyC,aAAa,yEAAyE,mEAAmE,iDAAiD,0BAA0B,0CAA0C,2CAA2C,sCAAsC,oCAAoC,qCAAqC,gCAAgC,sCAAsC,6BAA6B"}

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

@@ -0,0 +1,12 @@
+import { cn } from "@videojs/utils/style";
+
+//#region ../skins/dist/default/minimal/tailwind/components/popup.js
+const base = cn("m-0 border-0 text-inherit overflow-visible", "transition-[transform,scale,opacity,filter] duration-200", "data-starting-style:opacity-0 data-starting-style:scale-0 data-starting-style:blur-sm", "data-ending-style:opacity-0 data-ending-style:scale-0 data-ending-style:blur-sm", "data-instant:duration-0", "data-[side=top]:origin-bottom data-[side=bottom]:origin-top data-[side=left]:origin-right data-[side=right]:origin-left");
+const popup = {
+	tooltip: cn(base, "px-2 py-1 rounded-sm shadow-md shadow-black/10 bg-white/10 backdrop-blur-3xl backdrop-saturate-150 backdrop-brightness-90 text-[0.75rem] whitespace-nowrap", "[--media-tooltip-side-offset:0.5rem]"),
+	volume: cn(base, "py-2.5 px-1 rounded-full")
+};
+
+//#endregion
+export { popup };
+//# sourceMappingURL=popup.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"popup.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/popup.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n\n//#region src/minimal/tailwind/components/popup.ts\nconst base = cn(\"m-0 border-0 text-inherit overflow-visible\", \"transition-[transform,scale,opacity,filter] duration-200\", \"data-starting-style:opacity-0 data-starting-style:scale-0 data-starting-style:blur-sm\", \"data-ending-style:opacity-0 data-ending-style:scale-0 data-ending-style:blur-sm\", \"data-instant:duration-0\", \"data-[side=top]:origin-bottom data-[side=bottom]:origin-top data-[side=left]:origin-right data-[side=right]:origin-left\");\nconst popup = {\n\ttooltip: cn(base, \"px-2 py-1 rounded-sm shadow-md shadow-black/10 bg-white/10 backdrop-blur-3xl backdrop-saturate-150 backdrop-brightness-90 text-[0.75rem] whitespace-nowrap\", \"[--media-tooltip-side-offset:0.5rem]\"),\n\tvolume: cn(base, \"py-2.5 px-1 rounded-full\")\n};\n\n//#endregion\nexport { popup };\n//# sourceMappingURL=popup.js.map"],"mappings":";;;AAGA,MAAM,OAAO,GAAG,8CAA8C,4DAA4D,yFAAyF,mFAAmF,2BAA2B,0HAA0H;AAC3b,MAAM,QAAQ;CACb,SAAS,GAAG,MAAM,8JAA8J,uCAAuC;CACvN,QAAQ,GAAG,MAAM,2BAA2B;CAC5C"}

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

@@ -0,0 +1,8 @@
+import { cn } from "@videojs/utils/style";
+
+//#region ../skins/dist/default/minimal/tailwind/components/root.js
+const root = cn("block relative isolate @container/media-root", "rounded-(--media-border-radius,0.75rem)", "font-[Inter_Variable,Inter,ui-sans-serif,system-ui,sans-serif] text-[0.8125rem] leading-normal subpixel-antialiased", "**:box-border **:m-0", "[&_button]:font-[inherit]", "motion-safe:[interpolate-size:allow-keywords]");
+
+//#endregion
+export { root };
+//# sourceMappingURL=root.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"root.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/root.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n\n//#region src/minimal/tailwind/components/root.ts\nconst root = cn(\"block relative isolate @container/media-root\", \"rounded-(--media-border-radius,0.75rem)\", \"font-[Inter_Variable,Inter,ui-sans-serif,system-ui,sans-serif] text-[0.8125rem] leading-normal subpixel-antialiased\", \"**:box-border **:m-0\", \"[&_button]:font-[inherit]\", \"motion-safe:[interpolate-size:allow-keywords]\");\n\n//#endregion\nexport { root };\n//# sourceMappingURL=root.js.map"],"mappings":";;;AAGA,MAAM,OAAO,GAAG,gDAAgD,2CAA2C,uHAAuH,wBAAwB,6BAA6B,gDAAgD"}

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

@@ -0,0 +1,11 @@
+//#region ../skins/dist/default/minimal/tailwind/components/seek.js
+const seek = {
+	button: "@max-md/media-controls:hidden",
+	label: "text-[0.75em] font-[480] tabular-nums",
+	labelForward: "absolute -right-px -bottom-0.75",
+	labelBackward: "absolute -left-px -bottom-0.75"
+};
+
+//#endregion
+export { seek };
+//# sourceMappingURL=seek.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"seek.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/seek.js"],"sourcesContent":["//#region src/minimal/tailwind/components/seek.ts\nconst seek = {\n\tbutton: \"@max-md/media-controls:hidden\",\n\tlabel: \"text-[0.75em] font-[480] tabular-nums\",\n\tlabelForward: \"absolute -right-px -bottom-0.75\",\n\tlabelBackward: \"absolute -left-px -bottom-0.75\"\n};\n\n//#endregion\nexport { seek };\n//# sourceMappingURL=seek.js.map"],"mappings":";AACA,MAAM,OAAO;CACZ,QAAQ;CACR,OAAO;CACP,cAAc;CACd,eAAe;CACf"}

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

@@ -0,0 +1,20 @@
+import { cn } from "@videojs/utils/style";
+
+//#region ../skins/dist/default/minimal/tailwind/components/slider.js
+const slider = {
+	root: cn("group/slider relative flex flex-1 items-center justify-center rounded-full outline-none", "data-[orientation=horizontal]:min-w-20 data-[orientation=horizontal]:w-full data-[orientation=horizontal]:h-5", "data-[orientation=vertical]:w-5 data-[orientation=vertical]:h-[4.5rem]"),
+	track: cn("relative isolate overflow-hidden bg-current/20 rounded-[inherit] select-none", "data-[orientation=horizontal]:w-full data-[orientation=horizontal]:h-0.75", "data-[orientation=vertical]:w-0.75 data-[orientation=vertical]:h-full"),
+	fill: {
+		base: "absolute rounded-[inherit] pointer-events-none",
+		fill: cn("bg-current", "data-[orientation=horizontal]:inset-y-0 data-[orientation=horizontal]:left-0", "data-[orientation=horizontal]:w-(--media-slider-fill,0)", "data-[orientation=vertical]:inset-x-0 data-[orientation=vertical]:bottom-0", "data-[orientation=vertical]:h-(--media-slider-fill,0)"),
+		buffer: cn("bg-current/20 duration-250 ease-out", "data-[orientation=horizontal]:inset-y-0 data-[orientation=horizontal]:left-0", "data-[orientation=horizontal]:transition-[width] data-[orientation=horizontal]:w-(--media-slider-buffer,0)", "data-[orientation=vertical]:inset-x-0 data-[orientation=vertical]:bottom-0", "data-[orientation=vertical]:transition-[height] data-[orientation=vertical]:h-(--media-slider-buffer)")
+	},
+	thumb: {
+		base: cn("z-10 absolute size-3 -translate-x-1/2 -translate-y-1/2", "bg-current rounded-full", "shadow-[0_0_0_1px_var(--media-controls-current-shadow-color-subtle,oklch(0_0_0/0.1)),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] duration-150 ease-out select-none", "outline-2 outline-transparent -outline-offset-2", "focus-visible:outline-current focus-visible:outline-offset-2", "data-[orientation=horizontal]:top-1/2 data-[orientation=horizontal]:left-(--media-slider-fill,0)", "data-[orientation=vertical]:left-1/2 data-[orientation=vertical]:top-[calc(100%-var(--media-slider-fill,0))]"),
+		interactive: cn("opacity-0 scale-70 origin-center", "group-hover/slider:opacity-100 group-hover/slider:scale-100", "group-focus-within/slider:opacity-100 group-focus-within/slider:scale-100")
+	}
+};
+
+//#endregion
+export { slider };
+//# sourceMappingURL=slider.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"slider.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/slider.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n\n//#region src/minimal/tailwind/components/slider.ts\nconst slider = {\n\troot: cn(\"group/slider relative flex flex-1 items-center justify-center rounded-full outline-none\", \"data-[orientation=horizontal]:min-w-20 data-[orientation=horizontal]:w-full data-[orientation=horizontal]:h-5\", \"data-[orientation=vertical]:w-5 data-[orientation=vertical]:h-[4.5rem]\"),\n\ttrack: cn(\"relative isolate overflow-hidden bg-current/20 rounded-[inherit] 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\tfill: {\n\t\tbase: \"absolute rounded-[inherit] pointer-events-none\",\n\t\tfill: cn(\"bg-current\", \"data-[orientation=horizontal]:inset-y-0 data-[orientation=horizontal]:left-0\", \"data-[orientation=horizontal]:w-(--media-slider-fill,0)\", \"data-[orientation=vertical]:inset-x-0 data-[orientation=vertical]:bottom-0\", \"data-[orientation=vertical]:h-(--media-slider-fill,0)\"),\n\t\tbuffer: cn(\"bg-current/20 duration-250 ease-out\", \"data-[orientation=horizontal]:inset-y-0 data-[orientation=horizontal]:left-0\", \"data-[orientation=horizontal]:transition-[width] data-[orientation=horizontal]:w-(--media-slider-buffer,0)\", \"data-[orientation=vertical]:inset-x-0 data-[orientation=vertical]:bottom-0\", \"data-[orientation=vertical]:transition-[height] data-[orientation=vertical]:h-(--media-slider-buffer)\")\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(--media-controls-current-shadow-color-subtle,oklch(0_0_0/0.1)),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] duration-150 ease-out select-none\", \"outline-2 outline-transparent -outline-offset-2\", \"focus-visible:outline-current focus-visible:outline-offset-2\", \"data-[orientation=horizontal]:top-1/2 data-[orientation=horizontal]:left-(--media-slider-fill,0)\", \"data-[orientation=vertical]:left-1/2 data-[orientation=vertical]:top-[calc(100%-var(--media-slider-fill,0))]\"),\n\t\tinteractive: cn(\"opacity-0 scale-70 origin-center\", \"group-hover/slider:opacity-100 group-hover/slider:scale-100\", \"group-focus-within/slider:opacity-100 group-focus-within/slider:scale-100\")\n\t}\n};\n\n//#endregion\nexport { slider };\n//# sourceMappingURL=slider.js.map"],"mappings":";;;AAGA,MAAM,SAAS;CACd,MAAM,GAAG,2FAA2F,iHAAiH,yEAAyE;CAC9R,OAAO,GAAG,gFAAgF,6EAA6E,wEAAwE;CAC/O,MAAM;EACL,MAAM;EACN,MAAM,GAAG,cAAc,gFAAgF,2DAA2D,8EAA8E,wDAAwD;EACxS,QAAQ,GAAG,uCAAuC,gFAAgF,8GAA8G,8EAA8E,wGAAwG;EACta;CACD,OAAO;EACN,MAAM,GAAG,0DAA0D,2BAA2B,wJAAwJ,+EAA+E,mDAAmD,gEAAgE,oGAAoG,+GAA+G;EAC3oB,aAAa,GAAG,oCAAoC,+DAA+D,4EAA4E;EAC/L;CACD"}

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

@@ -0,0 +1,14 @@
+import { cn } from "@videojs/utils/style";
+
+//#region ../skins/dist/default/minimal/tailwind/components/time.js
+const time = {
+	group: "flex items-center gap-1",
+	current: cn("hidden tabular-nums", "@md/media-controls:inline"),
+	separator: cn("hidden", "@md/media-controls:inline @md/media-controls:text-white/50"),
+	duration: cn("tabular-nums", "@md/media-controls:text-current/60"),
+	controls: cn("flex flex-row-reverse items-center flex-1 gap-3", "@md/media-controls:flex-row")
+};
+
+//#endregion
+export { time };
+//# sourceMappingURL=time.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"time.js","names":[],"sources":["../../../../../../../../../skins/dist/default/minimal/tailwind/components/time.js"],"sourcesContent":["import { cn } from \"@videojs/utils/style\";\n\n//#region src/minimal/tailwind/components/time.ts\nconst time = {\n\tgroup: \"flex items-center gap-1\",\n\tcurrent: cn(\"hidden tabular-nums\", \"@md/media-controls:inline\"),\n\tseparator: cn(\"hidden\", \"@md/media-controls:inline @md/media-controls:text-white/50\"),\n\tduration: cn(\"tabular-nums\", \"@md/media-controls:text-current/60\"),\n\tcontrols: cn(\"flex flex-row-reverse items-center flex-1 gap-3\", \"@md/media-controls:flex-row\")\n};\n\n//#endregion\nexport { time };\n//# sourceMappingURL=time.js.map"],"mappings":";;;AAGA,MAAM,OAAO;CACZ,OAAO;CACP,SAAS,GAAG,uBAAuB,4BAA4B;CAC/D,WAAW,GAAG,UAAU,6DAA6D;CACrF,UAAU,GAAG,gBAAgB,qCAAqC;CAClE,UAAU,GAAG,mDAAmD,8BAA8B;CAC9F"}

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

@@ -0,0 +1,43 @@
+import { controls as controls$1 } from "./components/controls.js";
+import { popup as popup$1 } from "./components/popup.js";
+import { root as root$1 } from "./components/root.js";
+import { bufferingIndicator } from "./components/buffering.js";
+import { button } from "./components/button.js";
+import { buttonGroup } from "./components/button-group.js";
+import { error } from "./components/error.js";
+import { icon, iconContainer, iconFlipped } from "./components/icon.js";
+import { seek } from "./components/seek.js";
+import { slider as slider$1 } from "./components/slider.js";
+import { time } from "./components/time.js";
+import { iconState } from "./components/icon-state.js";
+import { overlay } from "./components/overlay.js";
+import { cn } from "@videojs/utils/style";
+
+//#region ../skins/dist/default/minimal/tailwind/video.tailwind.js
+const root = (isShadowDOM) => cn(root$1, "bg-black", "after:absolute after:pointer-events-none after:rounded-[inherit] after:z-10", "after:inset-0 after:ring-1 after:ring-inset after:ring-black/15", "dark:after:ring-white/15", {
+	"[&_::slotted(video)]:block [&_::slotted(video)]:w-full [&_::slotted(video)]:h-full [&_::slotted(video)]:rounded-(--media-border-radius,0.75rem)": isShadowDOM,
+	"[&_video]:block [&_video]:w-full [&_video]:h-full [&_video]:rounded-[inherit]": !isShadowDOM
+}, "[&>img]:absolute [&>img]:inset-0 [&>img]:w-full [&>img]:h-full [&>img]:rounded-[inherit]", "[&>img]:object-cover [&>img]:pointer-events-none", "[&>img]:transition-opacity [&>img]:duration-250", "[&>img:not([data-visible])]:opacity-0", "[--media-caption-track-delay:600ms]", "[--media-caption-track-y:-0.5rem]", "has-[[data-controls][data-visible]]:[--media-caption-track-delay:25ms]", "has-[[data-controls][data-visible]]:[--media-caption-track-y:-3.5rem]", !isShadowDOM ? [
+	"[&_video::-webkit-media-text-track-container]:transition-transform",
+	"[&_video::-webkit-media-text-track-container]:duration-150",
+	"[&_video::-webkit-media-text-track-container]:ease-out",
+	"[&_video::-webkit-media-text-track-container]:delay-(--media-caption-track-delay)",
+	"[&_video::-webkit-media-text-track-container]:translate-y-(--media-caption-track-y)",
+	"[&_video::-webkit-media-text-track-container]:scale-98",
+	"[&_video::-webkit-media-text-track-container]:z-1",
+	"[&_video::-webkit-media-text-track-container]:font-[inherit]",
+	"motion-reduce:[&_video::-webkit-media-text-track-container]:duration-50"
+] : [], "[&:fullscreen]:rounded-none");
+const controls = cn(controls$1, "absolute bottom-0 inset-x-0", "pt-8 px-1.5 pb-1.5 gap-2", "text-white z-10", "will-change-[translate,filter,opacity]", "transition-[translate,filter,opacity] ease-out", "delay-0 duration-75", "not-data-visible:opacity-0 not-data-visible:translate-y-full", "not-data-visible:blur-sm not-data-visible:pointer-events-none", "not-data-visible:delay-500 not-data-visible:duration-500", "motion-reduce:not-data-visible:duration-100", "motion-reduce:not-data-visible:translate-y-0", "motion-reduce:not-data-visible:blur-none motion-reduce:not-data-visible:scale-100", "@sm/media-root:pt-10 @sm/media-root:px-3 @sm/media-root:pb-3", "@sm/media-root:gap-3.5");
+const slider = {
+	...slider$1,
+	track: cn(slider$1.track, "shadow-[0_0_0_1px_oklch(0_0_0/0.05)]")
+};
+const popup = {
+	...popup$1,
+	volume: cn("[--media-popover-side-offset:0.5rem] p-1 bg-transparent")
+};
+
+//#endregion
+export { controls, popup, root, slider };
+//# sourceMappingURL=video.tailwind.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"video.tailwind.js","names":[],"sources":["../../../../../../../../skins/dist/default/minimal/tailwind/video.tailwind.js"],"sourcesContent":["import { controls as controls$1 } from \"./components/controls.js\";\nimport { popup as popup$1 } from \"./components/popup.js\";\nimport { root as root$1 } from \"./components/root.js\";\nimport { bufferingIndicator } from \"./components/buffering.js\";\nimport { button } from \"./components/button.js\";\nimport { buttonGroup } from \"./components/button-group.js\";\nimport { error } from \"./components/error.js\";\nimport { icon, iconContainer, iconFlipped, iconHidden } from \"./components/icon.js\";\nimport { seek } from \"./components/seek.js\";\nimport { slider as slider$1 } from \"./components/slider.js\";\nimport { time } from \"./components/time.js\";\nimport { captions } from \"./components/captions.js\";\nimport { iconState } from \"./components/icon-state.js\";\nimport { overlay } from \"./components/overlay.js\";\nimport { tooltipState } from \"./components/tooltip-state.js\";\nimport { cn } from \"@videojs/utils/style\";\n\n//#region src/minimal/tailwind/video.tailwind.ts\nconst root = (isShadowDOM) => cn(root$1, \"bg-black\", \"after:absolute after:pointer-events-none after:rounded-[inherit] after:z-10\", \"after:inset-0 after:ring-1 after:ring-inset after:ring-black/15\", \"dark:after:ring-white/15\", {\n\t\"[&_::slotted(video)]:block [&_::slotted(video)]:w-full [&_::slotted(video)]:h-full [&_::slotted(video)]:rounded-(--media-border-radius,0.75rem)\": isShadowDOM,\n\t\"[&_video]:block [&_video]:w-full [&_video]:h-full [&_video]:rounded-[inherit]\": !isShadowDOM\n}, \"[&>img]:absolute [&>img]:inset-0 [&>img]:w-full [&>img]:h-full [&>img]:rounded-[inherit]\", \"[&>img]:object-cover [&>img]:pointer-events-none\", \"[&>img]:transition-opacity [&>img]:duration-250\", \"[&>img:not([data-visible])]:opacity-0\", \"[--media-caption-track-delay:600ms]\", \"[--media-caption-track-y:-0.5rem]\", \"has-[[data-controls][data-visible]]:[--media-caption-track-delay:25ms]\", \"has-[[data-controls][data-visible]]:[--media-caption-track-y:-3.5rem]\", !isShadowDOM ? [\n\t\"[&_video::-webkit-media-text-track-container]:transition-transform\",\n\t\"[&_video::-webkit-media-text-track-container]:duration-150\",\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\t\"motion-reduce:[&_video::-webkit-media-text-track-container]:duration-50\"\n] : [], \"[&:fullscreen]:rounded-none\");\nconst controls = cn(controls$1, \"absolute bottom-0 inset-x-0\", \"pt-8 px-1.5 pb-1.5 gap-2\", \"text-white z-10\", \"will-change-[translate,filter,opacity]\", \"transition-[translate,filter,opacity] ease-out\", \"delay-0 duration-75\", \"not-data-visible:opacity-0 not-data-visible:translate-y-full\", \"not-data-visible:blur-sm not-data-visible:pointer-events-none\", \"not-data-visible:delay-500 not-data-visible:duration-500\", \"motion-reduce:not-data-visible:duration-100\", \"motion-reduce:not-data-visible:translate-y-0\", \"motion-reduce:not-data-visible:blur-none motion-reduce:not-data-visible:scale-100\", \"@sm/media-root:pt-10 @sm/media-root:px-3 @sm/media-root:pb-3\", \"@sm/media-root:gap-3.5\");\nconst slider = {\n\t...slider$1,\n\ttrack: cn(slider$1.track, \"shadow-[0_0_0_1px_oklch(0_0_0/0.05)]\")\n};\nconst popup = {\n\t...popup$1,\n\tvolume: cn(\"[--media-popover-side-offset:0.5rem] p-1 bg-transparent\")\n};\n\n//#endregion\nexport { bufferingIndicator, button, buttonGroup, captions, controls, error, icon, iconContainer, iconFlipped, iconHidden, iconState, overlay, popup, root, seek, slider, time, tooltipState };\n//# sourceMappingURL=video.tailwind.js.map"],"mappings":";;;;;;;;;;;;;;;;AAkBA,MAAM,QAAQ,gBAAgB,GAAG,QAAQ,YAAY,+EAA+E,mEAAmE,4BAA4B;CAClO,mJAAmJ;CACnJ,iFAAiF,CAAC;CAClF,EAAE,4FAA4F,oDAAoD,mDAAmD,yCAAyC,uCAAuC,qCAAqC,0EAA0E,yEAAyE,CAAC,cAAc;CAC5d;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA,GAAG,EAAE,EAAE,8BAA8B;AACtC,MAAM,WAAW,GAAG,YAAY,+BAA+B,4BAA4B,mBAAmB,0CAA0C,kDAAkD,uBAAuB,gEAAgE,iEAAiE,4DAA4D,+CAA+C,gDAAgD,qFAAqF,gEAAgE,yBAAyB;AAC3qB,MAAM,SAAS;CACd,GAAG;CACH,OAAO,GAAG,SAAS,OAAO,uCAAuC;CACjE;AACD,MAAM,QAAQ;CACb,GAAG;CACH,QAAQ,GAAG,0DAA0D;CACrE"}

package/dist/default/ui/alert-dialog/alert-dialog-close.js

@@ -0,0 +1,31 @@
+'use client';
+
+import { useAlertDialogContext } from "./context.js";
+import { renderElement } from "../../utils/use-render.js";
+import { forwardRef, useCallback } from "react";
+
+//#region src/ui/alert-dialog/alert-dialog-close.tsx
+const AlertDialogClose = forwardRef(function AlertDialogClose({ render, className, style, disabled, ...elementProps }, forwardedRef) {
+	const { dialog, state } = useAlertDialogContext();
+	const handleClick = useCallback(() => {
+		if (disabled) return;
+		dialog.close();
+	}, [dialog, disabled]);
+	return renderElement("button", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		ref: [forwardedRef],
+		props: [{
+			type: "button",
+			disabled,
+			onClick: handleClick
+		}, elementProps]
+	});
+});
+
+//#endregion
+export { AlertDialogClose };
+//# sourceMappingURL=alert-dialog-close.js.map

package/dist/default/ui/alert-dialog/alert-dialog-close.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog-close.js","names":[],"sources":["../../../../src/ui/alert-dialog/alert-dialog-close.tsx"],"sourcesContent":["'use client';\n\nimport type { AlertDialogCore } from '@videojs/core';\nimport { forwardRef, useCallback } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useAlertDialogContext } from './context';\n\nexport interface AlertDialogCloseProps extends UIComponentProps<'button', AlertDialogCore.State> {}\n\nexport const AlertDialogClose = forwardRef<HTMLButtonElement, AlertDialogCloseProps>(function AlertDialogClose(\n  { render, className, style, disabled, ...elementProps },\n  forwardedRef\n) {\n  const { dialog, state } = useAlertDialogContext();\n\n  const handleClick = useCallback(() => {\n    if (disabled) return;\n    dialog.close();\n  }, [dialog, disabled]);\n\n  return renderElement(\n    'button',\n    { render, className, style },\n    {\n      state,\n      ref: [forwardedRef],\n      props: [{ type: 'button' as const, disabled, onClick: handleClick }, elementProps],\n    }\n  );\n});\n\nexport namespace AlertDialogClose {\n  export type Props = AlertDialogCloseProps;\n  export type State = AlertDialogCore.State;\n}\n"],"mappings":";;;;;;;AAWA,MAAa,mBAAmB,WAAqD,SAAS,iBAC5F,EAAE,QAAQ,WAAW,OAAO,UAAU,GAAG,gBACzC,cACA;CACA,MAAM,EAAE,QAAQ,UAAU,uBAAuB;CAEjD,MAAM,cAAc,kBAAkB;AACpC,MAAI,SAAU;AACd,SAAO,OAAO;IACb,CAAC,QAAQ,SAAS,CAAC;AAEtB,QAAO,cACL,UACA;EAAE;EAAQ;EAAW;EAAO,EAC5B;EACE;EACA,KAAK,CAAC,aAAa;EACnB,OAAO,CAAC;GAAE,MAAM;GAAmB;GAAU,SAAS;GAAa,EAAE,aAAa;EACnF,CACF;EACD"}

package/dist/default/ui/alert-dialog/alert-dialog-description.js

@@ -0,0 +1,16 @@
+'use client';
+
+import { useAlertDialogContext } from "./context.js";
+import { createContextPart } from "../create-context-part.js";
+
+//#region src/ui/alert-dialog/alert-dialog-description.tsx
+const AlertDialogDescription = createContextPart({
+	displayName: "AlertDialogDescription",
+	tag: "p",
+	useContext: useAlertDialogContext,
+	getProps: (state) => ({ id: state.descriptionId })
+});
+
+//#endregion
+export { AlertDialogDescription };
+//# sourceMappingURL=alert-dialog-description.js.map

package/dist/default/ui/alert-dialog/alert-dialog-description.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog-description.js","names":[],"sources":["../../../../src/ui/alert-dialog/alert-dialog-description.tsx"],"sourcesContent":["'use client';\n\nimport type { AlertDialogCore } from '@videojs/core';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createContextPart } from '../create-context-part';\nimport { useAlertDialogContext } from './context';\n\nexport interface AlertDialogDescriptionProps extends UIComponentProps<'p', AlertDialogCore.State> {}\n\nexport const AlertDialogDescription = createContextPart<AlertDialogDescriptionProps, AlertDialogCore.State>({\n  displayName: 'AlertDialogDescription',\n  tag: 'p',\n  useContext: useAlertDialogContext,\n  getProps: (state) => ({ id: state.descriptionId }),\n});\n\nexport namespace AlertDialogDescription {\n  export type Props = AlertDialogDescriptionProps;\n  export type State = AlertDialogCore.State;\n}\n"],"mappings":";;;;;;AAUA,MAAa,yBAAyB,kBAAsE;CAC1G,aAAa;CACb,KAAK;CACL,YAAY;CACZ,WAAW,WAAW,EAAE,IAAI,MAAM,eAAe;CAClD,CAAC"}

package/dist/default/ui/alert-dialog/alert-dialog-popup.js

@@ -0,0 +1,32 @@
+'use client';
+
+import { useComposedRefs } from "../../utils/use-composed-refs.js";
+import { useAlertDialogContext } from "./context.js";
+import { renderElement } from "../../utils/use-render.js";
+import { forwardRef, useCallback } from "react";
+
+//#region src/ui/alert-dialog/alert-dialog-popup.tsx
+const AlertDialogPopup = forwardRef(function AlertDialogPopup({ render, className, style, ...elementProps }, forwardedRef) {
+	const { core, dialog, state, stateAttrMap } = useAlertDialogContext();
+	const composedRef = useComposedRefs(forwardedRef, useCallback((el) => {
+		dialog.setElement(el);
+	}, [dialog]));
+	if (!state.open) return null;
+	return renderElement("div", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		stateAttrMap,
+		ref: composedRef,
+		props: [{
+			tabIndex: -1,
+			...core.getAttrs(state)
+		}, elementProps]
+	});
+});
+
+//#endregion
+export { AlertDialogPopup };
+//# sourceMappingURL=alert-dialog-popup.js.map

package/dist/default/ui/alert-dialog/alert-dialog-popup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog-popup.js","names":[],"sources":["../../../../src/ui/alert-dialog/alert-dialog-popup.tsx"],"sourcesContent":["'use client';\n\nimport type { AlertDialogCore } from '@videojs/core';\nimport { forwardRef, useCallback } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { renderElement } from '../../utils/use-render';\nimport { useAlertDialogContext } from './context';\n\nexport interface AlertDialogPopupProps extends UIComponentProps<'div', AlertDialogCore.State> {}\n\nexport const AlertDialogPopup = forwardRef<HTMLDivElement, AlertDialogPopupProps>(function AlertDialogPopup(\n  { render, className, style, ...elementProps },\n  forwardedRef\n) {\n  const { core, dialog, state, stateAttrMap } = useAlertDialogContext();\n\n  const elementRef = useCallback(\n    (el: HTMLDivElement | null) => {\n      dialog.setElement(el);\n    },\n    [dialog]\n  );\n\n  const composedRef = useComposedRefs(forwardedRef, elementRef);\n\n  if (!state.open) return null;\n\n  return renderElement(\n    'div',\n    { render, className, style },\n    {\n      state,\n      stateAttrMap,\n      ref: composedRef,\n      props: [{ tabIndex: -1, ...core.getAttrs(state) }, elementProps],\n    }\n  );\n});\n\nexport namespace AlertDialogPopup {\n  export type Props = AlertDialogPopupProps;\n  export type State = AlertDialogCore.State;\n}\n"],"mappings":";;;;;;;;AAYA,MAAa,mBAAmB,WAAkD,SAAS,iBACzF,EAAE,QAAQ,WAAW,OAAO,GAAG,gBAC/B,cACA;CACA,MAAM,EAAE,MAAM,QAAQ,OAAO,iBAAiB,uBAAuB;CASrE,MAAM,cAAc,gBAAgB,cAPjB,aAChB,OAA8B;AAC7B,SAAO,WAAW,GAAG;IAEvB,CAAC,OAAO,CACT,CAE4D;AAE7D,KAAI,CAAC,MAAM,KAAM,QAAO;AAExB,QAAO,cACL,OACA;EAAE;EAAQ;EAAW;EAAO,EAC5B;EACE;EACA;EACA,KAAK;EACL,OAAO,CAAC;GAAE,UAAU;GAAI,GAAG,KAAK,SAAS,MAAM;GAAE,EAAE,aAAa;EACjE,CACF;EACD"}

package/dist/default/ui/alert-dialog/alert-dialog-root.js

@@ -0,0 +1,59 @@
+'use client';
+
+import { useDestroy } from "../../utils/use-destroy.js";
+import { AlertDialogContextProvider } from "./context.js";
+import { useLatestRef } from "../../utils/use-latest-ref.js";
+import { useSafeId } from "../../utils/use-safe-id.js";
+import { createAlertDialog, createTransition } from "@videojs/core/dom";
+import { useSnapshot } from "@videojs/store/react";
+import { useEffect, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { AlertDialogCore, AlertDialogDataAttrs } from "@videojs/core";
+
+//#region src/ui/alert-dialog/alert-dialog-root.tsx
+function AlertDialogRoot({ open: controlledOpen, defaultOpen = AlertDialogCore.defaultProps.defaultOpen, onOpenChange: onOpenChangeProp, onOpenChangeComplete: onOpenChangeCompleteProp, children }) {
+	const [core] = useState(() => new AlertDialogCore());
+	const isControlled = controlledOpen !== void 0;
+	const onOpenChangeRef = useLatestRef(onOpenChangeProp);
+	const onOpenChangeCompleteRef = useLatestRef(onOpenChangeCompleteProp);
+	const [dialog] = useState(() => {
+		const instance = createAlertDialog({
+			transition: createTransition(),
+			onOpenChange: (nextOpen) => {
+				onOpenChangeRef.current?.(nextOpen);
+			},
+			onOpenChangeComplete: (nextOpen) => {
+				onOpenChangeCompleteRef.current?.(nextOpen);
+			}
+		});
+		if (!isControlled && defaultOpen) instance.open();
+		return instance;
+	});
+	const titleId = useSafeId("alert-dialog-title-");
+	const descriptionId = useSafeId("alert-dialog-desc-");
+	core.setTitleId(titleId);
+	core.setDescriptionId(descriptionId);
+	useEffect(() => {
+		if (controlledOpen === void 0) return;
+		const { active: inputOpen } = dialog.input.current;
+		if (controlledOpen === inputOpen) return;
+		if (controlledOpen) dialog.open();
+		else dialog.close();
+	}, [controlledOpen, dialog]);
+	useDestroy(dialog);
+	const input = useSnapshot(dialog.input);
+	core.setInput(input);
+	return /* @__PURE__ */ jsx(AlertDialogContextProvider, {
+		value: {
+			core,
+			dialog,
+			state: core.getState(),
+			stateAttrMap: AlertDialogDataAttrs
+		},
+		children
+	});
+}
+
+//#endregion
+export { AlertDialogRoot };
+//# sourceMappingURL=alert-dialog-root.js.map

package/dist/default/ui/alert-dialog/alert-dialog-root.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog-root.js","names":[],"sources":["../../../../src/ui/alert-dialog/alert-dialog-root.tsx"],"sourcesContent":["'use client';\n\nimport { AlertDialogCore, AlertDialogDataAttrs, type AlertDialogProps } from '@videojs/core';\nimport { createAlertDialog, createTransition } from '@videojs/core/dom';\nimport { useSnapshot } from '@videojs/store/react';\nimport type { ReactNode } from 'react';\nimport { useEffect, useState } from 'react';\n\nimport { useDestroy } from '../../utils/use-destroy';\nimport { useLatestRef } from '../../utils/use-latest-ref';\nimport { useSafeId } from '../../utils/use-safe-id';\nimport { AlertDialogContextProvider } from './context';\n\nexport interface AlertDialogRootProps extends AlertDialogProps {\n  /** Called when the open state changes (fires immediately, before animations). */\n  onOpenChange?: (open: boolean) => void;\n  /** Called after open/close animations complete. */\n  onOpenChangeComplete?: (open: boolean) => void;\n  children?: ReactNode;\n}\n\nexport function AlertDialogRoot({\n  open: controlledOpen,\n  defaultOpen = AlertDialogCore.defaultProps.defaultOpen,\n  onOpenChange: onOpenChangeProp,\n  onOpenChangeComplete: onOpenChangeCompleteProp,\n  children,\n}: AlertDialogRootProps): ReactNode {\n  const [core] = useState(() => new AlertDialogCore());\n\n  const isControlled = controlledOpen !== undefined;\n\n  const onOpenChangeRef = useLatestRef(onOpenChangeProp);\n  const onOpenChangeCompleteRef = useLatestRef(onOpenChangeCompleteProp);\n\n  const [dialog] = useState(() => {\n    const instance = createAlertDialog({\n      transition: createTransition(),\n      onOpenChange: (nextOpen: boolean) => {\n        onOpenChangeRef.current?.(nextOpen);\n      },\n      onOpenChangeComplete: (nextOpen: boolean) => {\n        onOpenChangeCompleteRef.current?.(nextOpen);\n      },\n    });\n\n    if (!isControlled && defaultOpen) {\n      instance.open();\n    }\n\n    return instance;\n  });\n\n  const titleId = useSafeId('alert-dialog-title-');\n  const descriptionId = useSafeId('alert-dialog-desc-');\n\n  core.setTitleId(titleId);\n  core.setDescriptionId(descriptionId);\n\n  // Sync controlled open prop -> internal input state.\n  useEffect(() => {\n    if (controlledOpen === undefined) return;\n\n    const { active: inputOpen } = dialog.input.current;\n    if (controlledOpen === inputOpen) return;\n\n    if (controlledOpen) {\n      dialog.open();\n    } else {\n      dialog.close();\n    }\n  }, [controlledOpen, dialog]);\n\n  useDestroy(dialog);\n\n  const input = useSnapshot(dialog.input);\n  core.setInput(input);\n  const state = core.getState();\n\n  return (\n    <AlertDialogContextProvider value={{ core, dialog, state, stateAttrMap: AlertDialogDataAttrs }}>\n      {children}\n    </AlertDialogContextProvider>\n  );\n}\n\nexport namespace AlertDialogRoot {\n  export type Props = AlertDialogRootProps;\n}\n"],"mappings":";;;;;;;;;;;;;AAqBA,SAAgB,gBAAgB,EAC9B,MAAM,gBACN,cAAc,gBAAgB,aAAa,aAC3C,cAAc,kBACd,sBAAsB,0BACtB,YACkC;CAClC,MAAM,CAAC,QAAQ,eAAe,IAAI,iBAAiB,CAAC;CAEpD,MAAM,eAAe,mBAAmB;CAExC,MAAM,kBAAkB,aAAa,iBAAiB;CACtD,MAAM,0BAA0B,aAAa,yBAAyB;CAEtE,MAAM,CAAC,UAAU,eAAe;EAC9B,MAAM,WAAW,kBAAkB;GACjC,YAAY,kBAAkB;GAC9B,eAAe,aAAsB;AACnC,oBAAgB,UAAU,SAAS;;GAErC,uBAAuB,aAAsB;AAC3C,4BAAwB,UAAU,SAAS;;GAE9C,CAAC;AAEF,MAAI,CAAC,gBAAgB,YACnB,UAAS,MAAM;AAGjB,SAAO;GACP;CAEF,MAAM,UAAU,UAAU,sBAAsB;CAChD,MAAM,gBAAgB,UAAU,qBAAqB;AAErD,MAAK,WAAW,QAAQ;AACxB,MAAK,iBAAiB,cAAc;AAGpC,iBAAgB;AACd,MAAI,mBAAmB,OAAW;EAElC,MAAM,EAAE,QAAQ,cAAc,OAAO,MAAM;AAC3C,MAAI,mBAAmB,UAAW;AAElC,MAAI,eACF,QAAO,MAAM;MAEb,QAAO,OAAO;IAEf,CAAC,gBAAgB,OAAO,CAAC;AAE5B,YAAW,OAAO;CAElB,MAAM,QAAQ,YAAY,OAAO,MAAM;AACvC,MAAK,SAAS,MAAM;AAGpB,QACE,oBAAC;EAA2B,OAAO;GAAE;GAAM;GAAQ,OAHvC,KAAK,UAAU;GAG+B,cAAc;GAAsB;EAC3F;GAC0B"}

package/dist/default/ui/alert-dialog/alert-dialog-title.js

@@ -0,0 +1,16 @@
+'use client';
+
+import { useAlertDialogContext } from "./context.js";
+import { createContextPart } from "../create-context-part.js";
+
+//#region src/ui/alert-dialog/alert-dialog-title.tsx
+const AlertDialogTitle = createContextPart({
+	displayName: "AlertDialogTitle",
+	tag: "h2",
+	useContext: useAlertDialogContext,
+	getProps: (state) => ({ id: state.titleId })
+});
+
+//#endregion
+export { AlertDialogTitle };
+//# sourceMappingURL=alert-dialog-title.js.map

package/dist/default/ui/alert-dialog/alert-dialog-title.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog-title.js","names":[],"sources":["../../../../src/ui/alert-dialog/alert-dialog-title.tsx"],"sourcesContent":["'use client';\n\nimport type { AlertDialogCore } from '@videojs/core';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createContextPart } from '../create-context-part';\nimport { useAlertDialogContext } from './context';\n\nexport interface AlertDialogTitleProps extends UIComponentProps<'h2', AlertDialogCore.State> {}\n\nexport const AlertDialogTitle = createContextPart<AlertDialogTitleProps, AlertDialogCore.State>({\n  displayName: 'AlertDialogTitle',\n  tag: 'h2',\n  useContext: useAlertDialogContext,\n  getProps: (state) => ({ id: state.titleId }),\n});\n\nexport namespace AlertDialogTitle {\n  export type Props = AlertDialogTitleProps;\n  export type State = AlertDialogCore.State;\n}\n"],"mappings":";;;;;;AAUA,MAAa,mBAAmB,kBAAgE;CAC9F,aAAa;CACb,KAAK;CACL,YAAY;CACZ,WAAW,WAAW,EAAE,IAAI,MAAM,SAAS;CAC5C,CAAC"}

package/dist/default/ui/alert-dialog/context.js

@@ -0,0 +1,16 @@
+'use client';
+
+import { createContext, useContext } from "react";
+
+//#region src/ui/alert-dialog/context.tsx
+const AlertDialogContext = createContext(null);
+const AlertDialogContextProvider = AlertDialogContext.Provider;
+function useAlertDialogContext() {
+	const ctx = useContext(AlertDialogContext);
+	if (!ctx) throw new Error("AlertDialog compound components must be used within an AlertDialog.Root");
+	return ctx;
+}
+
+//#endregion
+export { AlertDialogContextProvider, useAlertDialogContext };
+//# sourceMappingURL=context.js.map

package/dist/default/ui/alert-dialog/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/alert-dialog/context.tsx"],"sourcesContent":["'use client';\n\nimport type { AlertDialogCore, StateAttrMap } from '@videojs/core';\nimport type { AlertDialogApi } from '@videojs/core/dom';\nimport { createContext, useContext } from 'react';\n\nexport interface AlertDialogContextValue {\n  core: AlertDialogCore;\n  dialog: AlertDialogApi;\n  state: AlertDialogCore.State;\n  stateAttrMap: StateAttrMap<AlertDialogCore.State>;\n}\n\nconst AlertDialogContext = createContext<AlertDialogContextValue | null>(null);\n\nexport const AlertDialogContextProvider = AlertDialogContext.Provider;\n\nexport function useAlertDialogContext(): AlertDialogContextValue {\n  const ctx = useContext(AlertDialogContext);\n  if (!ctx) throw new Error('AlertDialog compound components must be used within an AlertDialog.Root');\n  return ctx;\n}\n"],"mappings":";;;;;AAaA,MAAM,qBAAqB,cAA8C,KAAK;AAE9E,MAAa,6BAA6B,mBAAmB;AAE7D,SAAgB,wBAAiD;CAC/D,MAAM,MAAM,WAAW,mBAAmB;AAC1C,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,0EAA0E;AACpG,QAAO"}

package/dist/default/ui/alert-dialog/index.js

@@ -0,0 +1,4 @@
+import { useAlertDialogContext } from "./context.js";
+import { index_parts_exports } from "./index.parts.js";
+
+export { index_parts_exports as AlertDialog, useAlertDialogContext };

package/dist/default/ui/alert-dialog/index.parts.js

@@ -0,0 +1,19 @@
+import { __exportAll } from "../../_virtual/_rolldown/runtime.js";
+import { AlertDialogClose } from "./alert-dialog-close.js";
+import { AlertDialogDescription } from "./alert-dialog-description.js";
+import { AlertDialogPopup } from "./alert-dialog-popup.js";
+import { AlertDialogRoot } from "./alert-dialog-root.js";
+import { AlertDialogTitle } from "./alert-dialog-title.js";
+
+//#region src/ui/alert-dialog/index.parts.ts
+var index_parts_exports = /* @__PURE__ */ __exportAll({
+	Close: () => AlertDialogClose,
+	Description: () => AlertDialogDescription,
+	Popup: () => AlertDialogPopup,
+	Root: () => AlertDialogRoot,
+	Title: () => AlertDialogTitle
+});
+
+//#endregion
+export { index_parts_exports };
+//# sourceMappingURL=index.parts.js.map

package/dist/default/ui/alert-dialog/index.parts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/ui/alert-dialog/index.parts.ts"],"sourcesContent":["export { AlertDialogClose as Close, type AlertDialogCloseProps as CloseProps } from './alert-dialog-close';\nexport {\n  AlertDialogDescription as Description,\n  type AlertDialogDescriptionProps as DescriptionProps,\n} from './alert-dialog-description';\nexport { AlertDialogPopup as Popup, type AlertDialogPopupProps as PopupProps } from './alert-dialog-popup';\nexport { AlertDialogRoot as Root, type AlertDialogRootProps as RootProps } from './alert-dialog-root';\nexport { AlertDialogTitle as Title, type AlertDialogTitleProps as TitleProps } from './alert-dialog-title';\n"],"mappings":""}

package/dist/default/ui/buffering-indicator/buffering-indicator.js

@@ -0,0 +1,50 @@
+'use client';
+
+import { usePlayer } from "../../player/context.js";
+import { renderElement } from "../../utils/use-render.js";
+import { selectPlayback } from "@videojs/core/dom";
+import { forwardRef, useState, useSyncExternalStore } from "react";
+import { BufferingIndicatorCore, BufferingIndicatorDataAttrs } from "@videojs/core";
+
+//#region src/ui/buffering-indicator/buffering-indicator.tsx
+/**
+* Displays a buffering indicator when media is waiting for data.
+*
+* Visibility is delayed (default 500ms) to avoid flashing on quick buffers.
+*
+* @example
+* ```tsx
+* <BufferingIndicator />
+*
+* <BufferingIndicator delay={1000} />
+*
+* <BufferingIndicator
+*   render={(props, state) => (
+*     <div {...props}>{state.visible && <Spinner />}</div>
+*   )}
+* />
+* ```
+*/
+const BufferingIndicator = forwardRef(function BufferingIndicator(componentProps, forwardedRef) {
+	const { render, className, style, delay, ...elementProps } = componentProps;
+	const playback = usePlayer(selectPlayback);
+	const [core] = useState(() => new BufferingIndicatorCore());
+	core.setProps({ delay });
+	if (playback) core.update(playback);
+	const state = useSyncExternalStore((cb) => core.state.subscribe(cb), () => core.state.current, () => core.state.current);
+	if (!playback) return null;
+	return renderElement("div", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		stateAttrMap: BufferingIndicatorDataAttrs,
+		ref: [forwardedRef],
+		props: [elementProps]
+	});
+});
+
+//#endregion
+export { BufferingIndicator };
+//# sourceMappingURL=buffering-indicator.js.map

package/dist/default/ui/buffering-indicator/buffering-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"buffering-indicator.js","names":[],"sources":["../../../../src/ui/buffering-indicator/buffering-indicator.tsx"],"sourcesContent":["'use client';\n\nimport { BufferingIndicatorCore, BufferingIndicatorDataAttrs } from '@videojs/core';\nimport { logMissingFeature, selectPlayback } from '@videojs/core/dom';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef, useState, useSyncExternalStore } from 'react';\n\nimport { usePlayer } from '../../player/context';\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\n\nexport interface BufferingIndicatorProps\n  extends UIComponentProps<'div', BufferingIndicatorCore.State>,\n    BufferingIndicatorCore.Props {}\n\n/**\n * Displays a buffering indicator when media is waiting for data.\n *\n * Visibility is delayed (default 500ms) to avoid flashing on quick buffers.\n *\n * @example\n * ```tsx\n * <BufferingIndicator />\n *\n * <BufferingIndicator delay={1000} />\n *\n * <BufferingIndicator\n *   render={(props, state) => (\n *     <div {...props}>{state.visible && <Spinner />}</div>\n *   )}\n * />\n * ```\n */\nexport const BufferingIndicator = forwardRef(function BufferingIndicator(\n  componentProps: BufferingIndicatorProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const { render, className, style, delay, ...elementProps } = componentProps;\n\n  const playback = usePlayer(selectPlayback);\n\n  const [core] = useState(() => new BufferingIndicatorCore());\n  core.setProps({ delay });\n\n  if (playback) core.update(playback);\n\n  const state = useSyncExternalStore(\n    (cb) => core.state.subscribe(cb),\n    () => core.state.current,\n    () => core.state.current\n  );\n\n  if (!playback) {\n    if (__DEV__) logMissingFeature('BufferingIndicator', 'playback');\n    return null;\n  }\n\n  return renderElement(\n    'div',\n    { render, className, style },\n    {\n      state,\n      stateAttrMap: BufferingIndicatorDataAttrs,\n      ref: [forwardedRef],\n      props: [elementProps],\n    }\n  );\n});\n\nexport namespace BufferingIndicator {\n  export type Props = BufferingIndicatorProps;\n  export type State = BufferingIndicatorCore.State;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCA,MAAa,qBAAqB,WAAW,SAAS,mBACpD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,OAAO,GAAG,iBAAiB;CAE7D,MAAM,WAAW,UAAU,eAAe;CAE1C,MAAM,CAAC,QAAQ,eAAe,IAAI,wBAAwB,CAAC;AAC3D,MAAK,SAAS,EAAE,OAAO,CAAC;AAExB,KAAI,SAAU,MAAK,OAAO,SAAS;CAEnC,MAAM,QAAQ,sBACX,OAAO,KAAK,MAAM,UAAU,GAAG,QAC1B,KAAK,MAAM,eACX,KAAK,MAAM,QAClB;AAED,KAAI,CAAC,SAEH,QAAO;AAGT,QAAO,cACL,OACA;EAAE;EAAQ;EAAW;EAAO,EAC5B;EACE;EACA,cAAc;EACd,KAAK,CAAC,aAAa;EACnB,OAAO,CAAC,aAAa;EACtB,CACF;EACD"}

package/dist/default/ui/buffering-indicator/index.js

@@ -0,0 +1,3 @@
+import { BufferingIndicator } from "./buffering-indicator.js";
+
+export { BufferingIndicator };

package/dist/default/ui/captions-button/captions-button.js

@@ -0,0 +1,19 @@
+'use client';
+
+import { createMediaButton } from "../create-media-button.js";
+import { selectTextTrack } from "@videojs/core/dom";
+import { CaptionsButtonCore, CaptionsButtonDataAttrs } from "@videojs/core";
+
+//#region src/ui/captions-button/captions-button.tsx
+/** A button that toggles captions. */
+const CaptionsButton = createMediaButton({
+	displayName: "CaptionsButton",
+	core: CaptionsButtonCore,
+	stateAttrMap: CaptionsButtonDataAttrs,
+	selector: selectTextTrack,
+	action: (core, state) => core.toggle(state)
+});
+
+//#endregion
+export { CaptionsButton };
+//# sourceMappingURL=captions-button.js.map

package/dist/default/ui/captions-button/captions-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"captions-button.js","names":[],"sources":["../../../../src/ui/captions-button/captions-button.tsx"],"sourcesContent":["'use client';\n\nimport { CaptionsButtonCore, CaptionsButtonDataAttrs } from '@videojs/core';\nimport { selectTextTrack } from '@videojs/core/dom';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { createMediaButton } from '../create-media-button';\n\nexport interface CaptionsButtonProps\n  extends UIComponentProps<'button', CaptionsButtonCore.State>,\n    CaptionsButtonCore.Props {}\n\n/** A button that toggles captions. */\nexport const CaptionsButton = createMediaButton<CaptionsButtonCore, CaptionsButtonProps>({\n  displayName: 'CaptionsButton',\n  core: CaptionsButtonCore,\n  stateAttrMap: CaptionsButtonDataAttrs,\n  selector: selectTextTrack,\n  action: (core, state) => core.toggle(state),\n});\n\nexport namespace CaptionsButton {\n  export type Props = CaptionsButtonProps;\n  export type State = CaptionsButtonCore.State;\n}\n"],"mappings":";;;;;;;;AAaA,MAAa,iBAAiB,kBAA2D;CACvF,aAAa;CACb,MAAM;CACN,cAAc;CACd,UAAU;CACV,SAAS,MAAM,UAAU,KAAK,OAAO,MAAM;CAC5C,CAAC"}

package/dist/default/ui/captions-button/index.js

@@ -0,0 +1,3 @@
+import { CaptionsButton } from "./captions-button.js";
+
+export { CaptionsButton };

package/dist/default/ui/controls/context.js

@@ -0,0 +1,16 @@
+'use client';
+
+import { createContext, useContext } from "react";
+
+//#region src/ui/controls/context.tsx
+const ControlsContext = createContext(null);
+const ControlsContextProvider = ControlsContext.Provider;
+function useControlsContext() {
+	const ctx = useContext(ControlsContext);
+	if (!ctx) throw new Error("Controls compound components must be used within a Controls.Root");
+	return ctx;
+}
+
+//#endregion
+export { ControlsContextProvider, useControlsContext };
+//# sourceMappingURL=context.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/controls/context.tsx"],"sourcesContent":["'use client';\n\nimport type { ControlsState, StateAttrMap } from '@videojs/core';\nimport { createContext, useContext } from 'react';\n\nexport interface ControlsContextValue {\n  state: ControlsState;\n  stateAttrMap: StateAttrMap<ControlsState>;\n}\n\nconst ControlsContext = createContext<ControlsContextValue | null>(null);\n\nexport const ControlsContextProvider = ControlsContext.Provider;\n\nexport function useControlsContext(): ControlsContextValue {\n  const ctx = useContext(ControlsContext);\n  if (!ctx) throw new Error('Controls compound components must be used within a Controls.Root');\n  return ctx;\n}\n"],"mappings":";;;;;AAUA,MAAM,kBAAkB,cAA2C,KAAK;AAExE,MAAa,0BAA0B,gBAAgB;AAEvD,SAAgB,qBAA2C;CACzD,MAAM,MAAM,WAAW,gBAAgB;AACvC,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,mEAAmE;AAC7F,QAAO"}

package/dist/default/ui/controls/controls-group.js

@@ -0,0 +1,30 @@
+'use client';
+
+import { renderElement } from "../../utils/use-render.js";
+import { useControlsContext } from "./context.js";
+import { forwardRef } from "react";
+
+//#region src/ui/controls/controls-group.tsx
+/** Layout group for related controls; sets `role="group"` when labeled. */
+const ControlsGroup = forwardRef(function ControlsGroup(componentProps, forwardedRef) {
+	const { render, className, style, children, ...elementProps } = componentProps;
+	const { state, stateAttrMap } = useControlsContext();
+	const role = elementProps["aria-label"] || elementProps["aria-labelledby"] ? "group" : void 0;
+	return renderElement("div", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		stateAttrMap,
+		ref: [forwardedRef],
+		props: [{
+			role,
+			children
+		}, elementProps]
+	});
+});
+
+//#endregion
+export { ControlsGroup };
+//# sourceMappingURL=controls-group.js.map