zoriya/v10
1
0
Fork 0
mirror of https://github.com/zoriya/v10.git synced 2026-08-16 02:45:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(react): use SimpleVideo as default Video and rename HLS version to HlsVideo (#171)

Browse Source
This commit is contained in:
Christian Pillsbury
2025-11-06 10:34:04 -08:00
committed by GitHub
parent 642d651881
commit 1878a271ba
20 changed files with 177 additions and 181 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/next-demo/app/page.tsx
+3 -3
View File
@@ -1,4 +1,4 @@
import { FrostedSkin, MinimalSkin, Video, VideoProvider } from '@videojs/react';
import { FrostedSkin, HlsVideo, MinimalSkin, VideoProvider } from '@videojs/react';
import '@videojs/react/skins/frosted.css';
import '@videojs/react/skins/minimal.css';
@@ -9,14 +9,14 @@ export default function Home() {
<VideoProvider>
<FrostedSkin>
{/* @ts-expect-error -- types are incorrect */}
<Video src="https://stream.mux.com/fXNzVtmtWuyz00xnSrJg4OJH6PyNo6D02UzmgeKGkP5YQ.m3u8" playsInline />
<HlsVideo src="https://stream.mux.com/fXNzVtmtWuyz00xnSrJg4OJH6PyNo6D02UzmgeKGkP5YQ.m3u8" playsInline />
</FrostedSkin>
</VideoProvider>
<h1 className="text-4xl font-extrabold py-2">Minimal Skin</h1>
<VideoProvider>
<MinimalSkin>
{/* @ts-expect-error -- types are incorrect */}
<Video src="https://stream.mux.com/fXNzVtmtWuyz00xnSrJg4OJH6PyNo6D02UzmgeKGkP5YQ.m3u8" playsInline />
<HlsVideo src="https://stream.mux.com/fXNzVtmtWuyz00xnSrJg4OJH6PyNo6D02UzmgeKGkP5YQ.m3u8" playsInline />
</MinimalSkin>
</VideoProvider>
</main>
examples/react-demo/src/App.tsx
+2 -2
View File
@@ -1,6 +1,6 @@
import type { ChangeEventHandler } from 'react';
import { FrostedSkin, MinimalSkin, Video, VideoProvider } from '@videojs/react';
import { FrostedSkin, HlsVideo, MinimalSkin, VideoProvider } from '@videojs/react';
import { FullscreenEnterAltIcon, FullscreenExitAltIcon } from '@videojs/react/icons';
import clsx from 'clsx';
import { useCallback, useMemo, useRef, useState } from 'react';
@@ -199,7 +199,7 @@ export default function App(): JSX.Element {
<VideoProvider key={key}>
<Skin className={skinClassName}>
{/* @ts-expect-error -- types are incorrect */}
<Video src={mediaSource} poster={poster} playsInline />
<HlsVideo src={mediaSource} poster={poster} playsInline />
</Skin>
</VideoProvider>
</div>