@videojs/react 10.0.0-beta.22 → 10.0.0-beta.24

package/dist/dev/ui/playback-rate-menu/use-playback-rate-menu.js

@@ -0,0 +1,27 @@
+"use client";
+import { usePlaybackRateMenuContext } from "./context.js";
+import { useCallback } from "react";
+//#region src/ui/playback-rate-menu/use-playback-rate-menu.ts
+function usePlaybackRateMenu() {
+	const { core, media, state } = usePlaybackRateMenuContext();
+	const setRate = useCallback((rate) => core.select(media, rate), [core, media]);
+	const setValue = useCallback((value) => core.selectValue(media, value), [core, media]);
+	return {
+		state,
+		rate: state.rate,
+		value: core.getRateValue(state.rate),
+		options: state.rates.map((rate) => ({
+			rate,
+			value: core.getRateValue(rate),
+			label: core.getRateLabel(rate),
+			disabled: state.disabled
+		})),
+		disabled: state.disabled,
+		setRate,
+		setValue
+	};
+}
+//#endregion
+export { usePlaybackRateMenu };
+
+//# sourceMappingURL=use-playback-rate-menu.js.map

package/dist/dev/ui/playback-rate-menu/use-playback-rate-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-playback-rate-menu.js","names":[],"sources":["../../../../src/ui/playback-rate-menu/use-playback-rate-menu.ts"],"sourcesContent":["'use client';\n\nimport type { PlaybackRateMenuCore } from '@videojs/core';\nimport { useCallback } from 'react';\n\nimport { usePlaybackRateMenuContext } from './context';\n\nexport interface PlaybackRateMenuOption {\n  rate: number;\n  value: string;\n  label: string;\n  disabled: boolean;\n}\n\nexport interface PlaybackRateMenuResult {\n  state: PlaybackRateMenuCore.State;\n  rate: number;\n  value: string;\n  options: PlaybackRateMenuOption[];\n  disabled: boolean;\n  setRate: (rate: number) => void;\n  setValue: (value: string) => void;\n}\n\nexport function usePlaybackRateMenu(): PlaybackRateMenuResult {\n  const { core, media, state } = usePlaybackRateMenuContext();\n\n  const setRate = useCallback((rate: number) => core.select(media, rate), [core, media]);\n  const setValue = useCallback((value: string) => core.selectValue(media, value), [core, media]);\n\n  return {\n    state,\n    rate: state.rate,\n    value: core.getRateValue(state.rate),\n    options: state.rates.map((rate) => ({\n      rate,\n      value: core.getRateValue(rate),\n      label: core.getRateLabel(rate),\n      disabled: state.disabled,\n    })),\n    disabled: state.disabled,\n    setRate,\n    setValue,\n  };\n}\n\nexport namespace usePlaybackRateMenu {\n  export type Result = PlaybackRateMenuResult;\n  export type Option = PlaybackRateMenuOption;\n}\n"],"mappings":";;;;AAwBA,SAAgB,sBAA8C;CAC5D,MAAM,EAAE,MAAM,OAAO,UAAU,4BAA4B;CAE3D,MAAM,UAAU,aAAa,SAAiB,KAAK,OAAO,OAAO,KAAK,EAAE,CAAC,MAAM,MAAM,CAAC;CACtF,MAAM,WAAW,aAAa,UAAkB,KAAK,YAAY,OAAO,MAAM,EAAE,CAAC,MAAM,MAAM,CAAC;AAE9F,QAAO;EACL;EACA,MAAM,MAAM;EACZ,OAAO,KAAK,aAAa,MAAM,KAAK;EACpC,SAAS,MAAM,MAAM,KAAK,UAAU;GAClC;GACA,OAAO,KAAK,aAAa,KAAK;GAC9B,OAAO,KAAK,aAAa,KAAK;GAC9B,UAAU,MAAM;GACjB,EAAE;EACH,UAAU,MAAM;EAChB;EACA;EACD"}

package/dist/dev/ui/popover/context.d.ts

@@ -1,4 +1,4 @@
-import { PopoverApi } from "@videojs/core/dom";
+import { MediaContainer, PopoverApi, PositioningBoundary } from "@videojs/core/dom";
 import { PopoverCore, StateAttrMap as StateAttrMap$1 } from "@videojs/core";
 
 //#region src/ui/popover/context.d.ts
@@ -9,6 +9,8 @@ interface PopoverContextValue {
   stateAttrMap: StateAttrMap$1<PopoverCore.State>;
   anchorName: string;
   popupId: string;
+  boundary: PositioningBoundary;
+  container: MediaContainer | null;
 }
 declare function usePopoverContext(): PopoverContextValue;
 //#endregion

package/dist/dev/ui/popover/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","names":[],"sources":["../../../../src/ui/popover/context.tsx"],"mappings":";;;;UAMiB,mBAAA;EACf,IAAA,EAAM,WAAA;EACN,OAAA,EAAS,UAAA;EACT,KAAA,EAAO,WAAA,CAAY,KAAA;EACnB,YAAA,EAAc,cAAA,CAAa,WAAA,CAAY,KAAA;EACvC,UAAA;EACA,OAAA;AAAA;AAAA,iBAOc,iBAAA,CAAA,GAAqB,mBAAA"}
+{"version":3,"file":"context.d.ts","names":[],"sources":["../../../../src/ui/popover/context.tsx"],"mappings":";;;;UAMiB,mBAAA;EACf,IAAA,EAAM,WAAA;EACN,OAAA,EAAS,UAAA;EACT,KAAA,EAAO,WAAA,CAAY,KAAA;EACnB,YAAA,EAAc,cAAA,CAAa,WAAA,CAAY,KAAA;EACvC,UAAA;EACA,OAAA;EACA,QAAA,EAAU,mBAAA;EACV,SAAA,EAAW,cAAA;AAAA;AAAA,iBAOG,iBAAA,CAAA,GAAqB,mBAAA"}

package/dist/dev/ui/popover/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/popover/context.tsx"],"sourcesContent":["'use client';\n\nimport type { PopoverCore, StateAttrMap } from '@videojs/core';\nimport type { PopoverApi } from '@videojs/core/dom';\nimport { createContext, useContext } from 'react';\n\nexport interface PopoverContextValue {\n  core: PopoverCore;\n  popover: PopoverApi;\n  state: PopoverCore.State;\n  stateAttrMap: StateAttrMap<PopoverCore.State>;\n  anchorName: string;\n  popupId: string;\n}\n\nconst PopoverContext = createContext<PopoverContextValue | null>(null);\n\nexport const PopoverContextProvider = PopoverContext.Provider;\n\nexport function usePopoverContext(): PopoverContextValue {\n  const ctx = useContext(PopoverContext);\n  if (!ctx) throw new Error('Popover compound components must be used within a Popover.Root');\n  return ctx;\n}\n"],"mappings":";;;AAeA,MAAM,iBAAiB,cAA0C,KAAK;AAEtE,MAAa,yBAAyB,eAAe;AAErD,SAAgB,oBAAyC;CACvD,MAAM,MAAM,WAAW,eAAe;AACtC,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,iEAAiE;AAC3F,QAAO"}
+{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/popover/context.tsx"],"sourcesContent":["'use client';\n\nimport type { PopoverCore, StateAttrMap } from '@videojs/core';\nimport type { MediaContainer, PopoverApi, PositioningBoundary } from '@videojs/core/dom';\nimport { createContext, useContext } from 'react';\n\nexport interface PopoverContextValue {\n  core: PopoverCore;\n  popover: PopoverApi;\n  state: PopoverCore.State;\n  stateAttrMap: StateAttrMap<PopoverCore.State>;\n  anchorName: string;\n  popupId: string;\n  boundary: PositioningBoundary;\n  container: MediaContainer | null;\n}\n\nconst PopoverContext = createContext<PopoverContextValue | null>(null);\n\nexport const PopoverContextProvider = PopoverContext.Provider;\n\nexport function usePopoverContext(): PopoverContextValue {\n  const ctx = useContext(PopoverContext);\n  if (!ctx) throw new Error('Popover compound components must be used within a Popover.Root');\n  return ctx;\n}\n"],"mappings":";;;AAiBA,MAAM,iBAAiB,cAA0C,KAAK;AAEtE,MAAa,yBAAyB,eAAe;AAErD,SAAgB,oBAAyC;CACvD,MAAM,MAAM,WAAW,eAAe;AACtC,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,iEAAiE;AAC3F,QAAO"}

package/dist/dev/ui/popover/popover-arrow.d.ts

@@ -1,11 +1,11 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as react from "react";
+import * as _$react from "react";
 import { PopoverState } from "@videojs/core";
 
 //#region src/ui/popover/popover-arrow.d.ts
 interface PopoverArrowProps extends UIComponentProps<'div', PopoverState> {}
 /** Decorative arrow pointing from the popup toward the trigger. Hidden from assistive technology. */
-declare const PopoverArrow: react.ForwardRefExoticComponent<PopoverArrowProps>;
+declare const PopoverArrow: _$react.ForwardRefExoticComponent<PopoverArrowProps>;
 declare namespace PopoverArrow {
   type Props = PopoverArrowProps;
   type State = PopoverState;

package/dist/dev/ui/popover/popover-arrow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popover-arrow.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-arrow.tsx"],"mappings":";;;;;UAQiB,iBAAA,SAA0B,gBAAA,QAAwB,YAAA;;cAGtD,YAAA,EAAY,KAAA,CAAA,yBAAA,CAAA,iBAAA;AAAA,kBAOR,YAAA;EAAA,KACH,KAAA,GAAQ,iBAAA;EAAA,KACR,KAAA,GAAQ,YAAA;AAAA"}
+{"version":3,"file":"popover-arrow.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-arrow.tsx"],"mappings":";;;;;UAQiB,iBAAA,SAA0B,gBAAA,QAAwB,YAAA;;cAGtD,YAAA,EAAY,OAAA,CAAA,yBAAA,CAAA,iBAAA;AAAA,kBAOR,YAAA;EAAA,KACH,KAAA,GAAQ,iBAAA;EAAA,KACR,KAAA,GAAQ,YAAA;AAAA"}

package/dist/dev/ui/popover/popover-popup.d.ts

@@ -1,11 +1,11 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as react from "react";
+import * as _$react from "react";
 import { PopoverState } from "@videojs/core";
 
 //#region src/ui/popover/popover-popup.d.ts
 interface PopoverPopupProps extends UIComponentProps<'div', PopoverState> {}
 /** Container for the popover content. Positioned relative to the trigger using CSS anchor positioning with a JavaScript fallback. */
-declare const PopoverPopup: react.ForwardRefExoticComponent<Omit<PopoverPopupProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const PopoverPopup: _$react.ForwardRefExoticComponent<Omit<PopoverPopupProps, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
 declare namespace PopoverPopup {
   type Props = PopoverPopupProps;
   type State = PopoverState;

package/dist/dev/ui/popover/popover-popup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popover-popup.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-popup.tsx"],"mappings":";;;;;UAaiB,iBAAA,SAA0B,gBAAA,QAAwB,YAAA;;cAKtD,YAAA,EAAY,KAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,iBAAA,WAAA,KAAA,CAAA,aAAA,CAAA,cAAA;AAAA,kBAkIR,YAAA;EAAA,KACH,KAAA,GAAQ,iBAAA;EAAA,KACR,KAAA,GAAQ,YAAA;AAAA"}
+{"version":3,"file":"popover-popup.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-popup.tsx"],"mappings":";;;;;UAoBiB,iBAAA,SAA0B,gBAAA,QAAwB,YAAA;;cAKtD,YAAA,EAAY,OAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,iBAAA,WAAA,OAAA,CAAA,aAAA,CAAA,cAAA;AAAA,kBAqJR,YAAA;EAAA,KACH,KAAA,GAAQ,iBAAA;EAAA,KACR,KAAA,GAAQ,YAAA;AAAA"}

package/dist/dev/ui/popover/popover-popup.js

@@ -2,7 +2,7 @@
 import { useComposedRefs } from "../../utils/use-composed-refs.js";
 import { renderElement } from "../../utils/use-render.js";
 import { usePopoverContext } from "./context.js";
-import { getAnchorPositionStyle, getPopupPositionRect, resolveOffsets } from "@videojs/core/dom";
+import { getAnchorPositionStyle, getPopupPositionRect, getPositioningBoundaryRect, isEventWithinElement, resolveOffsets, resolvePositioningBoundary } from "@videojs/core/dom";
 import { forwardRef, useCallback, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { supportsAnchorPositioning } from "@videojs/utils/dom";
 //#region src/ui/popover/popover-popup.tsx
@@ -13,7 +13,7 @@ const POPOVER_RESET = {
 };
 /** Container for the popover content. Positioned relative to the trigger using CSS anchor positioning with a JavaScript fallback. */
 const PopoverPopup = forwardRef(function PopoverPopup({ render, className, style, ...elementProps }, forwardedRef) {
-	const { core, popover, state, stateAttrMap, anchorName, popupId } = usePopoverContext();
+	const { core, popover, state, stateAttrMap, anchorName, popupId, boundary, container } = usePopoverContext();
 	const internalRef = useRef(null);
 	const composedRef = useComposedRefs(forwardedRef, useCallback((el) => {
 		popover.setPopupElement(el);
@@ -30,7 +30,6 @@ const PopoverPopup = forwardRef(function PopoverPopup({ render, className, style
 	}, [anchorName, posOpts]);
 	const [manualStyle, setManualStyle] = useState(null);
 	useLayoutEffect(() => {
-		if (supportsAnchorPositioning()) return;
 		if (!state.open) {
 			setManualStyle(null);
 			return;
@@ -39,13 +38,24 @@ const PopoverPopup = forwardRef(function PopoverPopup({ render, className, style
 			const triggerEl = popover.triggerElement;
 			const popupEl = internalRef.current;
 			if (!triggerEl || !popupEl) return;
-			setManualStyle(getAnchorPositionStyle(anchorName, posOpts, triggerEl.getBoundingClientRect(), getPopupPositionRect(popupEl), document.documentElement.getBoundingClientRect(), resolveOffsets(popupEl)));
+			const triggerRect = triggerEl.getBoundingClientRect();
+			const boundaryElement = resolvePositioningBoundary(boundary, {
+				container,
+				root: popupEl.getRootNode()
+			});
+			const { positionAnchor: _, ...nextStyle } = getAnchorPositionStyle(anchorName, posOpts, triggerRect, supportsAnchorPositioning() ? void 0 : getPopupPositionRect(popupEl), getPositioningBoundaryRect(boundaryElement), resolveOffsets(popupEl));
+			setManualStyle(nextStyle);
 		}
 		measure();
 		const triggerEl = popover.triggerElement;
 		const popupEl = internalRef.current;
+		const boundaryElement = popupEl ? resolvePositioningBoundary(boundary, {
+			container,
+			root: popupEl.getRootNode()
+		}) : null;
 		let rafId = 0;
-		function reposition() {
+		function reposition(event) {
+			if (event && isEventWithinElement(event, internalRef.current)) return;
 			cancelAnimationFrame(rafId);
 			rafId = requestAnimationFrame(measure);
 		}
@@ -55,6 +65,7 @@ const PopoverPopup = forwardRef(function PopoverPopup({ render, className, style
 		}) : null;
 		if (triggerEl && resizeObserver) resizeObserver.observe(triggerEl);
 		if (popupEl && resizeObserver) resizeObserver.observe(popupEl);
+		if (boundaryElement && resizeObserver) resizeObserver.observe(boundaryElement);
 		window.addEventListener("scroll", reposition, {
 			capture: true,
 			passive: true
@@ -70,9 +81,11 @@ const PopoverPopup = forwardRef(function PopoverPopup({ render, className, style
 		state.open,
 		anchorName,
 		posOpts,
-		popover
+		popover,
+		boundary,
+		container
 	]);
-	const positioningStyle = anchorStyle ?? manualStyle ?? POPOVER_RESET;
+	const positioningStyle = manualStyle ?? anchorStyle ?? POPOVER_RESET;
 	if (!state.open) return null;
 	const { onFocusOut, ...restPopupProps } = popover.popupProps;
 	return renderElement("div", {

package/dist/dev/ui/popover/popover-popup.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover-popup.js","names":[],"sources":["../../../../src/ui/popover/popover-popup.tsx"],"sourcesContent":["'use client';\n\nimport type { PopoverState } from '@videojs/core';\nimport { getAnchorPositionStyle, getPopupPositionRect, resolveOffsets } from '@videojs/core/dom';\nimport { supportsAnchorPositioning } from '@videojs/utils/dom';\nimport type { CSSProperties } from 'react';\nimport { forwardRef, useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { renderElement } from '../../utils/use-render';\nimport { usePopoverContext } from './context';\n\nexport interface PopoverPopupProps extends UIComponentProps<'div', PopoverState> {}\n\nconst POPOVER_RESET: CSSProperties = { position: 'fixed', inset: 'auto', margin: 0 };\n\n/** Container for the popover content. Positioned relative to the trigger using CSS anchor positioning with a JavaScript fallback. */\nexport const PopoverPopup = forwardRef<HTMLDivElement, PopoverPopupProps>(function PopoverPopup(\n  { render, className, style, ...elementProps },\n  forwardedRef\n) {\n  const { core, popover, state, stateAttrMap, anchorName, popupId } = usePopoverContext();\n  const internalRef = useRef<HTMLDivElement>(null);\n\n  const popupRef = useCallback(\n    (el: HTMLDivElement | null) => {\n      popover.setPopupElement(el);\n      if (el && supportsAnchorPositioning()) {\n        el.style.setProperty('position-anchor', `--${anchorName}`);\n      }\n    },\n    [popover, anchorName]\n  );\n\n  const composedRef = useComposedRefs(forwardedRef, popupRef, internalRef);\n\n  // --- Positioning ---\n\n  const posOpts = useMemo(() => ({ side: state.side, align: state.align }), [state.side, state.align]);\n\n  // CSS Anchor Positioning — computed from state, no measurement needed.\n  // `position-anchor` is set imperatively in the ref callback above\n  // because React's style prop silently drops unrecognised CSS properties.\n  const anchorStyle = useMemo(() => {\n    if (!supportsAnchorPositioning()) return null;\n    const { positionAnchor: _, ...rest } = getAnchorPositionStyle(anchorName, posOpts);\n    return rest as CSSProperties;\n  }, [anchorName, posOpts]);\n\n  // Manual fallback — measure rects after layout, before paint.\n  const [manualStyle, setManualStyle] = useState<CSSProperties | null>(null);\n\n  useLayoutEffect(() => {\n    if (supportsAnchorPositioning()) return;\n    if (!state.open) {\n      setManualStyle(null);\n      return;\n    }\n\n    function measure(): void {\n      const triggerEl = popover.triggerElement;\n      const popupEl = internalRef.current;\n      if (!triggerEl || !popupEl) return;\n\n      const triggerRect = triggerEl.getBoundingClientRect();\n      const popupRect = getPopupPositionRect(popupEl);\n      const boundaryRect = document.documentElement.getBoundingClientRect();\n      const offsets = resolveOffsets(popupEl);\n\n      setManualStyle(\n        getAnchorPositionStyle(anchorName, posOpts, triggerRect, popupRect, boundaryRect, offsets) as CSSProperties\n      );\n    }\n\n    measure();\n    const triggerEl = popover.triggerElement;\n    const popupEl = internalRef.current;\n\n    let rafId = 0;\n    function reposition(): void {\n      cancelAnimationFrame(rafId);\n      rafId = requestAnimationFrame(measure);\n    }\n\n    // Re-measure after the popover has entered the top layer and whenever\n    // its own size or the trigger size changes.\n    reposition();\n\n    const resizeObserver =\n      typeof ResizeObserver === 'function'\n        ? new ResizeObserver(() => {\n            reposition();\n          })\n        : null;\n\n    if (triggerEl && resizeObserver) {\n      resizeObserver.observe(triggerEl);\n    }\n\n    if (popupEl && resizeObserver) {\n      resizeObserver.observe(popupEl);\n    }\n\n    window.addEventListener('scroll', reposition, { capture: true, passive: true });\n    window.addEventListener('resize', reposition);\n\n    return () => {\n      cancelAnimationFrame(rafId);\n      resizeObserver?.disconnect();\n      window.removeEventListener('scroll', reposition, true);\n      window.removeEventListener('resize', reposition);\n    };\n  }, [state.open, anchorName, posOpts, popover]);\n\n  // Anchor path uses computed styles; manual path uses measured styles;\n  // fallback resets UA [popover] defaults until positioning is computed.\n  const positioningStyle = anchorStyle ?? manualStyle ?? POPOVER_RESET;\n\n  // --- Visibility ---\n\n  if (!state.open) {\n    return null;\n  }\n\n  // Remap DOM focus events to React synthetic event names.\n  const { onFocusOut, ...restPopupProps } = popover.popupProps;\n\n  return renderElement(\n    'div',\n    { render, className, style },\n    {\n      state,\n      stateAttrMap,\n      ref: composedRef,\n      props: [\n        {\n          id: popupId,\n          style: positioningStyle,\n          ...core.getPopupAttrs(state),\n        },\n        { ...restPopupProps, onBlur: onFocusOut },\n        elementProps,\n      ],\n    }\n  );\n});\n\nexport namespace PopoverPopup {\n  export type Props = PopoverPopupProps;\n  export type State = PopoverState;\n}\n"],"mappings":";;;;;;;;AAeA,MAAM,gBAA+B;CAAE,UAAU;CAAS,OAAO;CAAQ,QAAQ;CAAG;;AAGpF,MAAa,eAAe,WAA8C,SAAS,aACjF,EAAE,QAAQ,WAAW,OAAO,GAAG,gBAC/B,cACA;CACA,MAAM,EAAE,MAAM,SAAS,OAAO,cAAc,YAAY,YAAY,mBAAmB;CACvF,MAAM,cAAc,OAAuB,KAAK;CAYhD,MAAM,cAAc,gBAAgB,cAVnB,aACd,OAA8B;AAC7B,UAAQ,gBAAgB,GAAG;AAC3B,MAAI,MAAM,2BAA2B,CACnC,IAAG,MAAM,YAAY,mBAAmB,KAAK,aAAa;IAG9D,CAAC,SAAS,WAAW,CACtB,EAE2D,YAAY;CAIxE,MAAM,UAAU,eAAe;EAAE,MAAM,MAAM;EAAM,OAAO,MAAM;EAAO,GAAG,CAAC,MAAM,MAAM,MAAM,MAAM,CAAC;CAKpG,MAAM,cAAc,cAAc;AAChC,MAAI,CAAC,2BAA2B,CAAE,QAAO;EACzC,MAAM,EAAE,gBAAgB,GAAG,GAAG,SAAS,uBAAuB,YAAY,QAAQ;AAClF,SAAO;IACN,CAAC,YAAY,QAAQ,CAAC;CAGzB,MAAM,CAAC,aAAa,kBAAkB,SAA+B,KAAK;AAE1E,uBAAsB;AACpB,MAAI,2BAA2B,CAAE;AACjC,MAAI,CAAC,MAAM,MAAM;AACf,kBAAe,KAAK;AACpB;;EAGF,SAAS,UAAgB;GACvB,MAAM,YAAY,QAAQ;GAC1B,MAAM,UAAU,YAAY;AAC5B,OAAI,CAAC,aAAa,CAAC,QAAS;AAO5B,kBACE,uBAAuB,YAAY,SANjB,UAAU,uBAAuB,EACnC,qBAAqB,QAAQ,EAC1B,SAAS,gBAAgB,uBAAuB,EACrD,eAAe,QAAQ,CAGqD,CAC3F;;AAGH,WAAS;EACT,MAAM,YAAY,QAAQ;EAC1B,MAAM,UAAU,YAAY;EAE5B,IAAI,QAAQ;EACZ,SAAS,aAAmB;AAC1B,wBAAqB,MAAM;AAC3B,WAAQ,sBAAsB,QAAQ;;AAKxC,cAAY;EAEZ,MAAM,iBACJ,OAAO,mBAAmB,aACtB,IAAI,qBAAqB;AACvB,eAAY;IACZ,GACF;AAEN,MAAI,aAAa,eACf,gBAAe,QAAQ,UAAU;AAGnC,MAAI,WAAW,eACb,gBAAe,QAAQ,QAAQ;AAGjC,SAAO,iBAAiB,UAAU,YAAY;GAAE,SAAS;GAAM,SAAS;GAAM,CAAC;AAC/E,SAAO,iBAAiB,UAAU,WAAW;AAE7C,eAAa;AACX,wBAAqB,MAAM;AAC3B,mBAAgB,YAAY;AAC5B,UAAO,oBAAoB,UAAU,YAAY,KAAK;AACtD,UAAO,oBAAoB,UAAU,WAAW;;IAEjD;EAAC,MAAM;EAAM;EAAY;EAAS;EAAQ,CAAC;CAI9C,MAAM,mBAAmB,eAAe,eAAe;AAIvD,KAAI,CAAC,MAAM,KACT,QAAO;CAIT,MAAM,EAAE,YAAY,GAAG,mBAAmB,QAAQ;AAElD,QAAO,cACL,OACA;EAAE;EAAQ;EAAW;EAAO,EAC5B;EACE;EACA;EACA,KAAK;EACL,OAAO;GACL;IACE,IAAI;IACJ,OAAO;IACP,GAAG,KAAK,cAAc,MAAM;IAC7B;GACD;IAAE,GAAG;IAAgB,QAAQ;IAAY;GACzC;GACD;EACF,CACF;EACD"}
+{"version":3,"file":"popover-popup.js","names":[],"sources":["../../../../src/ui/popover/popover-popup.tsx"],"sourcesContent":["'use client';\n\nimport type { PopoverState } from '@videojs/core';\nimport {\n  getAnchorPositionStyle,\n  getPopupPositionRect,\n  getPositioningBoundaryRect,\n  isEventWithinElement,\n  resolveOffsets,\n  resolvePositioningBoundary,\n} from '@videojs/core/dom';\nimport { supportsAnchorPositioning } from '@videojs/utils/dom';\nimport type { CSSProperties } from 'react';\nimport { forwardRef, useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { useComposedRefs } from '../../utils/use-composed-refs';\nimport { renderElement } from '../../utils/use-render';\nimport { usePopoverContext } from './context';\n\nexport interface PopoverPopupProps extends UIComponentProps<'div', PopoverState> {}\n\nconst POPOVER_RESET: CSSProperties = { position: 'fixed', inset: 'auto', margin: 0 };\n\n/** Container for the popover content. Positioned relative to the trigger using CSS anchor positioning with a JavaScript fallback. */\nexport const PopoverPopup = forwardRef<HTMLDivElement, PopoverPopupProps>(function PopoverPopup(\n  { render, className, style, ...elementProps },\n  forwardedRef\n) {\n  const { core, popover, state, stateAttrMap, anchorName, popupId, boundary, container } = usePopoverContext();\n  const internalRef = useRef<HTMLDivElement>(null);\n\n  const popupRef = useCallback(\n    (el: HTMLDivElement | null) => {\n      popover.setPopupElement(el);\n      if (el && supportsAnchorPositioning()) {\n        el.style.setProperty('position-anchor', `--${anchorName}`);\n      }\n    },\n    [popover, anchorName]\n  );\n\n  const composedRef = useComposedRefs(forwardedRef, popupRef, internalRef);\n\n  // --- Positioning ---\n\n  const posOpts = useMemo(() => ({ side: state.side, align: state.align }), [state.side, state.align]);\n\n  // CSS Anchor Positioning — computed from state, no measurement needed.\n  // `position-anchor` is set imperatively in the ref callback above\n  // because React's style prop silently drops unrecognised CSS properties.\n  const anchorStyle = useMemo(() => {\n    if (!supportsAnchorPositioning()) return null;\n    const { positionAnchor: _, ...rest } = getAnchorPositionStyle(anchorName, posOpts);\n    return rest as CSSProperties;\n  }, [anchorName, posOpts]);\n\n  // Manual fallback — measure rects after layout, before paint.\n  const [manualStyle, setManualStyle] = useState<CSSProperties | null>(null);\n\n  useLayoutEffect(() => {\n    if (!state.open) {\n      setManualStyle(null);\n      return;\n    }\n\n    function measure(): void {\n      const triggerEl = popover.triggerElement;\n      const popupEl = internalRef.current;\n      if (!triggerEl || !popupEl) return;\n\n      const triggerRect = triggerEl.getBoundingClientRect();\n      const root = popupEl.getRootNode() as Document | ShadowRoot;\n      const boundaryElement = resolvePositioningBoundary(boundary, { container, root });\n      const popupRect = supportsAnchorPositioning() ? undefined : getPopupPositionRect(popupEl);\n      const boundaryRect = getPositioningBoundaryRect(boundaryElement);\n      const offsets = resolveOffsets(popupEl);\n\n      const { positionAnchor: _, ...nextStyle } = getAnchorPositionStyle(\n        anchorName,\n        posOpts,\n        triggerRect,\n        popupRect,\n        boundaryRect,\n        offsets\n      );\n\n      setManualStyle(nextStyle as CSSProperties);\n    }\n\n    measure();\n    const triggerEl = popover.triggerElement;\n    const popupEl = internalRef.current;\n    const boundaryElement = popupEl\n      ? resolvePositioningBoundary(boundary, {\n          container,\n          root: popupEl.getRootNode() as Document | ShadowRoot,\n        })\n      : null;\n\n    let rafId = 0;\n    function reposition(event?: Event): void {\n      if (event && isEventWithinElement(event, internalRef.current)) return;\n\n      cancelAnimationFrame(rafId);\n      rafId = requestAnimationFrame(measure);\n    }\n\n    // Re-measure after the popover has entered the top layer and whenever\n    // its own size or the trigger size changes.\n    reposition();\n\n    const resizeObserver =\n      typeof ResizeObserver === 'function'\n        ? new ResizeObserver(() => {\n            reposition();\n          })\n        : null;\n\n    if (triggerEl && resizeObserver) {\n      resizeObserver.observe(triggerEl);\n    }\n\n    if (popupEl && resizeObserver) {\n      resizeObserver.observe(popupEl);\n    }\n    if (boundaryElement && resizeObserver) {\n      resizeObserver.observe(boundaryElement);\n    }\n\n    window.addEventListener('scroll', reposition, { capture: true, passive: true });\n    window.addEventListener('resize', reposition);\n\n    return () => {\n      cancelAnimationFrame(rafId);\n      resizeObserver?.disconnect();\n      window.removeEventListener('scroll', reposition, true);\n      window.removeEventListener('resize', reposition);\n    };\n  }, [state.open, anchorName, posOpts, popover, boundary, container]);\n\n  // Anchor path uses computed styles; manual path uses measured styles;\n  // fallback resets UA [popover] defaults until positioning is computed.\n  const positioningStyle = manualStyle ?? anchorStyle ?? POPOVER_RESET;\n\n  // --- Visibility ---\n\n  if (!state.open) {\n    return null;\n  }\n\n  // Remap DOM focus events to React synthetic event names.\n  const { onFocusOut, ...restPopupProps } = popover.popupProps;\n\n  return renderElement(\n    'div',\n    { render, className, style },\n    {\n      state,\n      stateAttrMap,\n      ref: composedRef,\n      props: [\n        {\n          id: popupId,\n          style: positioningStyle,\n          ...core.getPopupAttrs(state),\n        },\n        { ...restPopupProps, onBlur: onFocusOut },\n        elementProps,\n      ],\n    }\n  );\n});\n\nexport namespace PopoverPopup {\n  export type Props = PopoverPopupProps;\n  export type State = PopoverState;\n}\n"],"mappings":";;;;;;;;AAsBA,MAAM,gBAA+B;CAAE,UAAU;CAAS,OAAO;CAAQ,QAAQ;CAAG;;AAGpF,MAAa,eAAe,WAA8C,SAAS,aACjF,EAAE,QAAQ,WAAW,OAAO,GAAG,gBAC/B,cACA;CACA,MAAM,EAAE,MAAM,SAAS,OAAO,cAAc,YAAY,SAAS,UAAU,cAAc,mBAAmB;CAC5G,MAAM,cAAc,OAAuB,KAAK;CAYhD,MAAM,cAAc,gBAAgB,cAVnB,aACd,OAA8B;AAC7B,UAAQ,gBAAgB,GAAG;AAC3B,MAAI,MAAM,2BAA2B,CACnC,IAAG,MAAM,YAAY,mBAAmB,KAAK,aAAa;IAG9D,CAAC,SAAS,WAAW,CACtB,EAE2D,YAAY;CAIxE,MAAM,UAAU,eAAe;EAAE,MAAM,MAAM;EAAM,OAAO,MAAM;EAAO,GAAG,CAAC,MAAM,MAAM,MAAM,MAAM,CAAC;CAKpG,MAAM,cAAc,cAAc;AAChC,MAAI,CAAC,2BAA2B,CAAE,QAAO;EACzC,MAAM,EAAE,gBAAgB,GAAG,GAAG,SAAS,uBAAuB,YAAY,QAAQ;AAClF,SAAO;IACN,CAAC,YAAY,QAAQ,CAAC;CAGzB,MAAM,CAAC,aAAa,kBAAkB,SAA+B,KAAK;AAE1E,uBAAsB;AACpB,MAAI,CAAC,MAAM,MAAM;AACf,kBAAe,KAAK;AACpB;;EAGF,SAAS,UAAgB;GACvB,MAAM,YAAY,QAAQ;GAC1B,MAAM,UAAU,YAAY;AAC5B,OAAI,CAAC,aAAa,CAAC,QAAS;GAE5B,MAAM,cAAc,UAAU,uBAAuB;GAErD,MAAM,kBAAkB,2BAA2B,UAAU;IAAE;IAAW,MAD7D,QAAQ,aAAa;IAC8C,CAAC;GAKjF,MAAM,EAAE,gBAAgB,GAAG,GAAG,cAAc,uBAC1C,YACA,SACA,aAPgB,2BAA2B,GAAG,KAAA,IAAY,qBAAqB,QAAQ,EACpE,2BAA2B,gBAAgB,EAChD,eAAe,QAAQ,CAStC;AAED,kBAAe,UAA2B;;AAG5C,WAAS;EACT,MAAM,YAAY,QAAQ;EAC1B,MAAM,UAAU,YAAY;EAC5B,MAAM,kBAAkB,UACpB,2BAA2B,UAAU;GACnC;GACA,MAAM,QAAQ,aAAa;GAC5B,CAAC,GACF;EAEJ,IAAI,QAAQ;EACZ,SAAS,WAAW,OAAqB;AACvC,OAAI,SAAS,qBAAqB,OAAO,YAAY,QAAQ,CAAE;AAE/D,wBAAqB,MAAM;AAC3B,WAAQ,sBAAsB,QAAQ;;AAKxC,cAAY;EAEZ,MAAM,iBACJ,OAAO,mBAAmB,aACtB,IAAI,qBAAqB;AACvB,eAAY;IACZ,GACF;AAEN,MAAI,aAAa,eACf,gBAAe,QAAQ,UAAU;AAGnC,MAAI,WAAW,eACb,gBAAe,QAAQ,QAAQ;AAEjC,MAAI,mBAAmB,eACrB,gBAAe,QAAQ,gBAAgB;AAGzC,SAAO,iBAAiB,UAAU,YAAY;GAAE,SAAS;GAAM,SAAS;GAAM,CAAC;AAC/E,SAAO,iBAAiB,UAAU,WAAW;AAE7C,eAAa;AACX,wBAAqB,MAAM;AAC3B,mBAAgB,YAAY;AAC5B,UAAO,oBAAoB,UAAU,YAAY,KAAK;AACtD,UAAO,oBAAoB,UAAU,WAAW;;IAEjD;EAAC,MAAM;EAAM;EAAY;EAAS;EAAS;EAAU;EAAU,CAAC;CAInE,MAAM,mBAAmB,eAAe,eAAe;AAIvD,KAAI,CAAC,MAAM,KACT,QAAO;CAIT,MAAM,EAAE,YAAY,GAAG,mBAAmB,QAAQ;AAElD,QAAO,cACL,OACA;EAAE;EAAQ;EAAW;EAAO,EAC5B;EACE;EACA;EACA,KAAK;EACL,OAAO;GACL;IACE,IAAI;IACJ,OAAO;IACP,GAAG,KAAK,cAAc,MAAM;IAC7B;GACD;IAAE,GAAG;IAAgB,QAAQ;IAAY;GACzC;GACD;EACF,CACF;EACD"}

package/dist/dev/ui/popover/popover-root.d.ts

@@ -1,9 +1,11 @@
-import { PopoverChangeDetails } from "@videojs/core/dom";
+import { PopoverChangeDetails, PositioningBoundary } from "@videojs/core/dom";
 import { ReactNode } from "react";
 import { PopoverProps } from "@videojs/core";
 
 //#region src/ui/popover/popover-root.d.ts
 interface PopoverRootProps extends PopoverProps {
+  /** Boundary used to constrain the popup size. */
+  boundary?: PositioningBoundary;
   /** Called when the popover open state changes (fires immediately, before animations). */
   onOpenChange?: (open: boolean, details: PopoverChangeDetails) => void;
   /** Called after open/close animations complete. */
@@ -18,6 +20,7 @@ declare function PopoverRoot({
   openOnHover,
   delay,
   closeDelay,
+  boundary,
   children,
   ...coreProps
 }: PopoverRootProps): ReactNode;

package/dist/dev/ui/popover/popover-root.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popover-root.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-root.tsx"],"mappings":";;;;;UAaiB,gBAAA,SAAyB,YAAA;;EAExC,YAAA,IAAgB,IAAA,WAAe,OAAA,EAAS,oBAAA;EAFR;EAIhC,oBAAA,IAAwB,IAAA;EACxB,QAAA,GAAW,SAAA;AAAA;AAAA,iBAGG,WAAA,CAAA;EACd,IAAA,EAAM,cAAA;EACN,WAAA;EACA,YAAA,EAAc,gBAAA;EACd,oBAAA,EAAsB,wBAAA;EACtB,WAAA;EACA,KAAA;EACA,UAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,gBAAA,GAAmB,SAAA;AAAA,kBAsEL,WAAA;EAAA,KACH,KAAA,GAAQ,gBAAA;AAAA"}
+{"version":3,"file":"popover-root.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-root.tsx"],"mappings":";;;;;UAoBiB,gBAAA,SAAyB,YAAA;;EAExC,QAAA,GAAW,mBAAA;EAFqB;EAIhC,YAAA,IAAgB,IAAA,WAAe,OAAA,EAAS,oBAAA;EAF7B;EAIX,oBAAA,IAAwB,IAAA;EACxB,QAAA,GAAW,SAAA;AAAA;AAAA,iBAGG,WAAA,CAAA;EACd,IAAA,EAAM,cAAA;EACN,WAAA;EACA,YAAA,EAAc,gBAAA;EACd,oBAAA,EAAsB,wBAAA;EACtB,WAAA;EACA,KAAA;EACA,UAAA;EACA,QAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,gBAAA,GAAmB,SAAA;AAAA,kBAoFL,WAAA;EAAA,KACH,KAAA,GAAQ,gBAAA;AAAA"}

package/dist/dev/ui/popover/popover-root.js

@@ -1,18 +1,24 @@
 "use client";
+import { useOptionalContainer, useOptionalPopupGroup } from "../../player/context.js";
 import { useLatestRef } from "../../utils/use-latest-ref.js";
 import { useDestroy } from "../../utils/use-destroy.js";
 import { useSafeId } from "../../utils/use-safe-id.js";
+import { useOptionalControlsContext } from "../controls/context.js";
 import { PopoverContextProvider } from "./context.js";
 import { createPopover, createTransition } from "@videojs/core/dom";
 import { useSnapshot } from "@videojs/store/react";
 import { useEffect, useState } from "react";
+import { isUndefined } from "@videojs/utils/predicate";
 import { jsx } from "react/jsx-runtime";
 import { PopoverCore, PopoverDataAttrs } from "@videojs/core";
 //#region src/ui/popover/popover-root.tsx
-function PopoverRoot({ open: controlledOpen, defaultOpen = PopoverCore.defaultProps.defaultOpen, onOpenChange: onOpenChangeProp, onOpenChangeComplete: onOpenChangeCompleteProp, openOnHover = PopoverCore.defaultProps.openOnHover, delay = PopoverCore.defaultProps.delay, closeDelay = PopoverCore.defaultProps.closeDelay, children, ...coreProps }) {
+function PopoverRoot({ open: controlledOpen, defaultOpen = PopoverCore.defaultProps.defaultOpen, onOpenChange: onOpenChangeProp, onOpenChangeComplete: onOpenChangeCompleteProp, openOnHover = PopoverCore.defaultProps.openOnHover, delay = PopoverCore.defaultProps.delay, closeDelay = PopoverCore.defaultProps.closeDelay, boundary = "container", children, ...coreProps }) {
+	const container = useOptionalContainer();
+	const popupGroup = useOptionalPopupGroup();
+	const controls = useOptionalControlsContext();
 	const [core] = useState(() => new PopoverCore(coreProps));
 	core.setProps(coreProps);
-	const isControlled = controlledOpen !== void 0;
+	const isControlled = !isUndefined(controlledOpen);
 	const onOpenChangeRef = useLatestRef(onOpenChangeProp);
 	const onOpenChangeCompleteRef = useLatestRef(onOpenChangeCompleteProp);
 	const closeOnEscapeRef = useLatestRef(coreProps.closeOnEscape);
@@ -20,6 +26,7 @@ function PopoverRoot({ open: controlledOpen, defaultOpen = PopoverCore.defaultPr
 	const openOnHoverRef = useLatestRef(openOnHover);
 	const delayRef = useLatestRef(delay);
 	const closeDelayRef = useLatestRef(closeDelay);
+	const popupGroupRef = useLatestRef(popupGroup);
 	const [popover] = useState(() => {
 		const instance = createPopover({
 			transition: createTransition(),
@@ -33,7 +40,8 @@ function PopoverRoot({ open: controlledOpen, defaultOpen = PopoverCore.defaultPr
 			closeOnOutsideClick: () => closeOnOutsideClickRef.current ?? PopoverCore.defaultProps.closeOnOutsideClick,
 			openOnHover: () => openOnHoverRef.current,
 			delay: () => delayRef.current,
-			closeDelay: () => closeDelayRef.current
+			closeDelay: () => closeDelayRef.current,
+			group: () => popupGroupRef.current
 		});
 		if (!isControlled && defaultOpen) instance.open("click");
 		return instance;
@@ -41,12 +49,17 @@ function PopoverRoot({ open: controlledOpen, defaultOpen = PopoverCore.defaultPr
 	const anchorName = useSafeId();
 	const popupId = useSafeId("popup");
 	useEffect(() => {
-		if (controlledOpen === void 0) return;
+		if (isUndefined(controlledOpen)) return;
 		const { active: inputOpen } = popover.input.current;
 		if (controlledOpen === inputOpen) return;
 		if (controlledOpen) popover.open("click");
 		else popover.close("click");
 	}, [controlledOpen, popover]);
+	useEffect(() => {
+		if (isUndefined(controls?.state.visible)) return;
+		if (controls.state.visible) return;
+		popover.close("imperative-action");
+	}, [controls?.state.visible, popover]);
 	useDestroy(popover);
 	const input = useSnapshot(popover.input);
 	core.setInput(input);
@@ -57,7 +70,9 @@ function PopoverRoot({ open: controlledOpen, defaultOpen = PopoverCore.defaultPr
 			state: core.getState(),
 			stateAttrMap: PopoverDataAttrs,
 			anchorName,
-			popupId
+			popupId,
+			boundary,
+			container
 		},
 		children
 	});

package/dist/dev/ui/popover/popover-root.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover-root.js","names":[],"sources":["../../../../src/ui/popover/popover-root.tsx"],"sourcesContent":["'use client';\n\nimport { type PopoverProps as CorePopoverProps, PopoverCore, PopoverDataAttrs } from '@videojs/core';\nimport { createPopover, createTransition, type PopoverChangeDetails } 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 { PopoverContextProvider } from './context';\n\nexport interface PopoverRootProps extends CorePopoverProps {\n  /** Called when the popover open state changes (fires immediately, before animations). */\n  onOpenChange?: (open: boolean, details: PopoverChangeDetails) => void;\n  /** Called after open/close animations complete. */\n  onOpenChangeComplete?: (open: boolean) => void;\n  children?: ReactNode;\n}\n\nexport function PopoverRoot({\n  open: controlledOpen,\n  defaultOpen = PopoverCore.defaultProps.defaultOpen,\n  onOpenChange: onOpenChangeProp,\n  onOpenChangeComplete: onOpenChangeCompleteProp,\n  openOnHover = PopoverCore.defaultProps.openOnHover,\n  delay = PopoverCore.defaultProps.delay,\n  closeDelay = PopoverCore.defaultProps.closeDelay,\n  children,\n  ...coreProps\n}: PopoverRootProps): ReactNode {\n  const [core] = useState(() => new PopoverCore(coreProps));\n  core.setProps(coreProps);\n\n  const isControlled = controlledOpen !== undefined;\n\n  // Keep refs that always point to the latest values so the\n  // createPopover closure never reads stale props.\n  const onOpenChangeRef = useLatestRef(onOpenChangeProp);\n  const onOpenChangeCompleteRef = useLatestRef(onOpenChangeCompleteProp);\n  const closeOnEscapeRef = useLatestRef(coreProps.closeOnEscape);\n  const closeOnOutsideClickRef = useLatestRef(coreProps.closeOnOutsideClick);\n  const openOnHoverRef = useLatestRef(openOnHover);\n  const delayRef = useLatestRef(delay);\n  const closeDelayRef = useLatestRef(closeDelay);\n\n  const [popover] = useState(() => {\n    const instance = createPopover({\n      transition: createTransition(),\n      onOpenChange: (nextOpen: boolean, details: PopoverChangeDetails) => {\n        onOpenChangeRef.current?.(nextOpen, details);\n      },\n      onOpenChangeComplete: (nextOpen: boolean) => {\n        onOpenChangeCompleteRef.current?.(nextOpen);\n      },\n      closeOnEscape: () => closeOnEscapeRef.current ?? PopoverCore.defaultProps.closeOnEscape,\n      closeOnOutsideClick: () => closeOnOutsideClickRef.current ?? PopoverCore.defaultProps.closeOnOutsideClick,\n      openOnHover: () => openOnHoverRef.current,\n      delay: () => delayRef.current,\n      closeDelay: () => closeDelayRef.current,\n    });\n\n    // Apply defaultOpen on creation (uncontrolled only)\n    if (!isControlled && defaultOpen) {\n      instance.open('click');\n    }\n\n    return instance;\n  });\n\n  const anchorName = useSafeId();\n  const popupId = useSafeId('popup');\n\n  // Sync controlled open prop -> internal input state.\n  useEffect(() => {\n    if (controlledOpen === undefined) return;\n\n    const { active: inputOpen } = popover.input.current;\n    if (controlledOpen === inputOpen) return;\n\n    if (controlledOpen) {\n      popover.open('click');\n    } else {\n      popover.close('click');\n    }\n  }, [controlledOpen, popover]);\n\n  useDestroy(popover);\n\n  const input = useSnapshot(popover.input);\n  core.setInput(input);\n  const state = core.getState();\n\n  return (\n    <PopoverContextProvider value={{ core, popover, state, stateAttrMap: PopoverDataAttrs, anchorName, popupId }}>\n      {children}\n    </PopoverContextProvider>\n  );\n}\n\nexport namespace PopoverRoot {\n  export type Props = PopoverRootProps;\n}\n"],"mappings":";;;;;;;;;;;AAqBA,SAAgB,YAAY,EAC1B,MAAM,gBACN,cAAc,YAAY,aAAa,aACvC,cAAc,kBACd,sBAAsB,0BACtB,cAAc,YAAY,aAAa,aACvC,QAAQ,YAAY,aAAa,OACjC,aAAa,YAAY,aAAa,YACtC,UACA,GAAG,aAC2B;CAC9B,MAAM,CAAC,QAAQ,eAAe,IAAI,YAAY,UAAU,CAAC;AACzD,MAAK,SAAS,UAAU;CAExB,MAAM,eAAe,mBAAmB,KAAA;CAIxC,MAAM,kBAAkB,aAAa,iBAAiB;CACtD,MAAM,0BAA0B,aAAa,yBAAyB;CACtE,MAAM,mBAAmB,aAAa,UAAU,cAAc;CAC9D,MAAM,yBAAyB,aAAa,UAAU,oBAAoB;CAC1E,MAAM,iBAAiB,aAAa,YAAY;CAChD,MAAM,WAAW,aAAa,MAAM;CACpC,MAAM,gBAAgB,aAAa,WAAW;CAE9C,MAAM,CAAC,WAAW,eAAe;EAC/B,MAAM,WAAW,cAAc;GAC7B,YAAY,kBAAkB;GAC9B,eAAe,UAAmB,YAAkC;AAClE,oBAAgB,UAAU,UAAU,QAAQ;;GAE9C,uBAAuB,aAAsB;AAC3C,4BAAwB,UAAU,SAAS;;GAE7C,qBAAqB,iBAAiB,WAAW,YAAY,aAAa;GAC1E,2BAA2B,uBAAuB,WAAW,YAAY,aAAa;GACtF,mBAAmB,eAAe;GAClC,aAAa,SAAS;GACtB,kBAAkB,cAAc;GACjC,CAAC;AAGF,MAAI,CAAC,gBAAgB,YACnB,UAAS,KAAK,QAAQ;AAGxB,SAAO;GACP;CAEF,MAAM,aAAa,WAAW;CAC9B,MAAM,UAAU,UAAU,QAAQ;AAGlC,iBAAgB;AACd,MAAI,mBAAmB,KAAA,EAAW;EAElC,MAAM,EAAE,QAAQ,cAAc,QAAQ,MAAM;AAC5C,MAAI,mBAAmB,UAAW;AAElC,MAAI,eACF,SAAQ,KAAK,QAAQ;MAErB,SAAQ,MAAM,QAAQ;IAEvB,CAAC,gBAAgB,QAAQ,CAAC;AAE7B,YAAW,QAAQ;CAEnB,MAAM,QAAQ,YAAY,QAAQ,MAAM;AACxC,MAAK,SAAS,MAAM;AAGpB,QACE,oBAAC,wBAAD;EAAwB,OAAO;GAAE;GAAM;GAAS,OAHpC,KAAK,UAAU;GAG4B,cAAc;GAAkB;GAAY;GAAS;EACzG;EACsB,CAAA"}
+{"version":3,"file":"popover-root.js","names":[],"sources":["../../../../src/ui/popover/popover-root.tsx"],"sourcesContent":["'use client';\n\nimport { type PopoverProps as CorePopoverProps, PopoverCore, PopoverDataAttrs } from '@videojs/core';\nimport {\n  createPopover,\n  createTransition,\n  type PopoverChangeDetails,\n  type PositioningBoundary,\n} from '@videojs/core/dom';\nimport { useSnapshot } from '@videojs/store/react';\nimport { isUndefined } from '@videojs/utils/predicate';\nimport type { ReactNode } from 'react';\nimport { useEffect, useState } from 'react';\nimport { useOptionalContainer, useOptionalPopupGroup } from '../../player/context';\nimport { useDestroy } from '../../utils/use-destroy';\nimport { useLatestRef } from '../../utils/use-latest-ref';\nimport { useSafeId } from '../../utils/use-safe-id';\nimport { useOptionalControlsContext } from '../controls/context';\nimport { PopoverContextProvider } from './context';\n\nexport interface PopoverRootProps extends CorePopoverProps {\n  /** Boundary used to constrain the popup size. */\n  boundary?: PositioningBoundary;\n  /** Called when the popover open state changes (fires immediately, before animations). */\n  onOpenChange?: (open: boolean, details: PopoverChangeDetails) => void;\n  /** Called after open/close animations complete. */\n  onOpenChangeComplete?: (open: boolean) => void;\n  children?: ReactNode;\n}\n\nexport function PopoverRoot({\n  open: controlledOpen,\n  defaultOpen = PopoverCore.defaultProps.defaultOpen,\n  onOpenChange: onOpenChangeProp,\n  onOpenChangeComplete: onOpenChangeCompleteProp,\n  openOnHover = PopoverCore.defaultProps.openOnHover,\n  delay = PopoverCore.defaultProps.delay,\n  closeDelay = PopoverCore.defaultProps.closeDelay,\n  boundary = 'container',\n  children,\n  ...coreProps\n}: PopoverRootProps): ReactNode {\n  const container = useOptionalContainer();\n  const popupGroup = useOptionalPopupGroup();\n  const controls = useOptionalControlsContext();\n  const [core] = useState(() => new PopoverCore(coreProps));\n  core.setProps(coreProps);\n\n  const isControlled = !isUndefined(controlledOpen);\n\n  // Keep refs that always point to the latest values so the\n  // createPopover closure never reads stale props.\n  const onOpenChangeRef = useLatestRef(onOpenChangeProp);\n  const onOpenChangeCompleteRef = useLatestRef(onOpenChangeCompleteProp);\n  const closeOnEscapeRef = useLatestRef(coreProps.closeOnEscape);\n  const closeOnOutsideClickRef = useLatestRef(coreProps.closeOnOutsideClick);\n  const openOnHoverRef = useLatestRef(openOnHover);\n  const delayRef = useLatestRef(delay);\n  const closeDelayRef = useLatestRef(closeDelay);\n  const popupGroupRef = useLatestRef(popupGroup);\n\n  const [popover] = useState(() => {\n    const instance = createPopover({\n      transition: createTransition(),\n      onOpenChange: (nextOpen: boolean, details: PopoverChangeDetails) => {\n        onOpenChangeRef.current?.(nextOpen, details);\n      },\n      onOpenChangeComplete: (nextOpen: boolean) => {\n        onOpenChangeCompleteRef.current?.(nextOpen);\n      },\n      closeOnEscape: () => closeOnEscapeRef.current ?? PopoverCore.defaultProps.closeOnEscape,\n      closeOnOutsideClick: () => closeOnOutsideClickRef.current ?? PopoverCore.defaultProps.closeOnOutsideClick,\n      openOnHover: () => openOnHoverRef.current,\n      delay: () => delayRef.current,\n      closeDelay: () => closeDelayRef.current,\n      group: () => popupGroupRef.current,\n    });\n\n    // Apply defaultOpen on creation (uncontrolled only)\n    if (!isControlled && defaultOpen) {\n      instance.open('click');\n    }\n\n    return instance;\n  });\n\n  const anchorName = useSafeId();\n  const popupId = useSafeId('popup');\n\n  // Sync controlled open prop -> internal input state.\n  useEffect(() => {\n    if (isUndefined(controlledOpen)) return;\n\n    const { active: inputOpen } = popover.input.current;\n    if (controlledOpen === inputOpen) return;\n\n    if (controlledOpen) {\n      popover.open('click');\n    } else {\n      popover.close('click');\n    }\n  }, [controlledOpen, popover]);\n\n  useEffect(() => {\n    if (isUndefined(controls?.state.visible)) return;\n    if (controls.state.visible) return;\n\n    popover.close('imperative-action');\n  }, [controls?.state.visible, popover]);\n\n  useDestroy(popover);\n\n  const input = useSnapshot(popover.input);\n  core.setInput(input);\n  const state = core.getState();\n\n  return (\n    <PopoverContextProvider\n      value={{ core, popover, state, stateAttrMap: PopoverDataAttrs, anchorName, popupId, boundary, container }}\n    >\n      {children}\n    </PopoverContextProvider>\n  );\n}\n\nexport namespace PopoverRoot {\n  export type Props = PopoverRootProps;\n}\n"],"mappings":";;;;;;;;;;;;;;AA8BA,SAAgB,YAAY,EAC1B,MAAM,gBACN,cAAc,YAAY,aAAa,aACvC,cAAc,kBACd,sBAAsB,0BACtB,cAAc,YAAY,aAAa,aACvC,QAAQ,YAAY,aAAa,OACjC,aAAa,YAAY,aAAa,YACtC,WAAW,aACX,UACA,GAAG,aAC2B;CAC9B,MAAM,YAAY,sBAAsB;CACxC,MAAM,aAAa,uBAAuB;CAC1C,MAAM,WAAW,4BAA4B;CAC7C,MAAM,CAAC,QAAQ,eAAe,IAAI,YAAY,UAAU,CAAC;AACzD,MAAK,SAAS,UAAU;CAExB,MAAM,eAAe,CAAC,YAAY,eAAe;CAIjD,MAAM,kBAAkB,aAAa,iBAAiB;CACtD,MAAM,0BAA0B,aAAa,yBAAyB;CACtE,MAAM,mBAAmB,aAAa,UAAU,cAAc;CAC9D,MAAM,yBAAyB,aAAa,UAAU,oBAAoB;CAC1E,MAAM,iBAAiB,aAAa,YAAY;CAChD,MAAM,WAAW,aAAa,MAAM;CACpC,MAAM,gBAAgB,aAAa,WAAW;CAC9C,MAAM,gBAAgB,aAAa,WAAW;CAE9C,MAAM,CAAC,WAAW,eAAe;EAC/B,MAAM,WAAW,cAAc;GAC7B,YAAY,kBAAkB;GAC9B,eAAe,UAAmB,YAAkC;AAClE,oBAAgB,UAAU,UAAU,QAAQ;;GAE9C,uBAAuB,aAAsB;AAC3C,4BAAwB,UAAU,SAAS;;GAE7C,qBAAqB,iBAAiB,WAAW,YAAY,aAAa;GAC1E,2BAA2B,uBAAuB,WAAW,YAAY,aAAa;GACtF,mBAAmB,eAAe;GAClC,aAAa,SAAS;GACtB,kBAAkB,cAAc;GAChC,aAAa,cAAc;GAC5B,CAAC;AAGF,MAAI,CAAC,gBAAgB,YACnB,UAAS,KAAK,QAAQ;AAGxB,SAAO;GACP;CAEF,MAAM,aAAa,WAAW;CAC9B,MAAM,UAAU,UAAU,QAAQ;AAGlC,iBAAgB;AACd,MAAI,YAAY,eAAe,CAAE;EAEjC,MAAM,EAAE,QAAQ,cAAc,QAAQ,MAAM;AAC5C,MAAI,mBAAmB,UAAW;AAElC,MAAI,eACF,SAAQ,KAAK,QAAQ;MAErB,SAAQ,MAAM,QAAQ;IAEvB,CAAC,gBAAgB,QAAQ,CAAC;AAE7B,iBAAgB;AACd,MAAI,YAAY,UAAU,MAAM,QAAQ,CAAE;AAC1C,MAAI,SAAS,MAAM,QAAS;AAE5B,UAAQ,MAAM,oBAAoB;IACjC,CAAC,UAAU,MAAM,SAAS,QAAQ,CAAC;AAEtC,YAAW,QAAQ;CAEnB,MAAM,QAAQ,YAAY,QAAQ,MAAM;AACxC,MAAK,SAAS,MAAM;AAGpB,QACE,oBAAC,wBAAD;EACE,OAAO;GAAE;GAAM;GAAS,OAJd,KAAK,UAAU;GAIM,cAAc;GAAkB;GAAY;GAAS;GAAU;GAAW;EAExG;EACsB,CAAA"}

package/dist/dev/ui/popover/popover-trigger.d.ts

@@ -1,11 +1,11 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as react from "react";
+import * as _$react from "react";
 import { PopoverState } from "@videojs/core";
 
 //#region src/ui/popover/popover-trigger.d.ts
 interface PopoverTriggerProps extends UIComponentProps<'button', PopoverState> {}
 /** Button that toggles the popover visibility. Renders a `<button>` element. */
-declare const PopoverTrigger: react.ForwardRefExoticComponent<Omit<PopoverTriggerProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const PopoverTrigger: _$react.ForwardRefExoticComponent<Omit<PopoverTriggerProps, "ref"> & _$react.RefAttributes<HTMLButtonElement>>;
 declare namespace PopoverTrigger {
   type Props = PopoverTriggerProps;
   type State = PopoverState;

package/dist/dev/ui/popover/popover-trigger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popover-trigger.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-trigger.tsx"],"mappings":";;;;;UAUiB,mBAAA,SAA4B,gBAAA,WAA2B,YAAA;;cAG3D,cAAA,EAAc,KAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,mBAAA,WAAA,KAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,kBAwCV,cAAA;EAAA,KACH,KAAA,GAAQ,mBAAA;EAAA,KACR,KAAA,GAAQ,YAAA;AAAA"}
+{"version":3,"file":"popover-trigger.d.ts","names":[],"sources":["../../../../src/ui/popover/popover-trigger.tsx"],"mappings":";;;;;UAUiB,mBAAA,SAA4B,gBAAA,WAA2B,YAAA;;cAG3D,cAAA,EAAc,OAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,mBAAA,WAAA,OAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,kBAwCV,cAAA;EAAA,KACH,KAAA,GAAQ,mBAAA;EAAA,KACR,KAAA,GAAQ,YAAA;AAAA"}

package/dist/dev/ui/poster/poster.d.ts

@@ -1,5 +1,5 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as react from "react";
+import * as _$react from "react";
 import { PosterCore } from "@videojs/core";
 
 //#region src/ui/poster/poster.d.ts
@@ -18,7 +18,7 @@ interface PosterProps extends UIComponentProps<'img', PosterCore.State> {}
  * />
  * ```
  */
-declare const Poster: react.ForwardRefExoticComponent<Omit<PosterProps, "ref"> & react.RefAttributes<HTMLImageElement>>;
+declare const Poster: _$react.ForwardRefExoticComponent<Omit<PosterProps, "ref"> & _$react.RefAttributes<HTMLImageElement>>;
 declare namespace Poster {
   type Props = PosterProps;
   type State = PosterCore.State;

package/dist/dev/ui/poster/poster.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"poster.d.ts","names":[],"sources":["../../../../src/ui/poster/poster.tsx"],"mappings":";;;;;UAWiB,WAAA,SAAoB,gBAAA,QAAwB,UAAA,CAAW,KAAA;;AAAxE;;;;;;;;;AAgBA;;;;cAAa,MAAA,EAAM,KAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,WAAA,WAAA,KAAA,CAAA,aAAA,CAAA,gBAAA;AAAA,kBA6BF,MAAA;EAAA,KACH,KAAA,GAAQ,WAAA;EAAA,KACR,KAAA,GAAQ,UAAA,CAAW,KAAA;AAAA"}
+{"version":3,"file":"poster.d.ts","names":[],"sources":["../../../../src/ui/poster/poster.tsx"],"mappings":";;;;;UAWiB,WAAA,SAAoB,gBAAA,QAAwB,UAAA,CAAW,KAAA;;AAAxE;;;;;;;;;AAgBA;;;;cAAa,MAAA,EAAM,OAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,WAAA,WAAA,OAAA,CAAA,aAAA,CAAA,gBAAA;AAAA,kBA6BF,MAAA;EAAA,KACH,KAAA,GAAQ,WAAA;EAAA,KACR,KAAA,GAAQ,UAAA,CAAW,KAAA;AAAA"}

package/dist/dev/ui/seek-button/seek-button.d.ts

@@ -1,5 +1,5 @@
 import { UIComponentProps } from "../../utils/types.js";
-import * as react from "react";
+import * as _$react from "react";
 import { SeekButtonCore } from "@videojs/core";
 
 //#region src/ui/seek-button/seek-button.d.ts
@@ -21,7 +21,7 @@ interface SeekButtonProps extends UIComponentProps<'button', SeekButtonCore.Stat
  * />
  * ```
  */
-declare const SeekButton: react.ForwardRefExoticComponent<SeekButtonProps & react.RefAttributes<HTMLButtonElement>>;
+declare const SeekButton: _$react.ForwardRefExoticComponent<SeekButtonProps & _$react.RefAttributes<HTMLButtonElement>>;
 declare namespace SeekButton {
   type Props = SeekButtonProps;
   type State = SeekButtonCore.State;

package/dist/dev/ui/seek-button/seek-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"seek-button.d.ts","names":[],"sources":["../../../../src/ui/seek-button/seek-button.tsx"],"mappings":";;;;;UAQiB,eAAA,SAAwB,gBAAA,WAA2B,cAAA,CAAe,KAAA,GAAQ,cAAA,CAAe,KAAA;;AAA1G;;;;;;;;;;;;;;;AAmBA;cAAa,UAAA,EAAU,KAAA,CAAA,yBAAA,CAAA,eAAA,GAAA,KAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,kBAQN,UAAA;EAAA,KACH,KAAA,GAAQ,eAAA;EAAA,KACR,KAAA,GAAQ,cAAA,CAAe,KAAA;AAAA"}
+{"version":3,"file":"seek-button.d.ts","names":[],"sources":["../../../../src/ui/seek-button/seek-button.tsx"],"mappings":";;;;;UAQiB,eAAA,SAAwB,gBAAA,WAA2B,cAAA,CAAe,KAAA,GAAQ,cAAA,CAAe,KAAA;;AAA1G;;;;;;;;;;;;;;;AAmBA;cAAa,UAAA,EAAU,OAAA,CAAA,yBAAA,CAAA,eAAA,GAAA,OAAA,CAAA,aAAA,CAAA,iBAAA;AAAA,kBAQN,UAAA;EAAA,KACH,KAAA,GAAQ,eAAA;EAAA,KACR,KAAA,GAAQ,cAAA,CAAe,KAAA;AAAA"}

package/dist/dev/ui/seek-indicator/context.js

@@ -0,0 +1,20 @@
+"use client";
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/ui/seek-indicator/context.tsx
+const SeekIndicatorContext = createContext(null);
+function SeekIndicatorProvider({ value, children }) {
+	return /* @__PURE__ */ jsx(SeekIndicatorContext.Provider, {
+		value,
+		children
+	});
+}
+function useSeekIndicatorContext() {
+	const ctx = useContext(SeekIndicatorContext);
+	if (!ctx) throw new Error("SeekIndicator child compounds must be used within a SeekIndicator.Root");
+	return ctx;
+}
+//#endregion
+export { SeekIndicatorProvider, useSeekIndicatorContext };
+
+//# sourceMappingURL=context.js.map

package/dist/dev/ui/seek-indicator/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/seek-indicator/context.tsx"],"sourcesContent":["'use client';\n\nimport type { SeekIndicatorCore } from '@videojs/core';\nimport { createContext, type ProviderProps, useContext } from 'react';\n\nexport interface SeekIndicatorContextValue {\n  state: SeekIndicatorCore.State;\n}\n\nconst SeekIndicatorContext = createContext<SeekIndicatorContextValue | null>(null);\n\nexport function SeekIndicatorProvider({ value, children }: ProviderProps<SeekIndicatorContextValue>) {\n  return <SeekIndicatorContext.Provider value={value}>{children}</SeekIndicatorContext.Provider>;\n}\n\nexport function useSeekIndicatorContext(): SeekIndicatorContextValue {\n  const ctx = useContext(SeekIndicatorContext);\n  if (!ctx) throw new Error('SeekIndicator child compounds must be used within a SeekIndicator.Root');\n  return ctx;\n}\n"],"mappings":";;;;AASA,MAAM,uBAAuB,cAAgD,KAAK;AAElF,SAAgB,sBAAsB,EAAE,OAAO,YAAsD;AACnG,QAAO,oBAAC,qBAAqB,UAAtB;EAAsC;EAAQ;EAAyC,CAAA;;AAGhG,SAAgB,0BAAqD;CACnE,MAAM,MAAM,WAAW,qBAAqB;AAC5C,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,yEAAyE;AACnG,QAAO"}

package/dist/dev/ui/seek-indicator/index.d.ts

@@ -0,0 +1,2 @@
+import { index_parts_d_exports } from "./index.parts.js";
+export { index_parts_d_exports as SeekIndicator };

package/dist/dev/ui/seek-indicator/index.js

@@ -0,0 +1,2 @@
+import { index_parts_exports } from "./index.parts.js";
+export { index_parts_exports as SeekIndicator };

package/dist/dev/ui/seek-indicator/index.parts.d.ts

@@ -0,0 +1,10 @@
+import { SeekIndicatorRoot, SeekIndicatorRootProps } from "./seek-indicator-root.js";
+import { SeekIndicatorValue, SeekIndicatorValueProps } from "./seek-indicator-value.js";
+
+//#region src/ui/seek-indicator/index.parts.d.ts
+declare namespace index_parts_d_exports {
+  export { SeekIndicatorRoot as Root, SeekIndicatorRootProps as RootProps, SeekIndicatorValue as Value, SeekIndicatorValueProps as ValueProps };
+}
+//#endregion
+export { index_parts_d_exports };
+//# sourceMappingURL=index.parts.d.ts.map

package/dist/dev/ui/seek-indicator/index.parts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.d.ts","names":[],"sources":["../../../../src/ui/seek-indicator/index.parts.ts"],"mappings":""}

package/dist/dev/ui/seek-indicator/index.parts.js

@@ -0,0 +1,12 @@
+import { __exportAll } from "../../_virtual/_rolldown/runtime.js";
+import { SeekIndicatorRoot } from "./seek-indicator-root.js";
+import { SeekIndicatorValue } from "./seek-indicator-value.js";
+//#region src/ui/seek-indicator/index.parts.ts
+var index_parts_exports = /* @__PURE__ */ __exportAll({
+	Root: () => SeekIndicatorRoot,
+	Value: () => SeekIndicatorValue
+});
+//#endregion
+export { index_parts_exports };
+
+//# sourceMappingURL=index.parts.js.map

package/dist/dev/ui/seek-indicator/index.parts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../src/ui/seek-indicator/index.parts.ts"],"sourcesContent":["export { SeekIndicatorRoot as Root, type SeekIndicatorRootProps as RootProps } from './seek-indicator-root';\nexport { SeekIndicatorValue as Value, type SeekIndicatorValueProps as ValueProps } from './seek-indicator-value';\n"],"mappings":""}

package/dist/dev/ui/seek-indicator/seek-indicator-root.d.ts

@@ -0,0 +1,14 @@
+import { UIComponentProps } from "../../utils/types.js";
+import * as _$react from "react";
+import { SeekIndicatorCore } from "@videojs/core";
+
+//#region src/ui/seek-indicator/seek-indicator-root.d.ts
+interface SeekIndicatorRootProps extends UIComponentProps<'div', SeekIndicatorCore.State>, SeekIndicatorCore.Props {}
+declare const SeekIndicatorRoot: _$react.ForwardRefExoticComponent<Omit<SeekIndicatorRootProps, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
+declare namespace SeekIndicatorRoot {
+  type Props = SeekIndicatorRootProps;
+  type State = SeekIndicatorCore.State;
+}
+//#endregion
+export { SeekIndicatorRoot, SeekIndicatorRootProps };
+//# sourceMappingURL=seek-indicator-root.d.ts.map

package/dist/dev/ui/seek-indicator/seek-indicator-root.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"seek-indicator-root.d.ts","names":[],"sources":["../../../../src/ui/seek-indicator/seek-indicator-root.tsx"],"mappings":";;;;;UAWiB,sBAAA,SACP,gBAAA,QAAwB,iBAAA,CAAkB,KAAA,GAChD,iBAAA,CAAkB,KAAA;AAAA,cAET,iBAAA,EAAiB,OAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,sBAAA,WAAA,OAAA,CAAA,aAAA,CAAA,cAAA;AAAA,kBAyBb,iBAAA;EAAA,KACH,KAAA,GAAQ,sBAAA;EAAA,KACR,KAAA,GAAQ,iBAAA,CAAkB,KAAA;AAAA"}

package/dist/dev/ui/seek-indicator/seek-indicator-root.js

@@ -0,0 +1,30 @@
+"use client";
+import { renderElement } from "../../utils/use-render.js";
+import { useInputIndicatorRoot } from "../input-indicators/use-input-indicator-root.js";
+import { SeekIndicatorProvider } from "./context.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+import { SeekIndicatorCore, SeekIndicatorDataAttrs } from "@videojs/core";
+//#region src/ui/seek-indicator/seek-indicator-root.tsx
+const SeekIndicatorRoot = forwardRef(function SeekIndicatorRoot(componentProps, forwardedRef) {
+	const { render, className, style, closeDelay, ...elementProps } = componentProps;
+	const { elementRef, present, state } = useInputIndicatorRoot(() => new SeekIndicatorCore(), { closeDelay });
+	if (!present) return null;
+	return /* @__PURE__ */ jsx(SeekIndicatorProvider, {
+		value: { state },
+		children: renderElement("div", {
+			render,
+			className,
+			style
+		}, {
+			state,
+			stateAttrMap: SeekIndicatorDataAttrs,
+			ref: [forwardedRef, elementRef],
+			props: [elementProps]
+		})
+	});
+});
+//#endregion
+export { SeekIndicatorRoot };
+
+//# sourceMappingURL=seek-indicator-root.js.map

package/dist/dev/ui/seek-indicator/seek-indicator-root.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"seek-indicator-root.js","names":[],"sources":["../../../../src/ui/seek-indicator/seek-indicator-root.tsx"],"sourcesContent":["'use client';\n\nimport { SeekIndicatorCore, SeekIndicatorDataAttrs } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useInputIndicatorRoot } from '../input-indicators/use-input-indicator-root';\nimport { SeekIndicatorProvider } from './context';\n\nexport interface SeekIndicatorRootProps\n  extends UIComponentProps<'div', SeekIndicatorCore.State>,\n    SeekIndicatorCore.Props {}\n\nexport const SeekIndicatorRoot = forwardRef(function SeekIndicatorRoot(\n  componentProps: SeekIndicatorRootProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const { render, className, style, closeDelay, ...elementProps } = componentProps;\n  const { elementRef, present, state } = useInputIndicatorRoot(() => new SeekIndicatorCore(), { closeDelay });\n\n  if (!present) return null;\n\n  return (\n    <SeekIndicatorProvider value={{ state }}>\n      {renderElement(\n        'div',\n        { render, className, style },\n        {\n          state,\n          stateAttrMap: SeekIndicatorDataAttrs,\n          ref: [forwardedRef, elementRef],\n          props: [elementProps],\n        }\n      )}\n    </SeekIndicatorProvider>\n  );\n});\n\nexport namespace SeekIndicatorRoot {\n  export type Props = SeekIndicatorRootProps;\n  export type State = SeekIndicatorCore.State;\n}\n"],"mappings":";;;;;;;;AAeA,MAAa,oBAAoB,WAAW,SAAS,kBACnD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,YAAY,GAAG,iBAAiB;CAClE,MAAM,EAAE,YAAY,SAAS,UAAU,4BAA4B,IAAI,mBAAmB,EAAE,EAAE,YAAY,CAAC;AAE3G,KAAI,CAAC,QAAS,QAAO;AAErB,QACE,oBAAC,uBAAD;EAAuB,OAAO,EAAE,OAAO;YACpC,cACC,OACA;GAAE;GAAQ;GAAW;GAAO,EAC5B;GACE;GACA,cAAc;GACd,KAAK,CAAC,cAAc,WAAW;GAC/B,OAAO,CAAC,aAAa;GACtB,CACF;EACqB,CAAA;EAE1B"}

package/dist/dev/ui/seek-indicator/seek-indicator-value.d.ts

@@ -0,0 +1,13 @@
+import { UIComponentProps } from "../../utils/types.js";
+import * as _$react from "react";
+import { SeekIndicatorCore } from "@videojs/core";
+
+//#region src/ui/seek-indicator/seek-indicator-value.d.ts
+interface SeekIndicatorValueProps extends UIComponentProps<'div', SeekIndicatorCore.State> {}
+declare const SeekIndicatorValue: _$react.ForwardRefExoticComponent<Omit<SeekIndicatorValueProps, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
+declare namespace SeekIndicatorValue {
+  type Props = SeekIndicatorValueProps;
+}
+//#endregion
+export { SeekIndicatorValue, SeekIndicatorValueProps };
+//# sourceMappingURL=seek-indicator-value.d.ts.map

package/dist/dev/ui/seek-indicator/seek-indicator-value.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"seek-indicator-value.d.ts","names":[],"sources":["../../../../src/ui/seek-indicator/seek-indicator-value.tsx"],"mappings":";;;;;UAUiB,uBAAA,SAAgC,gBAAA,QAAwB,iBAAA,CAAkB,KAAA;AAAA,cAE9E,kBAAA,EAAkB,OAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,uBAAA,WAAA,OAAA,CAAA,aAAA,CAAA,cAAA;AAAA,kBAkBd,kBAAA;EAAA,KACH,KAAA,GAAQ,uBAAA;AAAA"}

package/dist/dev/ui/seek-indicator/seek-indicator-value.js

@@ -0,0 +1,23 @@
+"use client";
+import { renderElement } from "../../utils/use-render.js";
+import { useSeekIndicatorContext } from "./context.js";
+import { forwardRef } from "react";
+import { getSeekIndicatorDisplayValue } from "@videojs/core";
+//#region src/ui/seek-indicator/seek-indicator-value.tsx
+const SeekIndicatorValue = forwardRef(function SeekIndicatorValue(componentProps, forwardedRef) {
+	const { render, className, style, ...elementProps } = componentProps;
+	const { state } = useSeekIndicatorContext();
+	return renderElement("div", {
+		render,
+		className,
+		style
+	}, {
+		state,
+		ref: forwardedRef,
+		props: [{ children: getSeekIndicatorDisplayValue(state) }, elementProps]
+	});
+});
+//#endregion
+export { SeekIndicatorValue };
+
+//# sourceMappingURL=seek-indicator-value.js.map

package/dist/dev/ui/seek-indicator/seek-indicator-value.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"seek-indicator-value.js","names":[],"sources":["../../../../src/ui/seek-indicator/seek-indicator-value.tsx"],"sourcesContent":["'use client';\n\nimport { getSeekIndicatorDisplayValue, type SeekIndicatorCore } from '@videojs/core';\nimport type { ForwardedRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UIComponentProps } from '../../utils/types';\nimport { renderElement } from '../../utils/use-render';\nimport { useSeekIndicatorContext } from './context';\n\nexport interface SeekIndicatorValueProps extends UIComponentProps<'div', SeekIndicatorCore.State> {}\n\nexport const SeekIndicatorValue = forwardRef(function SeekIndicatorValue(\n  componentProps: SeekIndicatorValueProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const { render, className, style, ...elementProps } = componentProps;\n  const { state } = useSeekIndicatorContext();\n\n  return renderElement(\n    'div',\n    { render, className, style },\n    {\n      state,\n      ref: forwardedRef,\n      props: [{ children: getSeekIndicatorDisplayValue(state) }, elementProps],\n    }\n  );\n});\n\nexport namespace SeekIndicatorValue {\n  export type Props = SeekIndicatorValueProps;\n}\n"],"mappings":";;;;;;AAYA,MAAa,qBAAqB,WAAW,SAAS,mBACpD,gBACA,cACA;CACA,MAAM,EAAE,QAAQ,WAAW,OAAO,GAAG,iBAAiB;CACtD,MAAM,EAAE,UAAU,yBAAyB;AAE3C,QAAO,cACL,OACA;EAAE;EAAQ;EAAW;EAAO,EAC5B;EACE;EACA,KAAK;EACL,OAAO,CAAC,EAAE,UAAU,6BAA6B,MAAM,EAAE,EAAE,aAAa;EACzE,CACF;EACD"}

package/dist/dev/ui/slider/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/slider/context.tsx"],"sourcesContent":["'use client';\n\nimport type { SliderState, StateAttrMap } from '@videojs/core';\nimport type { SliderThumbProps } from '@videojs/core/dom';\nimport type { RefCallback } from 'react';\nimport { createContext, useContext } from 'react';\n\nexport interface SliderContextValue {\n  state: SliderState;\n  /** Pointer position converted to the value domain (not 0–100 percent). */\n  pointerValue: number;\n  thumbRef: RefCallback<HTMLElement>;\n  thumbProps: SliderThumbProps;\n  stateAttrMap: StateAttrMap<SliderState>;\n  getAttrs: (state: SliderState) => object;\n  formatValue?: ((value: number, type: 'current' | 'pointer') => string) | undefined;\n}\n\nconst SliderContext = createContext<SliderContextValue | null>(null);\n\nexport function SliderProvider({ value, children }: { value: SliderContextValue; children: React.ReactNode }) {\n  return <SliderContext.Provider value={value}>{children}</SliderContext.Provider>;\n}\n\nexport function useSliderContext(): SliderContextValue {\n  const ctx = useContext(SliderContext);\n  if (!ctx) throw new Error('Slider compound components must be used within a Slider.Root');\n  return ctx;\n}\n"],"mappings":";;;;AAkBA,MAAM,gBAAgB,cAAyC,KAAK;AAEpE,SAAgB,eAAe,EAAE,OAAO,YAAsE;AAC5G,QAAO,oBAAC,cAAc,UAAf;EAA+B;EAAQ;EAAkC,CAAA;;AAGlF,SAAgB,mBAAuC;CACrD,MAAM,MAAM,WAAW,cAAc;AACrC,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,+DAA+D;AACzF,QAAO"}
+{"version":3,"file":"context.js","names":[],"sources":["../../../../src/ui/slider/context.tsx"],"sourcesContent":["'use client';\n\nimport type { SliderState, StateAttrMap } from '@videojs/core';\nimport type { SliderThumbProps } from '@videojs/core/dom';\nimport type { ProviderProps, RefCallback } from 'react';\nimport { createContext, useContext } from 'react';\n\nexport interface SliderContextValue {\n  state: SliderState;\n  /** Pointer position converted to the value domain (not 0–100 percent). */\n  pointerValue: number;\n  thumbRef: RefCallback<HTMLElement>;\n  thumbProps: SliderThumbProps;\n  stateAttrMap: StateAttrMap<SliderState>;\n  getAttrs: (state: SliderState) => object;\n  formatValue?: ((value: number, type: 'current' | 'pointer') => string) | undefined;\n}\n\nconst SliderContext = createContext<SliderContextValue | null>(null);\n\ntype SliderProviderProps = ProviderProps<SliderContextValue>;\n\nexport function SliderProvider({ value, children }: SliderProviderProps) {\n  return <SliderContext.Provider value={value}>{children}</SliderContext.Provider>;\n}\n\nexport function useSliderContext(): SliderContextValue {\n  const ctx = useContext(SliderContext);\n  if (!ctx) throw new Error('Slider compound components must be used within a Slider.Root');\n  return ctx;\n}\n"],"mappings":";;;;AAkBA,MAAM,gBAAgB,cAAyC,KAAK;AAIpE,SAAgB,eAAe,EAAE,OAAO,YAAiC;AACvE,QAAO,oBAAC,cAAc,UAAf;EAA+B;EAAQ;EAAkC,CAAA;;AAGlF,SAAgB,mBAAuC;CACrD,MAAM,MAAM,WAAW,cAAc;AACrC,KAAI,CAAC,IAAK,OAAM,IAAI,MAAM,+DAA+D;AACzF,QAAO"}