byronwade/ui
Marketing & editorial

Video · Marketing & editorial

Playback menu

YouTube-style player settings menu: gear-triggered dropdown of setting groups (quality, speed, subtitles), each opening a single-select radio submenu.

@byronwade/foundation@byronwade/dropdown-menu@byronwade/utils@phosphor-icons/react

Feature showcase

Installation

Features

  • 1 example

    Default.

  • Tagged for youtube, video, tier:intermediate

API

Props

PropTypeDefaultDescription
groupsPlaybackMenuGroup[]-Quality, speed, subtitles setting groups.

Dependencies

PackageKindDescription
@byronwade/foundationregistryInstalled through the byronwade/ui registry.
@byronwade/dropdown-menuregistryInstalled through the byronwade/ui registry.
@byronwade/utilsregistryInstalled through the byronwade/ui registry.
@phosphor-icons/reactnpmInstalled from npm.

Source and related

FilePath
Componentregistry/components/playback-menu.tsx
Default examplecontent/examples/playback-menu/default.tsx