From 0fb382700cf0525eba4ea792024623e38c0da4c6 Mon Sep 17 00:00:00 2001
From: heff <git@heff.me>
Date: Tue, 3 Feb 2026 17:49:46 -0800
Subject: [PATCH] fix(docs): updating installation langauge

---
 .../components/installation/UseCasePicker.tsx |  3 ++-
 site/src/content/docs/how-to/installation.mdx | 19 +++++++++----------
 site/src/stores/installation.ts               |  4 ++--
 3 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/site/src/components/installation/UseCasePicker.tsx b/site/src/components/installation/UseCasePicker.tsx
index e28b5d43..6bc8cb70 100644
--- a/site/src/components/installation/UseCasePicker.tsx
+++ b/site/src/components/installation/UseCasePicker.tsx
@@ -12,7 +12,8 @@ export default function UseCasePicker() {
       value={$useCase}
       onChange={(value) => useCase.set(value as UseCase)}
       options={[
-        { value: 'website' satisfies UseCase, label: 'Website', image: <Globe size={32} /> },
+        { value: 'default-video' satisfies UseCase, label: 'Default Video', image: <Globe size={32} /> },
+        { value: 'default-audio' satisfies UseCase, label: 'Default Audio', image: <Globe size={32} /> },
         { value: 'background-video' satisfies UseCase, label: 'Background Video', image: <Image size={32} /> },
       ]}
       aria-label="Select use case"
diff --git a/site/src/content/docs/how-to/installation.mdx b/site/src/content/docs/how-to/installation.mdx
index a02ac409..d22172c1 100644
--- a/site/src/content/docs/how-to/installation.mdx
+++ b/site/src/content/docs/how-to/installation.mdx
@@ -1,6 +1,6 @@
 ---
 title: Installation
-description: Get started with Video.js v10 by choosing your framework, skin, and media renderer
+description: Get started quickly with Video.js by building your first embed code
 ---
 
 import JSPicker from '@/components/installation/JSPicker.astro';
@@ -16,17 +16,16 @@ import DocsLink from '@/components/docs/DocsLink.astro';
 import FrameworkCase from '@/components/docs/FrameworkCase.astro';
 import { TabsRoot, TabsList, TabsPanel, Tab } from '@/components/Tabs.tsx';
 
-<Aside type="caution" title="Technical Preview">
-Video.js v10 is currently in technical preview. The API and docs are actively evolving. See the <DocsLink slug="concepts/v10-roadmap">roadmap</DocsLink> for more details on what's coming.
+<Aside type="caution" title="Beta Software">
+Video.js v10 is currently in _beta_. The API may evolve with [feedback&#x1F64F;](https://github.com/videojs/v10/issues). See the [Changelog](https://github.com/videojs/v10/blob/main/CHANGELOG.md)\[todo\] for recent updates and the <DocsLink slug="concepts/v10-roadmap">Roadmap</DocsLink> for more details on what's coming.
 </Aside>
 
-Video.js is beautifully crafted, accessible media player components; packed with powerful features; tuned for high-performance; intentionally built for your favorite frameworks; compatible with the media formats and hosting services you love.
-
-Get started quickly with a selection of great presets and skins, then extend and customize to your hearts content.
+Video.js is **audio and video player components** &mdash; intentionally built to achieve minimal bundle sizes while providing framework-specific customization and a great viewer experience.
+Answer the questions below to get started quickly with your first embed code.
 
 ## Choose your JS framework
 
-Video.js provides idiomatic experiences in both React and HTML Web Components. 
+Video.js aims to provide idiomatic development experiences in your favorite JS and CSS frameworks. More to come ([vote](https://github.com/videojs/v10/discussions/categories/ideas))\[todo\].
 
 <ContentWidth margins="lg">
   <JSPicker />
@@ -35,16 +34,16 @@ Video.js provides idiomatic experiences in both React and HTML Web Components.
 
 ## Choose your use case
 
-Use case presets get you started closer to your desired player without wrangling plugins. The default is the Website Player preset, which comes with a complete set of features for simple video playback on your site.
+The defaults work well for general website playback. More use case player presets to come.
 
 <ContentWidth margins="lg">
   <UseCasePicker client:idle />
 </ContentWidth>
 
 
-## Choose your media renderer
+## Choose your source type
 
-Media are like players without the UI.  Pick the one that matches your video or audio files and hosting. They can easily be changed later.
+Video.js supports your favorite file types and hosting services. Whichever you choose can be easily changed later. ([missing something?](https://github.com/videojs/v10/discussions/categories/ideas))
 
 <ContentWidth margins="lg">
   <RendererPicker client:idle />
diff --git a/site/src/stores/installation.ts b/site/src/stores/installation.ts
index 820a9d27..fda43a6b 100644
--- a/site/src/stores/installation.ts
+++ b/site/src/stores/installation.ts
@@ -16,11 +16,11 @@ export type Renderer =
 
 export type Skin = 'frosted' | 'minimal';
 
-export type UseCase = 'website' | 'background-video';
+export type UseCase = 'default-video' | 'default-audio' | 'background-video';
 
 export const renderer = atom<Renderer>('html5-video');
 export const skin = atom<Skin>('frosted');
-export const useCase = atom<UseCase>('website');
+export const useCase = atom<UseCase>('default-video');
 
 /** Mux playback ID from successful upload (used by code generation) */
 export const muxPlaybackId = atom<string | null>(null);