@videojs/react 10.0.0-beta.17 → 10.0.0-beta.21

package/dist/dev/ui/play-button/play-button.js

@@ -1,7 +1,7 @@
 "use client";
 import { createMediaButton } from "../create-media-button.js";
-import { PlayButtonCore, PlayButtonDataAttrs } from "@videojs/core";
 import { selectPlayback } from "@videojs/core/dom";
+import { PlayButtonCore, PlayButtonDataAttrs } from "@videojs/core";
 //#region src/ui/play-button/play-button.tsx
 /**
 * A button that toggles playback.

package/dist/dev/ui/playback-rate-button/playback-rate-button.d.ts

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { PlaybackRateButtonCore } from "@videojs/core";
 import * as react from "react";
+import { PlaybackRateButtonCore } from "@videojs/core";
 
 //#region src/ui/playback-rate-button/playback-rate-button.d.ts
 interface PlaybackRateButtonProps extends UIComponentProps<'button', PlaybackRateButtonCore.State>, PlaybackRateButtonCore.Props {}

package/dist/dev/ui/playback-rate-button/playback-rate-button.js

@@ -1,7 +1,7 @@
 "use client";
 import { createMediaButton } from "../create-media-button.js";
-import { PlaybackRateButtonCore, PlaybackRateButtonDataAttrs } from "@videojs/core";
 import { selectPlaybackRate } from "@videojs/core/dom";
+import { PlaybackRateButtonCore, PlaybackRateButtonDataAttrs } from "@videojs/core";
 //#region src/ui/playback-rate-button/playback-rate-button.tsx
 /**
 * A button that cycles through playback rates.

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

@@ -1,11 +1,12 @@
-import { PopoverCore, StateAttrMap } from "@videojs/core";
 import { PopoverApi } from "@videojs/core/dom";
+import { PopoverCore, StateAttrMap as StateAttrMap$1 } from "@videojs/core";
+
 //#region src/ui/popover/context.d.ts
 interface PopoverContextValue {
   core: PopoverCore;
   popover: PopoverApi;
   state: PopoverCore.State;
-  stateAttrMap: StateAttrMap<PopoverCore.State>;
+  stateAttrMap: StateAttrMap$1<PopoverCore.State>;
   anchorName: string;
   popupId: string;
 }

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,YAAA,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;AAAA;AAAA,iBAOc,iBAAA,CAAA,GAAqB,mBAAA"}

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

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { PopoverState } from "@videojs/core";
 import * as react from "react";
+import { PopoverState } from "@videojs/core";
 
 //#region src/ui/popover/popover-arrow.d.ts
 interface PopoverArrowProps extends UIComponentProps<'div', PopoverState> {}

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

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { PopoverState } from "@videojs/core";
 import * as react from "react";
+import { PopoverState } from "@videojs/core";
 
 //#region src/ui/popover/popover-popup.d.ts
 interface PopoverPopupProps extends UIComponentProps<'div', PopoverState> {}

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

@@ -1,6 +1,6 @@
-import { PopoverProps } from "@videojs/core";
 import { PopoverChangeDetails } 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 {

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

@@ -3,11 +3,11 @@ import { useLatestRef } from "../../utils/use-latest-ref.js";
 import { useDestroy } from "../../utils/use-destroy.js";
 import { useSafeId } from "../../utils/use-safe-id.js";
 import { PopoverContextProvider } from "./context.js";
-import { PopoverCore, PopoverDataAttrs } from "@videojs/core";
 import { createPopover, createTransition } from "@videojs/core/dom";
 import { useSnapshot } from "@videojs/store/react";
 import { useEffect, useState } from "react";
 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 }) {
 	const [core] = useState(() => new PopoverCore(coreProps));

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

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { PopoverState } from "@videojs/core";
 import * as react from "react";
+import { PopoverState } from "@videojs/core";
 
 //#region src/ui/popover/popover-trigger.d.ts
 interface PopoverTriggerProps extends UIComponentProps<'button', PopoverState> {}

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

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { PosterCore } from "@videojs/core";
 import * as react from "react";
+import { PosterCore } from "@videojs/core";
 
 //#region src/ui/poster/poster.d.ts
 interface PosterProps extends UIComponentProps<'img', PosterCore.State> {}

package/dist/dev/ui/poster/poster.js

@@ -1,9 +1,9 @@
 "use client";
 import { usePlayer } from "../../player/context.js";
 import { renderElement } from "../../utils/use-render.js";
-import { PosterCore, PosterDataAttrs } from "@videojs/core";
 import { logMissingFeature, selectPlayback } from "@videojs/core/dom";
 import { forwardRef, useState } from "react";
+import { PosterCore, PosterDataAttrs } from "@videojs/core";
 //#region src/ui/poster/poster.tsx
 /**
 * Displays the video poster image. Shows before playback starts, hides after.

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

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { SeekButtonCore } from "@videojs/core";
 import * as react from "react";
+import { SeekButtonCore } from "@videojs/core";
 
 //#region src/ui/seek-button/seek-button.d.ts
 interface SeekButtonProps extends UIComponentProps<'button', SeekButtonCore.State>, SeekButtonCore.Props {}

package/dist/dev/ui/seek-button/seek-button.js

@@ -1,7 +1,7 @@
 "use client";
 import { createMediaButton } from "../create-media-button.js";
-import { SeekButtonCore, SeekButtonDataAttrs } from "@videojs/core";
 import { selectTime } from "@videojs/core/dom";
+import { SeekButtonCore, SeekButtonDataAttrs } from "@videojs/core";
 //#region src/ui/seek-button/seek-button.tsx
 /**
 * A button that seeks forward or backward by a configurable number of seconds.

package/dist/dev/ui/slider/slider-buffer.d.ts

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { SliderState } from "@videojs/core";
 import * as react from "react";
+import { SliderState } from "@videojs/core";
 
 //#region src/ui/slider/slider-buffer.d.ts
 interface SliderBufferProps extends UIComponentProps<'div', SliderState> {}

package/dist/dev/ui/slider/slider-fill.d.ts

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { SliderState } from "@videojs/core";
 import * as react from "react";
+import { SliderState } from "@videojs/core";
 
 //#region src/ui/slider/slider-fill.d.ts
 interface SliderFillProps extends UIComponentProps<'div', SliderState> {}

package/dist/dev/ui/slider/slider-preview.d.ts

@@ -1,7 +1,7 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { SliderState } from "@videojs/core";
 import { SliderPreviewOverflow } from "@videojs/core/dom";
 import * as react from "react";
+import { SliderState } from "@videojs/core";
 
 //#region src/ui/slider/slider-preview.d.ts
 interface SliderPreviewProps extends UIComponentProps<'div', SliderState> {

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

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { SliderCore } from "@videojs/core";
 import * as react from "react";
+import { SliderCore } from "@videojs/core";
 
 //#region src/ui/slider/slider-root.d.ts
 interface SliderRootProps extends UIComponentProps<'div', SliderCore.State>, SliderCore.Props {

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

@@ -2,10 +2,10 @@
 import { renderElement } from "../../utils/use-render.js";
 import { useSlider } from "../hooks/use-slider.js";
 import { SliderProvider } from "./context.js";
-import { SliderCore, SliderDataAttrs } from "@videojs/core";
 import { getSliderCSSVars } from "@videojs/core/dom";
 import { forwardRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
+import { SliderCore, SliderDataAttrs } from "@videojs/core";
 //#region src/ui/slider/slider-root.tsx
 const SliderRoot = forwardRef(function SliderRoot(componentProps, forwardedRef) {
 	const { render, className, style, label, min, max, step, largeStep, orientation, disabled, thumbAlignment, value = 0, onValueChange, onValueCommit, onDragStart, onDragEnd, ...elementProps } = componentProps;

package/dist/dev/ui/slider/slider-thumb.d.ts

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { SliderState } from "@videojs/core";
 import * as react from "react";
+import { SliderState } from "@videojs/core";
 
 //#region src/ui/slider/slider-thumb.d.ts
 interface SliderThumbProps extends UIComponentProps<'div', SliderState> {}

package/dist/dev/ui/slider/slider-thumbnail.d.ts

@@ -1,6 +1,6 @@
 import { ThumbnailProps } from "../thumbnail/thumbnail.js";
-import { ThumbnailCore } from "@videojs/core";
 import * as react from "react";
+import { ThumbnailCore } from "@videojs/core";
 
 //#region src/ui/slider/slider-thumbnail.d.ts
 interface SliderThumbnailProps extends Omit<ThumbnailProps, 'time'> {}

package/dist/dev/ui/slider/slider-track.d.ts

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { SliderState } from "@videojs/core";
 import * as react from "react";
+import { SliderState } from "@videojs/core";
 
 //#region src/ui/slider/slider-track.d.ts
 interface SliderTrackProps extends UIComponentProps<'div', SliderState> {}

package/dist/dev/ui/slider/slider-value.d.ts

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { SliderState } from "@videojs/core";
 import * as react from "react";
+import { SliderState } from "@videojs/core";
 
 //#region src/ui/slider/slider-value.d.ts
 interface SliderValueProps extends UIComponentProps<'output', SliderState> {

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

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { ThumbnailCore, ThumbnailImage } from "@videojs/core";
 import * as react from "react";
+import { ThumbnailCore, ThumbnailImage } from "@videojs/core";
 
 //#region src/ui/thumbnail/thumbnail.d.ts
 interface ThumbnailProps extends UIComponentProps<'div', ThumbnailCore.State>, ThumbnailCore.Props {

package/dist/dev/ui/thumbnail/thumbnail.js

@@ -2,10 +2,10 @@
 import { useOptionalPlayer } from "../../player/context.js";
 import { useDestroy } from "../../utils/use-destroy.js";
 import { renderElement } from "../../utils/use-render.js";
-import { ThumbnailCore, ThumbnailDataAttrs, mapCuesToThumbnails } from "@videojs/core";
 import { createThumbnail, selectTextTrack } from "@videojs/core/dom";
 import { forwardRef, useMemo, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
+import { ThumbnailCore, ThumbnailDataAttrs, mapCuesToThumbnails } from "@videojs/core";
 //#region src/ui/thumbnail/thumbnail.tsx
 const Thumbnail = forwardRef(function Thumbnail(componentProps, forwardedRef) {
 	const { render, className, style, time = 0, thumbnails: externalThumbnails, crossOrigin, loading, fetchPriority, ...elementProps } = componentProps;

package/dist/dev/ui/time/time-value.d.ts

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { TimeCore } from "@videojs/core";
 import * as react from "react";
+import { TimeCore } from "@videojs/core";
 
 //#region src/ui/time/time-value.d.ts
 interface ValueProps extends Omit<UIComponentProps<'time', TimeCore.State>, 'children'>, TimeCore.Props {}

package/dist/dev/ui/time/time-value.js

@@ -1,10 +1,10 @@
 "use client";
 import { usePlayer } from "../../player/context.js";
 import { renderElement } from "../../utils/use-render.js";
-import { TimeCore, TimeDataAttrs } from "@videojs/core";
 import { logMissingFeature, selectTime } from "@videojs/core/dom";
 import { forwardRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { TimeCore, TimeDataAttrs } from "@videojs/core";
 //#region src/ui/time/time-value.tsx
 /**
 * Displays a formatted time value (current, duration, or remaining).

package/dist/dev/ui/time-slider/time-slider-root.d.ts

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { TimeSliderCore } from "@videojs/core";
 import * as react from "react";
+import { TimeSliderCore } from "@videojs/core";
 
 //#region src/ui/time-slider/time-slider-root.d.ts
 interface TimeSliderRootProps extends UIComponentProps<'div', TimeSliderCore.State>, TimeSliderCore.Props {

package/dist/dev/ui/time-slider/time-slider-root.js

@@ -4,10 +4,10 @@ import { useLatestRef } from "../../utils/use-latest-ref.js";
 import { renderElement } from "../../utils/use-render.js";
 import { useSlider } from "../hooks/use-slider.js";
 import { SliderProvider } from "../slider/context.js";
-import { TimeSliderCore, TimeSliderDataAttrs } from "@videojs/core";
 import { getTimeSliderCSSVars, logMissingFeature, selectBuffer, selectTime } from "@videojs/core/dom";
 import { forwardRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
+import { TimeSliderCore, TimeSliderDataAttrs } from "@videojs/core";
 import { formatTime } from "@videojs/utils/time";
 //#region src/ui/time-slider/time-slider-root.tsx
 const noopSeek = () => Promise.resolve(0);

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

@@ -1,11 +1,12 @@
-import { StateAttrMap, TooltipCore } from "@videojs/core";
 import { TooltipApi } from "@videojs/core/dom";
+import { StateAttrMap as StateAttrMap$1, TooltipCore } from "@videojs/core";
+
 //#region src/ui/tooltip/context.d.ts
 interface TooltipContextValue {
   core: TooltipCore;
   tooltip: TooltipApi;
   state: TooltipCore.State;
-  stateAttrMap: StateAttrMap<TooltipCore.State>;
+  stateAttrMap: StateAttrMap$1<TooltipCore.State>;
   anchorName: string;
   popupId: string;
   content: string | undefined;

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

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","names":[],"sources":["../../../../src/ui/tooltip/context.tsx"],"mappings":";;;UAMiB,mBAAA;EACf,IAAA,EAAM,WAAA;EACN,OAAA,EAAS,UAAA;EACT,KAAA,EAAO,WAAA,CAAY,KAAA;EACnB,YAAA,EAAc,YAAA,CAAa,WAAA,CAAY,KAAA;EACvC,UAAA;EACA,OAAA;EACA,OAAA;EACA,UAAA,GAAa,OAAA;AAAA;AAAA,iBAOC,iBAAA,CAAA,GAAqB,mBAAA;AAAA,iBAMrB,yBAAA,CAAA,GAA6B,mBAAA"}
+{"version":3,"file":"context.d.ts","names":[],"sources":["../../../../src/ui/tooltip/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,OAAA;EACA,UAAA,GAAa,OAAA;AAAA;AAAA,iBAOC,iBAAA,CAAA,GAAqB,mBAAA;AAAA,iBAMrB,yBAAA,CAAA,GAA6B,mBAAA"}

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

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { TooltipState } from "@videojs/core";
 import * as react from "react";
+import { TooltipState } from "@videojs/core";
 
 //#region src/ui/tooltip/tooltip-arrow.d.ts
 interface TooltipArrowProps extends UIComponentProps<'div', TooltipState> {}

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

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { TooltipState } from "@videojs/core";
 import * as react from "react";
+import { TooltipState } from "@videojs/core";
 
 //#region src/ui/tooltip/tooltip-popup.d.ts
 interface TooltipPopupProps extends UIComponentProps<'div', TooltipState> {}

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

@@ -2,9 +2,9 @@
 import { useComposedRefs } from "../../utils/use-composed-refs.js";
 import { renderElement } from "../../utils/use-render.js";
 import { useTooltipContext } from "./context.js";
-import { TooltipCSSVars } from "@videojs/core";
 import { getAnchorPositionStyle, getPopupPositionRect, resolveOffsets } from "@videojs/core/dom";
 import { forwardRef, useCallback, useLayoutEffect, useMemo, useRef, useState } from "react";
+import { TooltipCSSVars } from "@videojs/core";
 import { supportsAnchorPositioning } from "@videojs/utils/dom";
 //#region src/ui/tooltip/tooltip-popup.tsx
 const POPUP_RESET = {

package/dist/dev/ui/tooltip/tooltip-provider.d.ts

@@ -1,5 +1,5 @@
-import { TooltipGroupProps } from "@videojs/core";
 import { ReactNode } from "react";
+import { TooltipGroupProps } from "@videojs/core";
 
 //#region src/ui/tooltip/tooltip-provider.d.ts
 interface TooltipProviderProps extends TooltipGroupProps {

package/dist/dev/ui/tooltip/tooltip-provider.js

@@ -1,8 +1,8 @@
 "use client";
 import { TooltipGroupContextProvider } from "./group-context.js";
-import { TooltipGroupCore } from "@videojs/core";
 import { useState } from "react";
 import { jsx } from "react/jsx-runtime";
+import { TooltipGroupCore } from "@videojs/core";
 //#region src/ui/tooltip/tooltip-provider.tsx
 function TooltipProvider({ delay, closeDelay, timeout, children }) {
 	const [group] = useState(() => new TooltipGroupCore({

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

@@ -1,6 +1,6 @@
-import { TooltipProps } from "@videojs/core";
 import { TooltipChangeDetails } from "@videojs/core/dom";
 import { ReactNode } from "react";
+import { TooltipProps } from "@videojs/core";
 
 //#region src/ui/tooltip/tooltip-root.d.ts
 interface TooltipRootProps extends TooltipProps {

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

@@ -4,11 +4,11 @@ import { useDestroy } from "../../utils/use-destroy.js";
 import { useSafeId } from "../../utils/use-safe-id.js";
 import { TooltipContextProvider } from "./context.js";
 import { useTooltipGroup } from "./group-context.js";
-import { TooltipCore, TooltipDataAttrs } from "@videojs/core";
 import { createTooltip, createTransition } from "@videojs/core/dom";
 import { useSnapshot } from "@videojs/store/react";
 import { useEffect, useState } from "react";
 import { jsx } from "react/jsx-runtime";
+import { TooltipCore, TooltipDataAttrs } from "@videojs/core";
 //#region src/ui/tooltip/tooltip-root.tsx
 function TooltipRoot({ open: controlledOpen, defaultOpen = TooltipCore.defaultProps.defaultOpen, onOpenChange: onOpenChangeProp, onOpenChangeComplete: onOpenChangeCompleteProp, delay = TooltipCore.defaultProps.delay, closeDelay = TooltipCore.defaultProps.closeDelay, disableHoverablePopup = TooltipCore.defaultProps.disableHoverablePopup, disabled = TooltipCore.defaultProps.disabled, children, ...coreProps }) {
 	const [core] = useState(() => new TooltipCore(coreProps));

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

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { TooltipState } from "@videojs/core";
 import * as react from "react";
+import { TooltipState } from "@videojs/core";
 
 //#region src/ui/tooltip/tooltip-trigger.d.ts
 interface TooltipTriggerProps extends UIComponentProps<'button', TooltipState> {}

package/dist/dev/ui/volume-slider/volume-slider-root.d.ts

@@ -1,6 +1,6 @@
 import { UIComponentProps } from "../../utils/types.js";
-import { VolumeSliderCore } from "@videojs/core";
 import * as react from "react";
+import { VolumeSliderCore } from "@videojs/core";
 
 //#region src/ui/volume-slider/volume-slider-root.d.ts
 interface VolumeSliderRootProps extends UIComponentProps<'div', VolumeSliderCore.State>, VolumeSliderCore.Props {

package/dist/dev/ui/volume-slider/volume-slider-root.js

@@ -4,10 +4,10 @@ import { useLatestRef } from "../../utils/use-latest-ref.js";
 import { renderElement } from "../../utils/use-render.js";
 import { useSlider } from "../hooks/use-slider.js";
 import { SliderProvider } from "../slider/context.js";
-import { VolumeSliderCore, VolumeSliderDataAttrs } from "@videojs/core";
 import { createWheelStep, getSliderCSSVars, logMissingFeature, selectVolume } from "@videojs/core/dom";
 import { forwardRef, useCallback, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
+import { VolumeSliderCore, VolumeSliderDataAttrs } from "@videojs/core";
 import { listen } from "@videojs/utils/dom";
 //#region src/ui/volume-slider/volume-slider-root.tsx
 const noopVolume = {

package/dist/dev/utils/media-props.d.ts

@@ -1,8 +1,8 @@
-import { MediaApi } from "@videojs/core/dom";
+import { Media } from "@videojs/core";
 
 //#region src/utils/media-props.d.ts
 type AnyClass = abstract new (...args: any[]) => any;
-declare function mediaProps(media: MediaApi, DelegateClass: AnyClass, props: Record<string, any>): Record<string, any>;
+declare function mediaProps(media: Media, DelegateClass: AnyClass, props: Record<string, any>): Record<string, any>;
 //#endregion
 export { mediaProps };
 //# sourceMappingURL=media-props.d.ts.map

package/dist/dev/utils/media-props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"media-props.d.ts","names":[],"sources":["../../../src/utils/media-props.ts"],"mappings":";;;KAEK,QAAA,oBAA4B,IAAA;AAAA,iBAajB,UAAA,CAAW,KAAA,EAAO,QAAA,EAAU,aAAA,EAAe,QAAA,EAAU,KAAA,EAAO,MAAA,gBAAmB,MAAA"}
+{"version":3,"file":"media-props.d.ts","names":[],"sources":["../../../src/utils/media-props.ts"],"mappings":";;;KAEK,QAAA,oBAA4B,IAAA;AAAA,iBAajB,UAAA,CAAW,KAAA,EAAO,KAAA,EAAO,aAAA,EAAe,QAAA,EAAU,KAAA,EAAO,MAAA,gBAAmB,MAAA"}

package/dist/dev/utils/media-props.js.map

@@ -1 +1 @@
-{"version":3,"file":"media-props.js","names":[],"sources":["../../../src/utils/media-props.ts"],"sourcesContent":["import type { MediaApi } from '@videojs/core/dom';\n\ntype AnyClass = abstract new (...args: any[]) => any;\n\nfunction getSettableProps(DelegateClass: AnyClass): Set<string> {\n  const props = new Set<string>();\n  for (let proto = DelegateClass.prototype; proto && proto !== Object.prototype; proto = Object.getPrototypeOf(proto)) {\n    for (const key of Object.getOwnPropertyNames(proto)) {\n      const desc = Object.getOwnPropertyDescriptor(proto, key);\n      if (desc?.set) props.add(key);\n    }\n  }\n  return props;\n}\n\nexport function mediaProps(media: MediaApi, DelegateClass: AnyClass, props: Record<string, any>) {\n  const delegateKeys = getSettableProps(DelegateClass);\n  const rest: Record<string, any> = {};\n\n  for (const key of Object.keys(props)) {\n    if (delegateKeys.has(key)) {\n      const value = props[key];\n      if ((media as any)[key] !== value) {\n        (media as any)[key] = value;\n      }\n    } else {\n      rest[key] = props[key];\n    }\n  }\n\n  return rest;\n}\n"],"mappings":";AAIA,SAAS,iBAAiB,eAAsC;CAC9D,MAAM,wBAAQ,IAAI,KAAa;AAC/B,MAAK,IAAI,QAAQ,cAAc,WAAW,SAAS,UAAU,OAAO,WAAW,QAAQ,OAAO,eAAe,MAAM,CACjH,MAAK,MAAM,OAAO,OAAO,oBAAoB,MAAM,CAEjD,KADa,OAAO,yBAAyB,OAAO,IAAI,EAC9C,IAAK,OAAM,IAAI,IAAI;AAGjC,QAAO;;AAGT,SAAgB,WAAW,OAAiB,eAAyB,OAA4B;CAC/F,MAAM,eAAe,iBAAiB,cAAc;CACpD,MAAM,OAA4B,EAAE;AAEpC,MAAK,MAAM,OAAO,OAAO,KAAK,MAAM,CAClC,KAAI,aAAa,IAAI,IAAI,EAAE;EACzB,MAAM,QAAQ,MAAM;AACpB,MAAK,MAAc,SAAS,MACzB,OAAc,OAAO;OAGxB,MAAK,OAAO,MAAM;AAItB,QAAO"}
+{"version":3,"file":"media-props.js","names":[],"sources":["../../../src/utils/media-props.ts"],"sourcesContent":["import type { Media } from '@videojs/core';\n\ntype AnyClass = abstract new (...args: any[]) => any;\n\nfunction getSettableProps(DelegateClass: AnyClass): Set<string> {\n  const props = new Set<string>();\n  for (let proto = DelegateClass.prototype; proto && proto !== Object.prototype; proto = Object.getPrototypeOf(proto)) {\n    for (const key of Object.getOwnPropertyNames(proto)) {\n      const desc = Object.getOwnPropertyDescriptor(proto, key);\n      if (desc?.set) props.add(key);\n    }\n  }\n  return props;\n}\n\nexport function mediaProps(media: Media, DelegateClass: AnyClass, props: Record<string, any>) {\n  const delegateKeys = getSettableProps(DelegateClass);\n  const rest: Record<string, any> = {};\n\n  for (const key of Object.keys(props)) {\n    if (delegateKeys.has(key)) {\n      const value = props[key];\n      if ((media as any)[key] !== value) {\n        (media as any)[key] = value;\n      }\n    } else {\n      rest[key] = props[key];\n    }\n  }\n\n  return rest;\n}\n"],"mappings":";AAIA,SAAS,iBAAiB,eAAsC;CAC9D,MAAM,wBAAQ,IAAI,KAAa;AAC/B,MAAK,IAAI,QAAQ,cAAc,WAAW,SAAS,UAAU,OAAO,WAAW,QAAQ,OAAO,eAAe,MAAM,CACjH,MAAK,MAAM,OAAO,OAAO,oBAAoB,MAAM,CAEjD,KADa,OAAO,yBAAyB,OAAO,IAAI,EAC9C,IAAK,OAAM,IAAI,IAAI;AAGjC,QAAO;;AAGT,SAAgB,WAAW,OAAc,eAAyB,OAA4B;CAC5F,MAAM,eAAe,iBAAiB,cAAc;CACpD,MAAM,OAA4B,EAAE;AAEpC,MAAK,MAAM,OAAO,OAAO,KAAK,MAAM,CAClC,KAAI,aAAa,IAAI,IAAI,EAAE;EACzB,MAAM,QAAQ,MAAM;AACpB,MAAK,MAAc,SAAS,MACzB,OAAc,OAAO;OAGxB,MAAK,OAAO,MAAM;AAItB,QAAO"}

package/dist/dev/utils/use-media-instance.d.ts

@@ -1,4 +1,4 @@
-import { Media } from "@videojs/core/dom";
+import { Media } from "@videojs/core";
 
 //#region src/utils/use-media-instance.d.ts
 /**

package/dist/dev/utils/use-media-instance.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-media-instance.js","names":[],"sources":["../../../src/utils/use-media-instance.ts"],"sourcesContent":["'use client';\n\nimport type { Media } from '@videojs/core/dom';\nimport { useState } from 'react';\n\nimport { useMediaAttach } from '../player/context';\nimport { useDestroy } from './use-destroy';\n\n/**\n * Create and manage a media instance lifecycle within a player context.\n *\n * Instantiates the media class once, attaches it to the player on mount,\n * and safely detaches on unmount using a functional updater to avoid race\n * conditions when swapping media components (e.g. DashVideo → HlsVideo).\n */\nexport function useMediaInstance<Instance extends Media & { destroy(): void }>(\n  MediaClass: new () => Instance\n): Instance {\n  const [instance] = useState(() => new MediaClass());\n  const setMedia = useMediaAttach();\n\n  useDestroy(\n    instance,\n    () => setMedia?.(instance),\n    () => setMedia?.((prev) => (prev === instance ? null : prev))\n  );\n\n  return instance;\n}\n"],"mappings":";;;;;;;;;;;;AAeA,SAAgB,iBACd,YACU;CACV,MAAM,CAAC,YAAY,eAAe,IAAI,YAAY,CAAC;CACnD,MAAM,WAAW,gBAAgB;AAEjC,YACE,gBACM,WAAW,SAAS,QACpB,YAAY,SAAU,SAAS,WAAW,OAAO,KAAM,CAC9D;AAED,QAAO"}
+{"version":3,"file":"use-media-instance.js","names":[],"sources":["../../../src/utils/use-media-instance.ts"],"sourcesContent":["'use client';\n\nimport type { Media } from '@videojs/core';\nimport { useState } from 'react';\n\nimport { useMediaAttach } from '../player/context';\nimport { useDestroy } from './use-destroy';\n\n/**\n * Create and manage a media instance lifecycle within a player context.\n *\n * Instantiates the media class once, attaches it to the player on mount,\n * and safely detaches on unmount using a functional updater to avoid race\n * conditions when swapping media components (e.g. DashVideo → HlsVideo).\n */\nexport function useMediaInstance<Instance extends Media & { destroy(): void }>(\n  MediaClass: new () => Instance\n): Instance {\n  const [instance] = useState(() => new MediaClass());\n  const setMedia = useMediaAttach();\n\n  useDestroy(\n    instance,\n    () => setMedia?.(instance),\n    () => setMedia?.((prev) => (prev === instance ? null : prev))\n  );\n\n  return instance;\n}\n"],"mappings":";;;;;;;;;;;;AAeA,SAAgB,iBACd,YACU;CACV,MAAM,CAAC,YAAY,eAAe,IAAI,YAAY,CAAC;CACnD,MAAM,WAAW,gBAAgB;AAEjC,YACE,gBACM,WAAW,SAAS,QACpB,YAAY,SAAU,SAAS,WAAW,OAAO,KAAM,CAC9D;AAED,QAAO"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@videojs/react",
   "type": "module",
-  "version": "10.0.0-beta.17",
+  "version": "10.0.0-beta.21",
   "description": "React library for building media players",
   "license": "Apache-2.0",
   "repository": {
@@ -65,10 +65,10 @@
     "react": "^18.0.0 || ^19.0.0"
   },
   "dependencies": {
-    "@videojs/spf": "10.0.0-beta.17",
-    "@videojs/store": "10.0.0-beta.17",
-    "@videojs/utils": "10.0.0-beta.17",
-    "@videojs/core": "10.0.0-beta.17"
+    "@videojs/core": "10.0.0-beta.21",
+    "@videojs/spf": "10.0.0-beta.21",
+    "@videojs/utils": "10.0.0-beta.21",
+    "@videojs/store": "10.0.0-beta.21"
   },
   "devDependencies": {
     "@testing-library/react": "^16.3.0",
@@ -79,8 +79,8 @@
     "tsdown": "^0.21.4",
     "typescript": "^6.0.2",
     "vitest": "^4.1.0",
-    "@videojs/skins": "10.0.0-beta.17",
-    "@videojs/icons": "10.0.0-beta.17"
+    "@videojs/icons": "10.0.0-beta.21",
+    "@videojs/skins": "10.0.0-beta.21"
   },
   "publishConfig": {
     "access": "public"