feat(packages): add audio tracks menu (#1714)

site/src/content/docs/reference/feature-audio-track.mdx

@@ -0,0 +1,48 @@
+---
+title: Audio track
+description: Audio track state and actions for the player store
+---
+
+import FeatureReference from "@/components/docs/api-reference/FeatureReference.astro";
+import DocsLink from "@/components/docs/DocsLink.astro";
+import FrameworkCase from "@/components/docs/FrameworkCase.astro";
+
+Tracks available audio tracks and selects the enabled track.
+
+<FeatureReference feature="audioTrack" />
+
+### Selector
+
+<FrameworkCase frameworks={["react"]}>
+Pass `selectAudioTrack` to <DocsLink slug="reference/use-player">`usePlayer`</DocsLink> to subscribe to audio track state. Returns `undefined` if the audio track feature is not configured.
+</FrameworkCase>
+
+<FrameworkCase frameworks={["html"]}>
+Pass `selectAudioTrack` to <DocsLink slug="reference/player-controller">`PlayerController`</DocsLink> to subscribe to audio track state. Returns `undefined` if the audio track feature is not configured.
+</FrameworkCase>
+
+<FrameworkCase frameworks={["react"]}>
+```tsx title="AudioTrackInfo.tsx"
+import { selectAudioTrack, usePlayer } from '@videojs/react';
+
+function AudioTrackInfo() {
+  const audioTrack = usePlayer(selectAudioTrack);
+  if (!audioTrack) return null;
+
+  return <span>{audioTrack.audioTrackList.length} audio tracks</span>;
+}
+```
+</FrameworkCase>
+
+<FrameworkCase frameworks={["html"]}>
+```ts title="audio-track-info.ts"
+import { createPlayer, MediaElement, selectAudioTrack } from '@videojs/html';
+import { videoFeatures } from '@videojs/html/video';
+
+const { PlayerController, context } = createPlayer({ features: videoFeatures });
+
+class AudioTrackInfo extends MediaElement {
+  readonly #audioTrack = new PlayerController(this, context, selectAudioTrack);
+}
+```
+</FrameworkCase>

site/src/docs.config.ts

@@ -155,6 +155,7 @@ export const sidebar: Sidebar = [
       { slug: 'reference/feature-playback' },
       { slug: 'reference/feature-playback-rate' },
       { slug: 'reference/feature-quality' },
+      { slug: 'reference/feature-audio-track' },
       { slug: 'reference/feature-remote-playback' },
       { slug: 'reference/feature-source' },
       { slug: 'reference/feature-stream-type' },