mirror of
https://github.com/zoriya/v10.git
synced 2026-08-05 05:37:21 +00:00
fix(docs): replace <Controls /> with <Controls.Root> in code samples (#1492)
This commit is contained in:
@@ -83,10 +83,10 @@ If you want more control than skins offer you, you can build your own UI from ou
|
||||
<Player.Provider>
|
||||
<Player.Container> {/* [!code focus] */}
|
||||
<Video src="video.mp4" />
|
||||
<MediaControls> {/* [!code focus] */}
|
||||
<Controls.Root> {/* [!code focus] */}
|
||||
<PlayButton /> {/* [!code focus] */}
|
||||
{/* ... */} {/* [!code focus] */}
|
||||
</MediaControls> {/* [!code focus] */}
|
||||
</Controls.Root> {/* [!code focus] */}
|
||||
</Player.Container> {/* [!code focus] */}
|
||||
</Player.Provider>
|
||||
```
|
||||
|
||||
@@ -21,7 +21,9 @@ The `<media-container>` is the player's physical surface. It defines the visual
|
||||
<Player.Provider>
|
||||
<Player.Container> {/* [!code focus] */}
|
||||
<video src="video.mp4" />
|
||||
<Controls />
|
||||
<Controls.Root>
|
||||
{/* ... */}
|
||||
</Controls.Root>
|
||||
</Player.Container> {/* [!code focus] */}
|
||||
</Player.Provider>
|
||||
```
|
||||
@@ -93,7 +95,9 @@ The container is the visual box around your media and controls. Sizing, aspect r
|
||||
```tsx
|
||||
<Player.Container style={{ width: 640, aspectRatio: '16/9' }}>
|
||||
<video src="video.mp4" />
|
||||
<Controls />
|
||||
<Controls.Root>
|
||||
{/* ... */}
|
||||
</Controls.Root>
|
||||
</Player.Container>
|
||||
```
|
||||
</FrameworkCase>
|
||||
@@ -175,7 +179,9 @@ The <DocsLink slug="reference/player-provider">provider</DocsLink> gives compone
|
||||
<Player.Provider>
|
||||
<Player.Container>
|
||||
<video src="video.mp4" />
|
||||
<Controls /> {/* fullscreen, activity detection, gestures */}
|
||||
<Controls.Root> {/* fullscreen, activity detection, gestures */}
|
||||
{/* ... */}
|
||||
</Controls.Root>
|
||||
</Player.Container>
|
||||
|
||||
<Transcript /> {/* state & actions, but no container behaviors */}
|
||||
|
||||
@@ -181,7 +181,9 @@ The provider's scope can extend beyond the fullscreen target. Playlists, transcr
|
||||
<Player.Provider>
|
||||
<Player.Container>
|
||||
<video src="video.mp4" />
|
||||
<Controls /> {/* goes fullscreen with the video */}
|
||||
<Controls.Root> {/* goes fullscreen with the video */}
|
||||
{/* ... */}
|
||||
</Controls.Root>
|
||||
</Player.Container>
|
||||
|
||||
<Transcript /> {/* outside container — still has store access */}
|
||||
|
||||
Reference in New Issue
Block a user