"use client"; import { MediaControlBar, MediaController, MediaMuteButton, MediaPlayButton, MediaSeekBackwardButton, MediaSeekForwardButton, MediaTimeDisplay, MediaTimeRange, MediaVolumeRange, } from "media-chrome/react"; import type { ComponentProps, CSSProperties } from "react"; import { cn } from "@/lib/utils"; export type VideoPlayerProps = ComponentProps; const variables = { "--media-primary-color": "var(--primary)", "--media-secondary-color": "var(--background)", "--media-text-color": "var(--foreground)", "--media-background-color": "var(--background)", "--media-control-hover-background": "var(--accent)", "--media-font-family": "var(--font-sans)", "--media-live-button-icon-color": "var(--muted-foreground)", "--media-live-button-indicator-color": "var(--destructive)", "--media-range-track-background": "var(--border)", } as CSSProperties; export const VideoPlayer = ({ style, ...props }: VideoPlayerProps) => ( ); export type VideoPlayerControlBarProps = ComponentProps; export const VideoPlayerControlBar = (props: VideoPlayerControlBarProps) => ( ); export type VideoPlayerTimeRangeProps = ComponentProps; export const VideoPlayerTimeRange = ({ className, ...props }: VideoPlayerTimeRangeProps) => ( ); export type VideoPlayerTimeDisplayProps = ComponentProps< typeof MediaTimeDisplay >; export const VideoPlayerTimeDisplay = ({ className, ...props }: VideoPlayerTimeDisplayProps) => ( ); export type VideoPlayerVolumeRangeProps = ComponentProps< typeof MediaVolumeRange >; export const VideoPlayerVolumeRange = ({ className, ...props }: VideoPlayerVolumeRangeProps) => ( ); export type VideoPlayerPlayButtonProps = ComponentProps; export const VideoPlayerPlayButton = ({ className, ...props }: VideoPlayerPlayButtonProps) => ( ); export type VideoPlayerSeekBackwardButtonProps = ComponentProps< typeof MediaSeekBackwardButton >; export const VideoPlayerSeekBackwardButton = ({ className, ...props }: VideoPlayerSeekBackwardButtonProps) => ( ); export type VideoPlayerSeekForwardButtonProps = ComponentProps< typeof MediaSeekForwardButton >; export const VideoPlayerSeekForwardButton = ({ className, ...props }: VideoPlayerSeekForwardButtonProps) => ( ); export type VideoPlayerMuteButtonProps = ComponentProps; export const VideoPlayerMuteButton = ({ className, ...props }: VideoPlayerMuteButtonProps) => ( ); export type VideoPlayerContentProps = ComponentProps<"video">; export const VideoPlayerContent = ({ className, ...props }: VideoPlayerContentProps) => (

video-player

Instalação

Dependências