feat: add DASH, Mux, and Vimeo as installation source types (UI + CLI) (#1732)

Co-authored-by: Claude <noreply@anthropic.com>

packages/cli/src/utils/format.ts

@@ -1,3 +1,4 @@
+import cdnMedia from '@/content/cdn-media.json';
 import {
   generateHTMLInstallCode,
   generateHTMLUsageCode,
@@ -7,6 +8,8 @@ import {
   type InstallationOptions,
 } from '@/utils/installation/codegen';
 
+const CDN_MEDIA_SUBPATHS = cdnMedia.map((entry) => entry.id);
+
 export function formatInstallationCode(opts: InstallationOptions): string {
   if (opts.framework === 'html') {
     return formatHTMLInstallation(opts);
@@ -15,7 +18,7 @@ export function formatInstallationCode(opts: InstallationOptions): string {
 }
 
 function formatHTMLInstallation(opts: InstallationOptions): string {
-  const install = generateHTMLInstallCode(opts);
+  const install = generateHTMLInstallCode(opts, CDN_MEDIA_SUBPATHS);
   const usage = generateHTMLUsageCode(opts);
   const sections: string[] = [];
 

packages/cli/src/utils/prompts.ts

@@ -3,8 +3,8 @@ import cdnMedia from '@/content/cdn-media.json';
 import { rendererSupportsCdn } from '@/utils/installation/cdn-code';
 import type { InstallationOptions } from '@/utils/installation/codegen';
 import { detectRenderer } from '@/utils/installation/detect-renderer';
+import { buildOptions } from '@/utils/installation/renderer-options';
 import type { InstallMethod, Renderer, Skin, UseCase } from '@/utils/installation/types';
-import { VALID_RENDERERS } from '@/utils/installation/types';
 import type { Framework } from './config.js';
 
 const CDN_MEDIA_SUBPATHS = cdnMedia.map((entry) => entry.id);
@@ -32,17 +32,12 @@ const PRESET_OPTIONS: Array<{ value: UseCase; label: string }> = [
   { value: 'background-video', label: 'Background Video' },
 ];
 
+// Reuse the installation page's option builder so labels and ordering stay in
+// lockstep with the UI.
 function mediaOptionsForUseCase(useCase: UseCase): Array<{ value: Renderer; label: string }> {
-  const RENDERER_LABELS: Record<Renderer, string> = {
-    'background-video': 'Background Video',
-    hls: 'HLS',
-    'html5-audio': 'HTML5 Audio',
-    'html5-video': 'HTML5 Video',
-  };
-
-  return VALID_RENDERERS[useCase].map((r) => ({
-    value: r,
-    label: RENDERER_LABELS[r],
+  return buildOptions(useCase).map((option) => ({
+    value: option.value as Renderer,
+    label: option.label,
   }));
 }
 

packages/cli/src/utils/tests/prompts.test.ts

@@ -1,19 +1,23 @@
 import { describe, expect, it } from 'vitest';
 import { supportsCdnInstall } from '../prompts.js';
 
-// Wires the cdn-media manifest into the CLI the same way the install page reads
-// the cdnMedia collection. Every current renderer ships (or is covered by) a
-// CDN build, so all resolve true; the no-CDN path (e.g. Vimeo) arrives with the
-// new rendering engines. `rendererSupportsCdn`'s false branch is unit-tested in
-// cdn-code.test.ts.
+// Mirrors the install page's CDN gating: preset renderers and media renderers
+// whose bundle ships a CDN build support CDN; Vimeo (no CDN build) does not.
 describe('supportsCdnInstall', () => {
-  it('returns true for preset renderers (covered by the preset bundle)', () => {
+  it('returns true for preset renderers', () => {
     expect(supportsCdnInstall('html5-video')).toBe(true);
     expect(supportsCdnInstall('html5-audio')).toBe(true);
     expect(supportsCdnInstall('background-video')).toBe(true);
   });
 
-  it('returns true for hls, whose media bundle ships a CDN build', () => {
+  it('returns true for media renderers with a CDN build', () => {
     expect(supportsCdnInstall('hls')).toBe(true);
+    expect(supportsCdnInstall('dash')).toBe(true);
+    expect(supportsCdnInstall('mux-video')).toBe(true);
+    expect(supportsCdnInstall('mux-audio')).toBe(true);
+  });
+
+  it('returns false for vimeo, which has no CDN build', () => {
+    expect(supportsCdnInstall('vimeo')).toBe(false);
   });
 });

packages/cli/src/utils/tests/site-aliases.test.ts

@@ -14,6 +14,7 @@ const ALIASED_FILES = [
   'utils/installation/types.ts',
   'utils/installation/cdn-code.ts',
   'utils/installation/detect-renderer.ts',
+  'utils/installation/renderer-options.ts',
   'consts.ts',
 ];