docs(site): add menu reference#1673
Merged
Merged
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
📦 Bundle Size Report🎨 @videojs/html — no changesPresets (7)
Media (10)
Players (5)
Skins (30)
UI Components (39)
Sizes are marginal over the root entry point. ⚛️ @videojs/react — no changesPresets (7)
Media (9)
Skins (27)
UI Components (33)
Sizes are marginal over the root entry point. 🧩 @videojs/core — no changesEntries (14)
🏷️ @videojs/element — no changesEntries (2)
📦 @videojs/store — no changesEntries (3)
🔧 @videojs/utils — no changesEntries (10)
📦 @videojs/spf — no changesEntries (4)
ℹ️ How to interpretJS sizes are initial static graph totals (minified + brotli). Lazy dynamic chunks are shown separately when present.
Run |
✅ Deploy Preview for vjs10-site ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
decepulis
reviewed
Jun 11, 2026
decepulis
left a comment
decepulis
left a comment
Collaborator
There was a problem hiding this comment.
Requesting a change to anatomy. But. Good otherwise!
Comment on lines
+26
to
+101
| <FrameworkCase frameworks={["react"]}> | ||
| ```tsx | ||
| <Menu.Root> | ||
| <Menu.Trigger>Settings</Menu.Trigger> | ||
| <Menu.Content> | ||
| <Menu.View> | ||
| <Menu.Root> | ||
| <Menu.Trigger type="playback-rate"> | ||
| Speed <Menu.ItemValue /> | ||
| </Menu.Trigger> | ||
| <Menu.Content> | ||
| <Menu.Back /> | ||
| <Menu.RadioGroup value={rate} onValueChange={setRate}> | ||
| <Menu.GroupLabel>Speed</Menu.GroupLabel> | ||
| <Menu.RadioItem value="1">Normal</Menu.RadioItem> | ||
| <Menu.RadioItem value="1.5">1.5x</Menu.RadioItem> | ||
| </Menu.RadioGroup> | ||
| </Menu.Content> | ||
| </Menu.Root> | ||
|
|
||
| <Menu.Root> | ||
| <Menu.Trigger type="captions"> | ||
| Captions <Menu.ItemValue /> | ||
| </Menu.Trigger> | ||
| <Menu.Content> | ||
| <Menu.Back /> | ||
| <Menu.RadioGroup value={captions} onValueChange={setCaptions}> | ||
| <Menu.GroupLabel>Captions</Menu.GroupLabel> | ||
| <Menu.RadioItem value="off">Off</Menu.RadioItem> | ||
| <Menu.RadioItem value="en">English</Menu.RadioItem> | ||
| </Menu.RadioGroup> | ||
| </Menu.Content> | ||
| </Menu.Root> | ||
|
|
||
| <Menu.Item onSelect={copyLink}>Copy link</Menu.Item> | ||
| </Menu.View> | ||
| </Menu.Content> | ||
| </Menu.Root> | ||
| ``` | ||
| </FrameworkCase> | ||
|
|
||
| <FrameworkCase frameworks={["html"]}> | ||
| ```html | ||
| <button type="button" commandfor="settings-menu">Settings</button> | ||
|
|
||
| <media-menu id="settings-menu"> | ||
| <media-menu-view> | ||
| <media-menu-item commandfor="speed-menu" type="playback-rate"> | ||
| Speed <media-menu-item-value></media-menu-item-value> | ||
| </media-menu-item> | ||
| <media-menu-item commandfor="captions-menu" type="captions"> | ||
| Captions <media-menu-item-value></media-menu-item-value> | ||
| </media-menu-item> | ||
| <media-menu-item>Copy link</media-menu-item> | ||
| </media-menu-view> | ||
|
|
||
| <media-menu id="speed-menu"> | ||
| <media-menu-back></media-menu-back> | ||
| <media-menu-radio-group value="1"> | ||
| <media-menu-group-label>Speed</media-menu-group-label> | ||
| <media-menu-radio-item value="1">Normal</media-menu-radio-item> | ||
| <media-menu-radio-item value="1.5">1.5x</media-menu-radio-item> | ||
| </media-menu-radio-group> | ||
| </media-menu> | ||
|
|
||
| <media-menu id="captions-menu"> | ||
| <media-menu-back></media-menu-back> | ||
| <media-menu-radio-group value="off"> | ||
| <media-menu-group-label>Captions</media-menu-group-label> | ||
| <media-menu-radio-item value="off">Off</media-menu-radio-item> | ||
| <media-menu-radio-item value="en">English</media-menu-radio-item> | ||
| </media-menu-radio-group> | ||
| </media-menu> | ||
| </media-menu> | ||
| ``` | ||
| </FrameworkCase> |
Collaborator
There was a problem hiding this comment.
The intent of Anatomy is to show off the available components and their intended hierarchy, not necessarily to give a working example. I think you can drop a lot of the detail here. More like this https://base-ui.com/react/components/menu
Collaborator
There was a problem hiding this comment.
If the docs skill misled you, it might need some editing!
Collaborator
Author
There was a problem hiding this comment.
This has been updated!
decepulis
approved these changes
Jul 7, 2026
decepulis
left a comment
decepulis
left a comment
Collaborator
There was a problem hiding this comment.
I'm a little confused by the asymmetry between captions/playback-rate and audio-track/quality. Should we have docs for captions-radio-group and playback-rate-radio-group? It does look like they exist.
Also noticed a few undocumented hooks.
Still, looks like this is an improvement for the docs and ready to merge as-is, so, I'll approve and we can hit the missing APIs in a follow-up!
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Work against #1672 (not closed, requires follow-up work)
Summary
Add the missing Menu component reference page and focused demos for React and HTML. This also updates the playback-rate and captions button references so their menu-trigger behavior matches the current Menu API.
Changes
menuTriggerbehavior on captions and playback-rate buttons.Testing
pnpm -F site api-docspnpm -F site buildNote
Low Risk
Documentation and demo assets only; library changes are JSDoc comment updates with no runtime logic changes.
Overview
Adds the Menu component reference (anatomy, submenus, setting
typevalues, styling, a11y) plus new QualityRadioGroup and AudioTrackRadioGroup pages, and wires them into the docs sidebar.Ships matching React and HTML settings-menu demos (quality, audio, speed, captions submenus with
Menu.ItemValue/ radio groups) and documentsmenuTriggeron the captions and playback-rate button references. ReactMenu.Item/Menu.TriggerJSDoc now listsqualityandaudio-trackalongside the existing setting types.Reviewed by Cursor Bugbot for commit bbaa837. Bugbot is set up for automated code reviews on this repo. Configure here.