@videojs/react 0.1.0-preview.8 → 10.0.0-alpha.3

package/dist/index.d.ts

@@ -1,312 +0,0 @@
-import { a as useMediaDispatch, c as useMediaStore, i as VideoProvider, l as MediaContext, n as MediaStateOwner, o as useMediaRef, r as MediaStore, s as useMediaSelector, t as MediaState } from "./index-CM70WSkA.js";
-import { t as FrostedSkin } from "./FrostedSkin-t8edr5LV.js";
-import { t as MinimalSkin } from "./MinimalSkin-DzHkJgW-.js";
-import React$1, { CSSProperties, DetailedHTMLProps, ElementType, FC, HTMLProps, PropsWithChildren, ReactElement, ReactNode, Ref, RefCallback, VideoHTMLAttributes } from "react";
-import { TimeSlider as TimeSlider$1, VolumeSlider as VolumeSlider$1 } from "@videojs/core";
-
-//#region src/utils/component-factory.d.ts
-
-type RenderFn<TProps = any, TState = any> = (props: TProps, state: TState) => ReactElement;
-/**
-* Type helper to infer the component type from the factory
-*/
-type ConnectedComponent<TProps extends Record<string, any>, TRenderFn extends RenderFn<any, any>> = React.ForwardRefExoticComponent<React.PropsWithoutRef<TProps & {
-  render?: TRenderFn;
-}> & React.RefAttributes<HTMLElement>>;
-//#endregion
-//#region src/components/CurrentTimeDisplay.d.ts
-declare function useCurrentTimeDisplayState(_props: any): {
-  currentTime: number;
-  duration: number;
-};
-type CurrentTimeDisplayState = ReturnType<typeof useCurrentTimeDisplayState>;
-interface CurrentTimeDisplayProps extends React.ComponentProps<"span"> {
-  showRemaining?: boolean;
-}
-declare function renderCurrentTimeDisplay(props: CurrentTimeDisplayProps, state: CurrentTimeDisplayState): JSX.Element;
-declare const CurrentTimeDisplay: ConnectedComponent<CurrentTimeDisplayProps, typeof renderCurrentTimeDisplay>;
-//#endregion
-//#region src/components/DurationDisplay.d.ts
-declare function useDurationDisplayState(_props: any): {
-  duration: number;
-};
-type useDurationDisplayState = typeof useDurationDisplayState;
-type DurationDisplayState = ReturnType<useDurationDisplayState>;
-declare function useDurationDisplayProps(props: PropsWithChildren): PropsWithChildren<Record<string, unknown>>;
-type useDurationDisplayProps = typeof useDurationDisplayProps;
-type DurationDisplayProps = ReturnType<useDurationDisplayProps>;
-declare function renderDurationDisplay(props: DurationDisplayProps, state: DurationDisplayState): JSX.Element;
-type renderDurationDisplay = typeof renderDurationDisplay;
-declare const DurationDisplay: ConnectedComponent<DurationDisplayProps, typeof renderDurationDisplay>;
-//#endregion
-//#region src/components/FullscreenButton.d.ts
-declare function useFullscreenButtonState(_props: any): {
-  fullscreen: boolean;
-  requestEnterFullscreen: () => void;
-  requestExitFullscreen: () => void;
-};
-type FullscreenButtonState = ReturnType<typeof useFullscreenButtonState>;
-declare function getFullscreenButtonProps(props: PropsWithChildren, state: FullscreenButtonState): PropsWithChildren<Record<string, unknown>>;
-type FullscreenButtonProps = ReturnType<typeof getFullscreenButtonProps>;
-declare function renderFullscreenButton(props: FullscreenButtonProps, state: FullscreenButtonState): JSX.Element;
-declare const FullscreenButton: ConnectedComponent<FullscreenButtonProps, typeof renderFullscreenButton>;
-//#endregion
-//#region src/components/HlsVideo.d.ts
-type MediaStateOwner$1 = NonNullable<Parameters<ReturnType<typeof useMediaRef>>[0]>;
-/** @TODO Improve type inference and narrowing/widening for different use cases (CJP) */
-type ComponentType = ElementType<Omit<DetailedHTMLProps<VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, "ref"> & {
-  ref: Ref<MediaStateOwner$1>;
-}>;
-type VideoProps$1 = PropsWithChildren<{
-  component?: ComponentType;
-  className?: string | undefined;
-  style?: CSSProperties | undefined;
-}>;
-declare function HlsVideo({
-  component,
-  children,
-  ...props
-}: VideoProps$1): JSX.Element;
-//#endregion
-//#region src/components/MediaContainer.d.ts
-/**
-* Hook to associate a React element as the fullscreen container for the media store.
-* This is equivalent to Media Chrome's useMediaFullscreenRef but for VJS-10.
-*
-* The ref callback will register the element as the container state owner
-* in the media store, enabling fullscreen functionality.
-*
-* @example
-* import { useMediaContainerRef } from '@videojs/react';
-*
-* const PlayerContainer = ({ children }) => {
-*   const containerRef = useMediaContainerRef();
-*   return <div ref={containerRef}>{children}</div>;
-* };
-*/
-declare function useMediaContainerRef(): RefCallback<HTMLElement | null>;
-/**
-* MediaContainer component that automatically registers itself as the fullscreen container.
-* This provides a simple wrapper component for fullscreen functionality.
-*
-* @example
-* import { MediaContainer } from '@videojs/react';
-*
-* const MyPlayer = () => (
-*   <MediaContainer>
-*     <video src="video.mp4" />
-*     <div>Controls here</div>
-*   </MediaContainer>
-* );
-*/
-declare const MediaContainer: FC<PropsWithChildren<HTMLProps<HTMLDivElement>>>;
-//#endregion
-//#region src/components/MuteButton.d.ts
-declare function useMuteButtonState(_props: any): {
-  volumeLevel: string;
-  muted: boolean;
-  requestMute: () => void;
-  requestUnmute: () => void;
-};
-type MuteButtonState = ReturnType<typeof useMuteButtonState>;
-declare function getMuteButtonProps(props: PropsWithChildren, state: MuteButtonState): PropsWithChildren<Record<string, unknown>>;
-type MuteButtonProps = ReturnType<typeof getMuteButtonProps>;
-declare function renderMuteButton(props: MuteButtonProps, state: MuteButtonState): JSX.Element;
-declare const MuteButton: ConnectedComponent<MuteButtonProps, typeof renderMuteButton>;
-//#endregion
-//#region src/components/PlayButton.d.ts
-declare function usePlayButtonState(_props: any): {
-  paused: boolean;
-  requestPlay: () => void;
-  requestPause: () => void;
-};
-type PlayButtonState = ReturnType<typeof usePlayButtonState>;
-declare function getPlayButtonProps(props: Record<string, unknown>, state: PlayButtonState): PropsWithChildren<Record<string, unknown>>;
-type PlayButtonProps = ReturnType<typeof getPlayButtonProps>;
-declare function renderPlayButton(props: PlayButtonProps, state: PlayButtonState): JSX.Element;
-declare const PlayButton: ConnectedComponent<PlayButtonProps, typeof renderPlayButton>;
-//#endregion
-//#region src/components/Popover.d.ts
-type Placement$1 = "top" | "top-start" | "top-end";
-interface PopoverRootProps {
-  openOnHover?: boolean;
-  delay?: number;
-  closeDelay?: number;
-  children: ReactNode;
-}
-interface PopoverTriggerProps {
-  children: ReactNode;
-}
-interface PopoverPositionerProps {
-  side?: Placement$1;
-  sideOffset?: number;
-  children: ReactNode;
-}
-interface PopoverPopupProps {
-  id?: string;
-  className?: string;
-  children: ReactNode;
-}
-declare function PopoverRoot({
-  openOnHover,
-  delay,
-  closeDelay,
-  children
-}: PopoverRootProps): JSX.Element;
-declare function PopoverTrigger({
-  children
-}: PopoverTriggerProps): JSX.Element;
-declare function PopoverPositioner({
-  side,
-  sideOffset,
-  children
-}: PopoverPositionerProps): JSX.Element | null;
-declare function PopoverPopup({
-  id,
-  className,
-  children
-}: PopoverPopupProps): JSX.Element;
-declare const Popover: {
-  Root: typeof PopoverRoot;
-  Trigger: typeof PopoverTrigger;
-  Positioner: typeof PopoverPositioner;
-  Popup: typeof PopoverPopup;
-};
-//#endregion
-//#region src/components/PreviewTimeDisplay.d.ts
-declare function usePreviewTimeDisplayState(_props: any): {
-  previewTime: number;
-};
-type PreviewTimeDisplayState = ReturnType<typeof usePreviewTimeDisplayState>;
-interface PreviewTimeDisplayProps extends React.ComponentProps<"span"> {
-  showRemaining?: boolean;
-}
-declare function renderPreviewTimeDisplay(props: PreviewTimeDisplayProps, state: PreviewTimeDisplayState): JSX.Element;
-declare const PreviewTimeDisplay: ConnectedComponent<PreviewTimeDisplayProps, typeof renderPreviewTimeDisplay>;
-//#endregion
-//#region src/components/TimeSlider.d.ts
-interface TimeSliderProps extends React.ComponentPropsWithRef<"div"> {
-  orientation?: "horizontal" | "vertical";
-}
-interface TimeSliderRenderProps extends React.ComponentProps<"div"> {
-  "data-orientation"?: "horizontal" | "vertical";
-  "data-current-time"?: number;
-  "data-duration"?: number;
-}
-declare function renderTimeSliderRoot(props: TimeSliderRenderProps): JSX.Element;
-declare const TimeSliderRoot: ConnectedComponent<TimeSliderProps, typeof renderTimeSliderRoot>;
-declare function renderTimeSliderTrack(props: TimeSliderRenderProps): JSX.Element;
-declare const TimeSliderTrack: ConnectedComponent<React.ComponentProps<"div">, typeof renderTimeSliderTrack>;
-declare function renderTimeSliderThumb(props: TimeSliderRenderProps): JSX.Element;
-declare const TimeSliderThumb: ConnectedComponent<React.ComponentProps<"div">, typeof renderTimeSliderThumb>;
-declare function renderTimeSliderPointer(props: TimeSliderRenderProps): JSX.Element;
-declare const TimeSliderPointer: ConnectedComponent<React.ComponentProps<"div">, typeof renderTimeSliderPointer>;
-declare function renderTimeSliderProgress(props: TimeSliderRenderProps): JSX.Element;
-declare const TimeSliderProgress: ConnectedComponent<React.ComponentProps<"div">, typeof renderTimeSliderProgress>;
-declare const TimeSlider: {
-  Root: typeof TimeSliderRoot;
-  Track: typeof TimeSliderTrack;
-  Thumb: typeof TimeSliderThumb;
-  Pointer: typeof TimeSliderPointer;
-  Progress: typeof TimeSliderProgress;
-};
-//#endregion
-//#region src/components/Tooltip.d.ts
-type Placement = "top" | "top-start" | "top-end";
-interface TooltipRootProps {
-  delay?: number;
-  closeDelay?: number;
-  children: ReactNode;
-  trackCursorAxis?: "x" | "y" | "both";
-}
-interface TooltipTriggerProps {
-  children: ReactNode;
-}
-interface TooltipPositionerProps {
-  side?: Placement;
-  sideOffset?: number;
-  collisionPadding?: number;
-  children: ReactNode;
-}
-interface TooltipPopupProps {
-  id?: string;
-  className?: string;
-  children: ReactNode;
-}
-declare function TooltipRoot({
-  delay,
-  closeDelay,
-  trackCursorAxis,
-  children
-}: TooltipRootProps): JSX.Element;
-declare function TooltipTrigger({
-  children
-}: TooltipTriggerProps): JSX.Element;
-declare function TooltipPositioner({
-  side,
-  sideOffset,
-  collisionPadding,
-  children
-}: TooltipPositionerProps): JSX.Element | null;
-declare function TooltipPopup({
-  id,
-  className,
-  children
-}: TooltipPopupProps): JSX.Element | null;
-declare const Tooltip: {
-  Root: typeof TooltipRoot;
-  Trigger: typeof TooltipTrigger;
-  Positioner: typeof TooltipPositioner;
-  Popup: typeof TooltipPopup;
-};
-//#endregion
-//#region src/components/Video.d.ts
-type VideoProps = PropsWithChildren<DetailedHTMLProps<VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement> & {
-  className?: string | undefined;
-  style?: CSSProperties | undefined;
-}>;
-/**
-* Video - A basic video component that works with native HTML5 video formats (MP4, WebM, etc.)
-* without using a playback engine. Use this for simple MP4 files. For HLS/DASH streaming, use the
-* regular Video component instead.
-*
-* This component connects to VideoProvider for play/pause state but sets the src directly on the
-* video element without going through HLS.js or other playback engines.
-*
-* @example
-* ```tsx
-* <VideoProvider>
-*   <MediaSkin>
-*     <Video src="video.mp4" />
-*   </MediaSkin>
-* </VideoProvider>
-* ```
-*/
-declare const Video: React$1.ForwardRefExoticComponent<VideoProps & React$1.RefAttributes<HTMLVideoElement>>;
-//#endregion
-//#region src/components/VolumeSlider.d.ts
-interface VolumeSliderProps extends React.ComponentProps<"div"> {
-  orientation?: "horizontal" | "vertical";
-}
-interface VolumeSliderRenderProps extends React.ComponentProps<"div"> {
-  "data-orientation"?: "horizontal" | "vertical";
-  "data-muted"?: boolean;
-  "data-volume-level"?: string;
-}
-declare function renderVolumeSliderRoot(props: VolumeSliderRenderProps): JSX.Element;
-declare const VolumeSliderRoot: ConnectedComponent<VolumeSliderProps, typeof renderVolumeSliderRoot>;
-declare function renderVolumeSliderTrack(props: VolumeSliderRenderProps): JSX.Element;
-declare const VolumeSliderTrack: ConnectedComponent<React.ComponentProps<"div">, typeof renderVolumeSliderTrack>;
-declare function renderVolumeSliderThumb(props: VolumeSliderRenderProps): JSX.Element;
-declare const VolumeSliderThumb: ConnectedComponent<React.ComponentProps<"div">, typeof renderVolumeSliderThumb>;
-declare function renderVolumeSliderProgress(props: VolumeSliderRenderProps): JSX.Element;
-declare const VolumeSliderProgress: ConnectedComponent<React.ComponentProps<"div">, typeof renderVolumeSliderProgress>;
-declare const VolumeSlider: {
-  Root: typeof VolumeSliderRoot;
-  Track: typeof VolumeSliderTrack;
-  Thumb: typeof VolumeSliderThumb;
-  Progress: typeof VolumeSliderProgress;
-};
-//#endregion
-export { CurrentTimeDisplay, DurationDisplay, FrostedSkin, FullscreenButton, HlsVideo, MediaContainer, MediaContext, MediaState, MediaStateOwner, MediaStore, MinimalSkin, MuteButton, PlayButton, Popover, PreviewTimeDisplay, TimeSlider, Tooltip, Video, VideoProvider, VolumeSlider, useMediaContainerRef, useMediaDispatch, useMediaRef, useMediaSelector, useMediaStore };
-//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","names":["CurrentTimeDisplay: ConnectedComponent<CurrentTimeDisplayProps, typeof renderCurrentTimeDisplay>","DurationDisplay: ConnectedComponent<DurationDisplayProps, typeof renderDurationDisplay>","FullscreenButton: ConnectedComponent<FullscreenButtonProps, typeof renderFullscreenButton>","MediaContainer: FC<PropsWithChildren<HTMLProps<HTMLDivElement>>>","MuteButton: ConnectedComponent<MuteButtonProps, typeof renderMuteButton>","PlayButton: ConnectedComponent<PlayButtonProps, typeof renderPlayButton>","Popover: {\n  Root: typeof PopoverRoot;\n  Trigger: typeof PopoverTrigger;\n  Positioner: typeof PopoverPositioner;\n  Popup: typeof PopoverPopup;\n}","PreviewTimeDisplay: ConnectedComponent<PreviewTimeDisplayProps, typeof renderPreviewTimeDisplay>","TimeSliderRoot: ConnectedComponent<TimeSliderProps, typeof renderTimeSliderRoot>","TimeSliderTrack: ConnectedComponent<React.ComponentProps<'div'>, typeof renderTimeSliderTrack>","TimeSliderThumb: ConnectedComponent<React.ComponentProps<'div'>, typeof renderTimeSliderThumb>","TimeSliderPointer: ConnectedComponent<\n  React.ComponentProps<'div'>,\n  typeof renderTimeSliderPointer\n>","TimeSliderProgress: ConnectedComponent<\n  React.ComponentProps<'div'>,\n  typeof renderTimeSliderProgress\n>","Tooltip: {\n  Root: typeof TooltipRoot;\n  Trigger: typeof TooltipTrigger;\n  Positioner: typeof TooltipPositioner;\n  Popup: typeof TooltipPopup;\n}","Video: React.ForwardRefExoticComponent<\n  VideoProps & React.RefAttributes<HTMLVideoElement>\n>","VolumeSliderRoot: ConnectedComponent<VolumeSliderProps, typeof renderVolumeSliderRoot>","VolumeSliderTrack: ConnectedComponent<\n  React.ComponentProps<'div'>,\n  typeof renderVolumeSliderTrack\n>","VolumeSliderThumb: ConnectedComponent<\n  React.ComponentProps<'div'>,\n  typeof renderVolumeSliderThumb\n>","VolumeSliderProgress: ConnectedComponent<\n  React.ComponentProps<'div'>,\n  typeof renderVolumeSliderProgress\n>"],"sources":["../src/utils/component-factory.tsx","../src/components/CurrentTimeDisplay.tsx","../src/components/DurationDisplay.tsx","../src/components/FullscreenButton.tsx","../src/components/HlsVideo.tsx","../src/components/MediaContainer.tsx","../src/components/MuteButton.tsx","../src/components/PlayButton.tsx","../src/components/Popover.tsx","../src/components/PreviewTimeDisplay.tsx","../src/components/TimeSlider.tsx","../src/components/Tooltip.tsx","../src/components/Video.tsx","../src/components/VolumeSlider.tsx"],"sourcesContent":[],"mappings":"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"}

package/dist/index.js

@@ -1,89 +0,0 @@
-'use client';
-
-
-import { a as useMediaStore, i as useMediaSelector, n as useMediaDispatch, o as MediaContext, r as useMediaRef, t as VideoProvider } from "./store-hGO5HE2A.js";
-import { _ as DurationDisplay, a as TimeSlider, c as Popover, f as MuteButton, g as FullscreenButton, h as useMediaContainerRef, m as MediaContainer, o as PreviewTimeDisplay, r as Tooltip, t as VolumeSlider, u as PlayButton, v as CurrentTimeDisplay } from "./VolumeSlider-DmlupkvF.js";
-import "./icons-BqfV81R8.js";
-import { t as FrostedSkin } from "./frosted-0lXuIgHt.js";
-import { t as MinimalSkin } from "./minimal-B-R9aRNe.js";
-import React, { forwardRef, useImperativeHandle, useRef } from "react";
-import { jsx } from "react/jsx-runtime";
-import { createMediaPlaybackController } from "@videojs/core/media";
-
-//#region src/components/HlsVideo.tsx
-function useMediaStateOwner(ref, createMediaPlaybackController$1) {
-	const mediaStateOwnerRef = useRef(createMediaPlaybackController$1());
-	useImperativeHandle(ref, () => mediaStateOwnerRef.current, []);
-	return { updateMediaElement(mediaEl, props) {
-		mediaStateOwnerRef.current.mediaElement = mediaEl ?? void 0;
-		mediaStateOwnerRef.current.src = props.src;
-		if (props.muted) mediaStateOwnerRef.current.muted = props.muted;
-	} };
-}
-const DefaultVideoComponent = forwardRef(({ children,...props }, ref) => {
-	const { updateMediaElement } = useMediaStateOwner(ref, createMediaPlaybackController);
-	return /* @__PURE__ */ jsx("video", {
-		...props,
-		ref: (mediaEl) => {
-			/** @TODO In later iterations/non-POC, we should be able to have a function that can be used directly for the `ref` prop (CJP) */
-			updateMediaElement(mediaEl, props);
-		},
-		children
-	});
-});
-/**
-* @description This is a "thin wrapper" around the media component whose primary responsibility is to wire up the element
-* to the <VideoProvider/>'s MediaStore for the media state.
-* @param props - Identical to both a <video/>'s props and the <Player/> props, with one addition that may be familiar to
-* MUI users: a `component` prop that allows you to use something other than the <video/> element under the hood.
-* @returns A media react component (e.g. <video/>), wired up as the media element.
-*/
-function ConnectedVideo({ component, children,...props }) {
-	const Component = component;
-	const mediaRefCallback = useMediaRef();
-	return /* @__PURE__ */ jsx(Component, {
-		...props,
-		ref: mediaRefCallback,
-		children
-	});
-}
-function HlsVideo({ component = DefaultVideoComponent, children,...props }) {
-	return /* @__PURE__ */ jsx(ConnectedVideo, {
-		...props,
-		component,
-		children
-	});
-}
-
-//#endregion
-//#region src/components/Video.tsx
-/**
-* Video - A basic video component that works with native HTML5 video formats (MP4, WebM, etc.)
-* without using a playback engine. Use this for simple MP4 files. For HLS/DASH streaming, use the
-* regular Video component instead.
-*
-* This component connects to VideoProvider for play/pause state but sets the src directly on the
-* video element without going through HLS.js or other playback engines.
-*
-* @example
-* ```tsx
-* <VideoProvider>
-*   <MediaSkin>
-*     <Video src="video.mp4" />
-*   </MediaSkin>
-* </VideoProvider>
-* ```
-*/
-const Video = forwardRef(({ children,...props }, _ref) => {
-	const mediaRefCallback = useMediaRef();
-	return /* @__PURE__ */ jsx("video", {
-		...props,
-		ref: mediaRefCallback,
-		children
-	});
-});
-Video.displayName = "Video";
-
-//#endregion
-export { CurrentTimeDisplay, DurationDisplay, FrostedSkin, FullscreenButton, HlsVideo, MediaContainer, MediaContext, MinimalSkin, MuteButton, PlayButton, Popover, PreviewTimeDisplay, TimeSlider, Tooltip, Video, VideoProvider, VolumeSlider, useMediaContainerRef, useMediaDispatch, useMediaRef, useMediaSelector, useMediaStore };
-//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["createMediaPlaybackController","DefaultVideoComponent: ElementType<\n  Omit<DetailedHTMLProps<VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, 'ref'> & { ref: Ref<any> }\n>","Video: React.ForwardRefExoticComponent<\n  VideoProps & React.RefAttributes<HTMLVideoElement>\n>"],"sources":["../src/components/HlsVideo.tsx","../src/components/Video.tsx"],"sourcesContent":["import type {\n  CSSProperties,\n  DetailedHTMLProps,\n  ElementType,\n  PropsWithChildren,\n  Ref,\n  VideoHTMLAttributes,\n} from 'react';\n\nimport { createMediaPlaybackController } from '@videojs/core/media';\n\nimport { forwardRef, useImperativeHandle, useRef } from 'react';\nimport { useMediaRef } from '@/store';\n\nexport interface MuxVideoProps {\n  'playback-id'?: string;\n}\n\ntype MediaStateOwner = NonNullable<Parameters<ReturnType<typeof useMediaRef>>[0]>;\n\n/** @TODO Improve type inference and narrowing/widening for different use cases (CJP) */\ntype ComponentType = ElementType<\n  Omit<DetailedHTMLProps<VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, 'ref'> & {\n    ref: Ref<MediaStateOwner>;\n  }\n>;\n\n// These are the first steps/WIP POC of decoupling the Media State Owner from the DOM.\n// Note that everything will still work if you use:\n// 1. an audio/video element directly\n// 2. a custom element a la media-elements\ntype CreateMediaStateOwner = typeof createMediaPlaybackController;\n\nfunction useMediaStateOwner(ref: Ref<any>, createMediaPlaybackController: CreateMediaStateOwner) {\n  const mediaStateOwnerRef = useRef(createMediaPlaybackController(/* props? */));\n  useImperativeHandle(ref, () => mediaStateOwnerRef.current, []);\n  /** @TODO Parameterize this (CJP) */\n  type ComponentProps = DetailedHTMLProps<VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>;\n  return {\n    updateMediaElement(mediaEl: HTMLMediaElement | null, props: ComponentProps) {\n      // NOTE: The details here will almost definitely change for a less \"bare bones\"/\"POC\" implementation of Media State Owner impl. (CJP)\n      mediaStateOwnerRef.current.mediaElement = mediaEl ?? undefined;\n      mediaStateOwnerRef.current.src = props.src as string;\n      if (props.muted) {\n        mediaStateOwnerRef.current.muted = props.muted;\n      }\n    },\n  };\n}\n\nconst DefaultVideoComponent: ElementType<\n  Omit<DetailedHTMLProps<VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, 'ref'> & { ref: Ref<any> }\n> = forwardRef<any, any>(({ children, ...props }, ref) => {\n  const { updateMediaElement } = useMediaStateOwner(ref, createMediaPlaybackController);\n  return (\n    // eslint-disable-next-line jsx-a11y/media-has-caption\n    <video\n      {...props}\n      ref={(mediaEl) => {\n        /** @TODO In later iterations/non-POC, we should be able to have a function that can be used directly for the `ref` prop (CJP) */\n        updateMediaElement(mediaEl, props);\n      }}\n    >\n      {children}\n    </video>\n  );\n});\n\n/**\n * @description This is a \"thin wrapper\" around the media component whose primary responsibility is to wire up the element\n * to the <VideoProvider/>'s MediaStore for the media state.\n * @param props - Identical to both a <video/>'s props and the <Player/> props, with one addition that may be familiar to\n * MUI users: a `component` prop that allows you to use something other than the <video/> element under the hood.\n * @returns A media react component (e.g. <video/>), wired up as the media element.\n */\nfunction ConnectedVideo({\n  component,\n  children,\n  ...props\n}: PropsWithChildren<{\n  component: ComponentType;\n  className?: string | undefined;\n  style?: CSSProperties | undefined;\n}>) {\n  const Component = component;\n  const mediaRefCallback = useMediaRef();\n  // NOTE: While this may feel like magic to folks, in the \"default\" use case, you can think of it as:\n  // return (<video ref={mediaRefCallback} {...restProps} >{children}</video>);\n  return (\n    <Component {...props} ref={mediaRefCallback}>\n      {children}\n    </Component>\n  );\n}\n\nexport type VideoProps = PropsWithChildren<{\n  component?: ComponentType;\n  className?: string | undefined;\n  style?: CSSProperties | undefined;\n}>;\n\n// HlsVideo component with default component\nexport function HlsVideo({ component = DefaultVideoComponent, children, ...props }: VideoProps): JSX.Element {\n  return (\n    <ConnectedVideo {...props} component={component}>\n      {children}\n    </ConnectedVideo>\n  );\n}\n\nexport default HlsVideo;\n","import type {\n  CSSProperties,\n  DetailedHTMLProps,\n  PropsWithChildren,\n  VideoHTMLAttributes,\n} from 'react';\n\nimport React, { forwardRef } from 'react';\nimport { useMediaRef } from '@/store';\n\nexport type VideoProps = PropsWithChildren<\n  DetailedHTMLProps<VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement> & {\n    className?: string | undefined;\n    style?: CSSProperties | undefined;\n  }\n>;\n\n/**\n * Video - A basic video component that works with native HTML5 video formats (MP4, WebM, etc.)\n * without using a playback engine. Use this for simple MP4 files. For HLS/DASH streaming, use the\n * regular Video component instead.\n *\n * This component connects to VideoProvider for play/pause state but sets the src directly on the\n * video element without going through HLS.js or other playback engines.\n *\n * @example\n * ```tsx\n * <VideoProvider>\n *   <MediaSkin>\n *     <Video src=\"video.mp4\" />\n *   </MediaSkin>\n * </VideoProvider>\n * ```\n */\nexport const Video: React.ForwardRefExoticComponent<\n  VideoProps & React.RefAttributes<HTMLVideoElement>\n> = forwardRef<HTMLVideoElement, VideoProps>(\n  ({ children, ...props }, _ref) => {\n    const mediaRefCallback = useMediaRef();\n\n    return (\n      // eslint-disable-next-line jsx-a11y/media-has-caption\n      <video {...props} ref={mediaRefCallback}>\n        {children}\n      </video>\n    );\n  },\n);\n\nVideo.displayName = 'Video';\n\nexport default Video;\n"],"mappings":";;;;;;;;;;;;;AAiCA,SAAS,mBAAmB,KAAe,iCAAsD;CAC/F,MAAM,qBAAqB,OAAOA,iCAA2C,CAAC;AAC9E,qBAAoB,WAAW,mBAAmB,SAAS,EAAE,CAAC;AAG9D,QAAO,EACL,mBAAmB,SAAkC,OAAuB;AAE1E,qBAAmB,QAAQ,eAAe,WAAW;AACrD,qBAAmB,QAAQ,MAAM,MAAM;AACvC,MAAI,MAAM,MACR,oBAAmB,QAAQ,QAAQ,MAAM;IAG9C;;AAGH,MAAMC,wBAEF,YAAsB,EAAE,SAAU,GAAG,SAAS,QAAQ;CACxD,MAAM,EAAE,uBAAuB,mBAAmB,KAAK,8BAA8B;AACrF,QAEE,oBAAC;EACC,GAAI;EACJ,MAAM,YAAY;;AAEhB,sBAAmB,SAAS,MAAM;;EAGnC;GACK;EAEV;;;;;;;;AASF,SAAS,eAAe,EACtB,WACA,SACA,GAAG,SAKD;CACF,MAAM,YAAY;CAClB,MAAM,mBAAmB,aAAa;AAGtC,QACE,oBAAC;EAAU,GAAI;EAAO,KAAK;EACxB;GACS;;AAWhB,SAAgB,SAAS,EAAE,YAAY,uBAAuB,SAAU,GAAG,SAAkC;AAC3G,QACE,oBAAC;EAAe,GAAI;EAAkB;EACnC;GACc;;;;;;;;;;;;;;;;;;;;;;ACxErB,MAAaC,QAET,YACD,EAAE,SAAU,GAAG,SAAS,SAAS;CAChC,MAAM,mBAAmB,aAAa;AAEtC,QAEE,oBAAC;EAAM,GAAI;EAAO,KAAK;EACpB;GACK;EAGb;AAED,MAAM,cAAc"}

package/dist/minimal-B-R9aRNe.js

@@ -1,162 +0,0 @@
-import { _ as DurationDisplay, a as TimeSlider, d as PlayButton_default, g as FullscreenButton, i as Tooltip_default, l as Popover_default, m as MediaContainer, n as VolumeSlider_default, p as MuteButton_default, s as PreviewTimeDisplay_default, v as CurrentTimeDisplay } from "./VolumeSlider-DmlupkvF.js";
-import { a as Play_default, c as FullscreenExitAlt_default, n as VolumeLow_default, o as Pause_default, r as VolumeHigh_default, t as VolumeOff_default, u as FullscreenEnterAlt_default } from "./icons-BqfV81R8.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/skins/minimal/styles.ts
-function cn(...classes) {
-	return classes.filter(Boolean).join(" ");
-}
-const styles = {
-	MediaContainer: cn("vjs", "vjs:relative vjs:isolate vjs:@container/root vjs:group/root vjs:overflow-clip vjs:bg-black vjs:rounded-(--minimal-border-radius,0.75rem)", "vjs:font-sans vjs:text-[0.8125rem] vjs:subpixel-antialiased", "vjs:after:absolute vjs:after:inset-0 vjs:after:ring-black/15 vjs:after:ring-1 vjs:dark:after:ring-white/15 vjs:after:ring-inset vjs:after:z-10 vjs:after:pointer-events-none vjs:after:rounded-[inherit]", "vjs:[&:fullscreen]:rounded-none", "vjs:[&_video]:w-full vjs:[&_video]:h-full"),
-	Overlay: cn("vjs:absolute vjs:inset-0 vjs:rounded-[inherit] vjs:pointer-events-none", "vjs:bg-gradient-to-t vjs:from-black/70 vjs:via-black/50 vjs:via-[7.5rem] vjs:to-transparent", "vjs:opacity-0 vjs:delay-500 vjs:duration-300", "vjs:contrast-more:from-black/75", "vjs:has-[+.controls_[data-paused]]:opacity-100 vjs:has-[+.controls_[data-paused]]:delay-0 vjs:has-[+.controls_[data-paused]]:duration-75", "vjs:has-[+.controls_[aria-expanded=\"true\"]]:opacity-100 vjs:has-[+.controls_[aria-expanded=\"true\"]]:delay-0 vjs:has-[+.controls_[aria-expanded=\"true\"]]:duration-75", "vjs:group-hover/root:opacity-100 vjs:group-hover/root:delay-0 vjs:group-hover/root:duration-75"),
-	Controls: cn("controls", "vjs:@container/controls vjs:absolute vjs:inset-x-0 vjs:bottom-0 vjs:flex vjs:items-center vjs:gap-3.5 vjs:z-20 vjs:px-3 vjs:pb-3 vjs:pt-10 vjs:text-white", "vjs:transition vjs:will-change-[transform,filter,opacity] vjs:ease-out", "vjs:translate-y-full vjs:opacity-0 vjs:blur-sm vjs:delay-500 vjs:duration-300", "vjs:has-[[data-paused]]:translate-y-0 vjs:has-[[data-paused]]:opacity-100 vjs:has-[[data-paused]]:blur-none vjs:has-[[data-paused]]:delay-0 vjs:has-[[data-paused]]:duration-75", "vjs:has-[[aria-expanded=\"true\"]]:translate-y-0 vjs:has-[[aria-expanded=\"true\"]]:opacity-100 vjs:has-[[aria-expanded=\"true\"]]:blur-none vjs:has-[[aria-expanded=\"true\"]]:delay-0 vjs:has-[[aria-expanded=\"true\"]]:duration-75", "vjs:group-hover/root:translate-y-0 vjs:group-hover/root:opacity-100 vjs:group-hover/root:blur-none vjs:group-hover/root:delay-0 vjs:group-hover/root:duration-75"),
-	Icon: cn("icon vjs:[&_path]:transition-transform vjs:[&_path]:ease-out"),
-	TimeDisplayGroup: cn("flex items-center gap-1"),
-	Button: cn("vjs:group/button vjs:cursor-pointer vjs:relative vjs:shrink-0 vjs:transition-[color,background,outline-offset] vjs:select-none vjs:p-2.5 vjs:rounded-md", "vjs:bg-transparent vjs:text-white", "vjs:hover:text-white/80 vjs:focus-visible:text-white/80", "vjs:-outline-offset-2 vjs:focus-visible:outline-2 vjs:focus-visible:outline-offset-2 vjs:focus-visible:outline-white", "vjs:disabled:grayscale vjs:disabled:opacity-50 vjs:disabled:cursor-not-allowed", "vjs:aria-busy:pointer-events-none vjs:aria-busy:cursor-not-allowed", "vjs:aria-expanded:text-white/80"),
-	ButtonGroup: cn("vjs:flex vjs:items-center vjs:gap-1.5"),
-	IconButton: cn("vjs:grid vjs:[&_.icon]:[grid-area:1/1]", "vjs:[&_.icon]:shrink-0 vjs:[&_.icon]:transition-opacity vjs:[&_.icon]:duration-150 vjs:[&_.icon]:ease-linear vjs:[&_.icon]:drop-shadow-[0_1px_0_var(--tw-shadow-color)] vjs:[&_.icon]:shadow-black/40"),
-	PlayIcon: cn("vjs:opacity-0 vjs:group-data-paused/button:opacity-100"),
-	PauseIcon: cn("vjs:group-data-paused/button:opacity-0"),
-	PlayTooltipPopup: cn("vjs:[&_.pause-tooltip]:inline vjs:data-paused:[&_.pause-tooltip]:hidden", "vjs:[&_.play-tooltip]:hidden vjs:data-paused:[&_.play-tooltip]:inline"),
-	PlayTooltip: cn("play-tooltip"),
-	PauseTooltip: cn("pause-tooltip"),
-	VolumeHighIcon: cn("vjs:hidden vjs:group-data-[volume-level=high]/button:inline vjs:group-data-[volume-level=medium]/button:inline"),
-	VolumeLowIcon: cn("vjs:hidden vjs:group-data-[volume-level=low]/button:inline"),
-	VolumeOffIcon: cn("vjs:hidden vjs:group-data-[volume-level=off]/button:inline"),
-	FullscreenEnterIcon: cn("vjs:group-data-fullscreen/button:hidden", "vjs:group-hover/button:[&_.arrow-1]:translate-x-px vjs:group-hover/button:[&_.arrow-1]:-translate-y-px", "vjs:group-hover/button:[&_.arrow-2]:-translate-x-px vjs:group-hover/button:[&_.arrow-2]:translate-y-px"),
-	FullscreenExitIcon: cn("vjs:hidden vjs:group-data-fullscreen/button:inline", "vjs:[&_.arrow-1]:translate-x-px vjs:[&_.arrow-1]:-translate-y-px", "vjs:[&_.arrow-2]:-translate-x-px vjs:[&_.arrow-2]:translate-y-px", "vjs:group-hover/button:[&_.arrow-1]:translate-0", "vjs:group-hover/button:[&_.arrow-2]:translate-0"),
-	FullscreenTooltipPopup: cn("vjs:[&_.fullscreen-enter-tooltip]:inline vjs:data-fullscreen:[&_.fullscreen-enter-tooltip]:hidden", "vjs:[&_.fullscreen-exit-tooltip]:hidden vjs:data-fullscreen:[&_.fullscreen-exit-tooltip]:inline"),
-	FullscreenEnterTooltip: cn("fullscreen-enter-tooltip"),
-	FullscreenExitTooltip: cn("fullscreen-exit-tooltip"),
-	TimeSliderRoot: cn("vjs:mx-2"),
-	TimeDisplay: cn("vjs:tabular-nums vjs:text-shadow-2xs/20"),
-	DurationDisplay: cn("vjs:text-white/50 vjs:contents"),
-	SliderRoot: cn("vjs:group/slider vjs:outline-0 vjs:flex vjs:items-center vjs:justify-center vjs:flex-1 vjs:group/slider vjs:relative vjs:rounded-full", "vjs:data-[orientation=horizontal]:h-5 vjs:data-[orientation=horizontal]:min-w-20", "vjs:data-[orientation=vertical]:w-5 vjs:data-[orientation=vertical]:h-18"),
-	SliderTrack: cn("vjs:relative vjs:select-none vjs:rounded-[inherit] vjs:bg-white/10", "vjs:data-[orientation=horizontal]:w-full vjs:data-[orientation=horizontal]:h-[0.1875rem]", "vjs:data-[orientation=vertical]:w-[0.1875rem]", "vjs:-outline-offset-2 vjs:group-focus-visible/slider:outline-2 vjs:group-focus-visible/slider:outline-offset-6 vjs:group-focus-visible/slider:outline-white"),
-	SliderProgress: cn("vjs:bg-white vjs:rounded-[inherit]"),
-	SliderPointer: cn("vjs:hidden"),
-	SliderThumb: cn("vjs:bg-white vjs:z-10 vjs:size-3 vjs:select-none vjs:ring vjs:ring-black/10 vjs:rounded-full vjs:shadow-sm vjs:shadow-black/15 vjs:transition-[opacity,scale] vjs:ease-out vjs:opacity-0 vjs:scale-70 vjs:origin-center", "vjs:group-hover/slider:opacity-100 vjs:group-hover/slider:scale-100", "vjs:data-[orientation=horizontal]:hover:cursor-ew-resize", "vjs:data-[orientation=vertical]:hover:cursor-ns-resize"),
-	PopupAnimation: cn("vjs:transition-[transform,scale,opacity,filter] vjs:origin-bottom vjs:duration-200 vjs:data-instant:duration-0", "vjs:data-starting-style:scale-0 vjs:data-starting-style:opacity-0 vjs:data-starting-style:blur-sm", "vjs:data-ending-style:scale-0 vjs:data-ending-style:opacity-0 vjs:data-ending-style:blur-sm"),
-	PopoverPopup: cn("vjs:py-2 vjs:bg-transparent"),
-	TooltipPopup: cn("vjs:whitespace-nowrap vjs:flex vjs:flex-col vjs:rounded vjs:text-white vjs:text-xs vjs:@7xl/root:text-sm vjs:px-2 vjs:py-1 vjs:bg-white/20 vjs:backdrop-blur-3xl vjs:backdrop-saturate-150 vjs:backdrop-brightness-90 vjs:shadow-md vjs:shadow-black/5")
-};
-var styles_default = styles;
-
-//#endregion
-//#region src/skins/minimal/MinimalSkin.tsx
-function MinimalSkin({ children, className = "" }) {
-	return /* @__PURE__ */ jsxs(MediaContainer, {
-		className: `${styles_default.MediaContainer} ${className}`,
-		children: [
-			children,
-			/* @__PURE__ */ jsx("div", { className: styles_default.Overlay }),
-			/* @__PURE__ */ jsxs("div", {
-				className: styles_default.Controls,
-				children: [
-					/* @__PURE__ */ jsxs(Tooltip_default.Root, {
-						delay: 500,
-						closeDelay: 0,
-						children: [/* @__PURE__ */ jsx(Tooltip_default.Trigger, { children: /* @__PURE__ */ jsxs(PlayButton_default, {
-							className: `${styles_default.Button} ${styles_default.IconButton}`,
-							children: [/* @__PURE__ */ jsx(Play_default, { className: `${styles_default.Icon} ${styles_default.PlayIcon}` }), /* @__PURE__ */ jsx(Pause_default, { className: `${styles_default.Icon} ${styles_default.PauseIcon}` })]
-						}) }), /* @__PURE__ */ jsx(Tooltip_default.Positioner, {
-							side: "top-start",
-							sideOffset: 6,
-							collisionPadding: 12,
-							children: /* @__PURE__ */ jsxs(Tooltip_default.Popup, {
-								className: `${styles_default.PopupAnimation} ${styles_default.TooltipPopup} ${styles_default.PlayTooltipPopup}`,
-								children: [/* @__PURE__ */ jsx("span", {
-									className: styles_default.PlayTooltip,
-									children: "Play"
-								}), /* @__PURE__ */ jsx("span", {
-									className: styles_default.PauseTooltip,
-									children: "Pause"
-								})]
-							})
-						})]
-					}),
-					/* @__PURE__ */ jsxs("div", {
-						className: styles_default.TimeDisplayGroup,
-						children: [/* @__PURE__ */ jsx(CurrentTimeDisplay, { className: styles_default.TimeDisplay }), /* @__PURE__ */ jsxs("span", {
-							className: styles_default.DurationDisplay,
-							children: ["/", /* @__PURE__ */ jsx(DurationDisplay, { className: `${styles_default.TimeDisplay}` })]
-						})]
-					}),
-					/* @__PURE__ */ jsxs(Tooltip_default.Root, {
-						trackCursorAxis: "x",
-						children: [/* @__PURE__ */ jsx(Tooltip_default.Trigger, { children: /* @__PURE__ */ jsxs(TimeSlider.Root, {
-							className: styles_default.SliderRoot,
-							children: [/* @__PURE__ */ jsxs(TimeSlider.Track, {
-								className: styles_default.SliderTrack,
-								children: [/* @__PURE__ */ jsx(TimeSlider.Progress, { className: styles_default.SliderProgress }), /* @__PURE__ */ jsx(TimeSlider.Pointer, { className: styles_default.SliderPointer })]
-							}), /* @__PURE__ */ jsx(TimeSlider.Thumb, { className: styles_default.SliderThumb })]
-						}) }), /* @__PURE__ */ jsx(Tooltip_default.Positioner, {
-							side: "top",
-							sideOffset: 12,
-							collisionPadding: 12,
-							children: /* @__PURE__ */ jsx(Tooltip_default.Popup, {
-								className: `${styles_default.PopupAnimation} ${styles_default.TooltipPopup}`,
-								children: /* @__PURE__ */ jsx(PreviewTimeDisplay_default, { className: styles_default.TimeDisplay })
-							})
-						})]
-					}),
-					/* @__PURE__ */ jsxs("div", {
-						className: styles_default.ButtonGroup,
-						children: [/* @__PURE__ */ jsxs(Popover_default.Root, {
-							openOnHover: true,
-							delay: 200,
-							closeDelay: 300,
-							children: [/* @__PURE__ */ jsx(Popover_default.Trigger, { children: /* @__PURE__ */ jsxs(MuteButton_default, {
-								className: `${styles_default.Button} ${styles_default.IconButton}`,
-								children: [
-									/* @__PURE__ */ jsx(VolumeHigh_default, { className: `${styles_default.Icon} ${styles_default.VolumeHighIcon}` }),
-									/* @__PURE__ */ jsx(VolumeLow_default, { className: `${styles_default.Icon} ${styles_default.VolumeLowIcon}` }),
-									/* @__PURE__ */ jsx(VolumeOff_default, { className: `${styles_default.Icon} ${styles_default.VolumeOffIcon}` })
-								]
-							}) }), /* @__PURE__ */ jsx(Popover_default.Positioner, {
-								side: "top",
-								sideOffset: 2,
-								children: /* @__PURE__ */ jsx(Popover_default.Popup, {
-									className: `${styles_default.PopupAnimation} ${styles_default.PopoverPopup}`,
-									children: /* @__PURE__ */ jsxs(VolumeSlider_default.Root, {
-										className: styles_default.SliderRoot,
-										orientation: "vertical",
-										children: [/* @__PURE__ */ jsx(VolumeSlider_default.Track, {
-											className: styles_default.SliderTrack,
-											children: /* @__PURE__ */ jsx(VolumeSlider_default.Progress, { className: styles_default.SliderProgress })
-										}), /* @__PURE__ */ jsx(VolumeSlider_default.Thumb, { className: styles_default.SliderThumb })]
-									})
-								})
-							})]
-						}), /* @__PURE__ */ jsxs(Tooltip_default.Root, {
-							delay: 500,
-							closeDelay: 0,
-							children: [/* @__PURE__ */ jsx(Tooltip_default.Trigger, { children: /* @__PURE__ */ jsxs(FullscreenButton, {
-								className: `${styles_default.Button} ${styles_default.IconButton}`,
-								children: [/* @__PURE__ */ jsx(FullscreenEnterAlt_default, { className: `${styles_default.Icon} ${styles_default.FullscreenEnterIcon}` }), /* @__PURE__ */ jsx(FullscreenExitAlt_default, { className: `${styles_default.Icon} ${styles_default.FullscreenExitIcon}` })]
-							}) }), /* @__PURE__ */ jsx(Tooltip_default.Positioner, {
-								side: "top-end",
-								sideOffset: 6,
-								collisionPadding: 12,
-								children: /* @__PURE__ */ jsxs(Tooltip_default.Popup, {
-									className: `${styles_default.PopupAnimation} ${styles_default.TooltipPopup} ${styles_default.FullscreenTooltipPopup}`,
-									children: [/* @__PURE__ */ jsx("span", {
-										className: styles_default.FullscreenEnterTooltip,
-										children: "Enter Fullscreen"
-									}), /* @__PURE__ */ jsx("span", {
-										className: styles_default.FullscreenExitTooltip,
-										children: "Exit Fullscreen"
-									})]
-								})
-							})]
-						})]
-					})
-				]
-			})
-		]
-	});
-}
-
-//#endregion
-export { MinimalSkin as t };
-//# sourceMappingURL=minimal-B-R9aRNe.js.map