Voice Widget (rows design)#414
Open
Devon-White wants to merge 4 commits into
Open
Conversation
A TTS voice browser embedded in the docs: a bordered list of two-line rows (name over muted meta) with play-to-audition and copy-config, scoped under .vw.vw-rows and following the docs' light/dark brand tokens. - fern/components/voice-widget: the widget (index.tsx) over a shared data/helper engine (engine.tsx) + types; styles in styles.css. Loading state is a row-shaped skeleton built on the generic skeleton primitive. - Registered via docs.yml experimental.mdx-components + css. - Embedded on all 11 TTS pages (provider-locked on each provider page, groupBy="none" on the index). Supersedes the earlier stacked PRs #392 (parent), #407 (card refinements), and #409 (rows). The competing card design was dropped per the design decision to ship the rows layout; only the rows widget and its self-contained stylesheet remain.
This was referenced Jun 16, 2026
Closed
Contributor
Bump react + @types/react to ^19. React 19's useRef types require an explicit initial argument, so the copy-timer ref now passes undefined.
Closed
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
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.
Summary
Ships the Voice Widget — a TTS voice browser embedded in the docs — in its rows design, as a single clean PR off
main.The widget was prototyped across a stack of three PRs in two competing layouts (cards vs. rows). The team picked rows, so this PR brings only the rows widget plus its self-contained stylesheet; all card-design code/CSS was dropped.
What's here
fern/components/voice-widget/— the widget (index.tsx) rendering a bordered list of hairline-divided two-line rows (play-to-audition + copy-config), over a shared data/helper engine (engine.tsx) andtypes.ts. Styles instyles.css, scoped under.vw.vw-rowsand following the docs' light/dark brand tokens. The loading state is a row-shaped skeleton built on the genericskeleton/primitive.docs.yml(experimental.mdx-components+css:).<VoiceWidget provider="…" />),groupBy="none"on the TTS index. Includes the newer Inworld and MiniMax pages.Supersedes
Replaces the earlier stacked PRs, which should be closed:
Verification
tsc --noEmit -p fern/components/tsconfig.json→ cleanfern docs md check→ all 2801 MDX files valid