@typespec/playground 0.15.1 → 0.16.0-dev.2

package/dist/index.js

@@ -1,4 +1,4 @@
-import { i as createBrowserHost, n as registerMonacoLanguage } from "./services-okAeHMZK.js";
+import { i as createBrowserHost, n as registerMonacoLanguage } from "./services-D_Na2-tW.js";
 import { createUrlStateStorage } from "./state-storage.js";
 //#region src/monaco-worker.ts
 function registerMonacoDefaultWorkersForVite() {

package/dist/react/index.js

@@ -1,4 +1,4 @@
-import { a as resolveVirtualPath, i as createBrowserHost, n as registerMonacoLanguage, o as debugGlobals, r as updateDiagnosticsForCodeFixes, s as printDebugInfo, t as getMonacoRange } from "../services-okAeHMZK.js";
+import { a as resolveVirtualPath, i as createBrowserHost, n as registerMonacoLanguage, o as debugGlobals, r as updateDiagnosticsForCodeFixes, s as printDebugInfo, t as getMonacoRange } from "../services-D_Na2-tW.js";
 import { createUrlStateStorage } from "../state-storage.js";
 import { getSourceLocation } from "@typespec/compiler";
 import { KeyCode, KeyMod, MarkerSeverity, MarkerTag, Range, Uri, editor } from "monaco-editor";
@@ -7,11 +7,11 @@ import { Button, Card, Checkbox, DrawerBody, DrawerHeader, DrawerHeaderTitle, Fl
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { Broom16Filled, Bug16Regular, Checkmark16Regular, ChevronDown16Regular, ChevronDownRegular, ChevronRightRegular, DataLineRegular, Dismiss24Regular, DocumentBulletList24Regular, DocumentRegular, ErrorCircle16Filled, FolderListRegular, FolderRegular, MoreHorizontal24Filled, Save16Regular, SettingsRegular, Warning16Filled } from "@fluentui/react-icons";
 import debounce from "debounce";
-import { parse, stringify } from "yaml";
 import { $ } from "@typespec/compiler/typekit";
 import { ErrorBoundary } from "react-error-boundary";
 import { TypeGraph } from "@typespec/html-program-viewer/react";
 import "@typespec/html-program-viewer/style.css";
+import { isMap, parse, parseDocument, stringify } from "yaml";
 import { createRoot } from "react-dom/client";
 //#region src/react/context/playground-context.tsx
 var PlaygroundContext = createContext(void 0);
@@ -1594,88 +1594,34 @@ var config_panel_module_default = {
 	"form-content": "_form-content_cffut_23"
 };
 //#endregion
-//#region src/react/editor-panel/tspconfig-utils.ts
-/**
-* Serialize the current playground state (emitter + compiler options) to tspconfig.yaml content.
-*/
-function compilerOptionsToTspConfig(selectedEmitter, compilerOptions) {
-	const config = {};
-	if (selectedEmitter) config.emit = [selectedEmitter];
-	if (compilerOptions.options && Object.keys(compilerOptions.options).length > 0) config.options = compilerOptions.options;
-	if (compilerOptions.linterRuleSet) config.linter = compilerOptions.linterRuleSet;
-	return stringify(config, { indent: 2 }) || "";
-}
-/**
-* Parse tspconfig.yaml content back to playground state.
-* Returns undefined if the YAML is invalid.
-*/
-function parseTspConfigYaml(yamlContent) {
-	try {
-		const config = parse(yamlContent);
-		if (!config || typeof config !== "object") return { compilerOptions: {} };
-		const compilerOptions = {};
-		if (config.options) compilerOptions.options = config.options;
-		if (config.linter) compilerOptions.linterRuleSet = config.linter;
-		return {
-			selectedEmitter: config.emit?.[0],
-			compilerOptions
-		};
-	} catch {
-		return;
-	}
-}
-//#endregion
 //#region src/react/editor-panel/config-panel.tsx
-var ConfigPanel = ({ host, selectedEmitter, compilerOptions, onCompilerOptionsChange, onSelectedEmitterChange, editorOptions }) => {
+var ConfigPanel = ({ host, selectedEmitter, compilerOptions, tspconfig, onCompilerOptionsChange, onSelectedEmitterChange, onTspconfigChange, editorOptions }) => {
 	const [mode, setMode] = useState("form");
 	const yamlModel = useMonacoModel("inmemory://test/tspconfig.yaml", "yaml");
 	const changeFromYamlRef = useRef(false);
-	useEffect(() => {
-		if (mode !== "yaml") return;
-		if (changeFromYamlRef.current) {
-			changeFromYamlRef.current = false;
-			return;
-		}
-		const yaml = compilerOptionsToTspConfig(selectedEmitter, compilerOptions);
-		if (yamlModel.getValue() !== yaml) yamlModel.setValue(yaml);
-	}, [
-		selectedEmitter,
-		compilerOptions,
-		mode,
-		yamlModel
-	]);
-	const parseAndSync = useMemo(() => debounce((content) => {
-		const parsed = parseTspConfigYaml(content);
-		if (!parsed) return;
-		changeFromYamlRef.current = true;
-		if (parsed.selectedEmitter && parsed.selectedEmitter !== selectedEmitter) onSelectedEmitterChange(parsed.selectedEmitter);
-		onCompilerOptionsChange(parsed.compilerOptions);
-	}, 200), [
-		selectedEmitter,
-		onCompilerOptionsChange,
-		onSelectedEmitterChange
-	]);
+	const propagateChange = useMemo(() => debounce((content) => {
+		onTspconfigChange(content);
+	}, 200), [onTspconfigChange]);
 	useEffect(() => {
 		const disposable = yamlModel.onDidChangeContent(() => {
-			parseAndSync(yamlModel.getValue());
+			changeFromYamlRef.current = true;
+			propagateChange(yamlModel.getValue());
 		});
 		return () => {
-			parseAndSync.clear();
+			propagateChange.clear();
 			disposable.dispose();
 		};
-	}, [yamlModel, parseAndSync]);
-	const handleModeChange = useCallback((_, data) => {
-		const newMode = data.value;
-		if (newMode === "yaml") {
-			const yaml = compilerOptionsToTspConfig(selectedEmitter, compilerOptions);
-			yamlModel.setValue(yaml);
+	}, [yamlModel, propagateChange]);
+	useEffect(() => {
+		if (changeFromYamlRef.current) {
+			changeFromYamlRef.current = false;
+			return;
 		}
-		setMode(newMode);
-	}, [
-		selectedEmitter,
-		compilerOptions,
-		yamlModel
-	]);
+		if (yamlModel.getValue() !== tspconfig) yamlModel.setValue(tspconfig);
+	}, [tspconfig, yamlModel]);
+	const handleModeChange = useCallback((_, data) => {
+		setMode(data.value);
+	}, []);
 	return /* @__PURE__ */ jsxs("div", {
 		className: config_panel_module_default["config-panel"],
 		children: [/* @__PURE__ */ jsx("div", {
@@ -1733,7 +1679,7 @@ var TypeSpecIcon = () => /* @__PURE__ */ jsx("svg", {
 		transform: "matrix(4.553588, 0, 0, 3.175088, -811.313782, -249.035522)"
 	})
 });
-var EditorPanel = ({ host, model, actions, editorOptions, onMount, selectedEmitter, compilerOptions, onCompilerOptionsChange, onSelectedEmitterChange, commandBar }) => {
+var EditorPanel = ({ host, model, actions, editorOptions, onMount, selectedEmitter, compilerOptions, tspconfig, onCompilerOptionsChange, onSelectedEmitterChange, onTspconfigChange, commandBar }) => {
 	const [selectedTab, setSelectedTab] = useState("tsp");
 	const onTabSelect = useCallback((_, data) => {
 		setSelectedTab(data.value);
@@ -1772,8 +1718,10 @@ var EditorPanel = ({ host, model, actions, editorOptions, onMount, selectedEmitt
 				host,
 				selectedEmitter,
 				compilerOptions,
+				tspconfig,
 				onCompilerOptionsChange,
 				onSelectedEmitterChange,
+				onTspconfigChange,
 				editorOptions
 			})]
 		})]
@@ -1782,23 +1730,29 @@ var EditorPanel = ({ host, model, actions, editorOptions, onMount, selectedEmitt
 //#endregion
 //#region src/react/compilation/compile.ts
 var outputDir = resolveVirtualPath("tsp-output");
-async function compile(host, content, selectedEmitter, options) {
+async function compile(host, content, selectedEmitter, tspconfig) {
 	await host.writeFile("main.tsp", content);
+	await host.writeFile("tspconfig.yaml", tspconfig);
 	await emptyOutputDir(host);
 	try {
+		const typespecCompiler = host.compiler;
+		const [resolvedOptions] = await typespecCompiler.resolveCompilerOptions(host, {
+			cwd: resolveVirtualPath("."),
+			entrypoint: resolveVirtualPath("main.tsp")
+		});
+		const options = {
+			...resolvedOptions,
+			options: {
+				...resolvedOptions.options,
+				...selectedEmitter ? { [selectedEmitter]: {
+					...resolvedOptions.options?.[selectedEmitter],
+					"emitter-output-dir": outputDir
+				} } : {}
+			},
+			outputDir
+		};
 		return {
-			program: await host.compiler.compile(host, resolveVirtualPath("main.tsp"), {
-				...options,
-				options: {
-					...options.options,
-					[selectedEmitter]: {
-						...options.options?.[selectedEmitter],
-						"emitter-output-dir": outputDir
-					}
-				},
-				outputDir,
-				emit: selectedEmitter ? [selectedEmitter] : []
-			}),
+			program: await typespecCompiler.compile(host, resolveVirtualPath("main.tsp"), options),
 			outputFiles: await findOutputFiles(host)
 		};
 	} catch (error) {
@@ -1831,7 +1785,7 @@ async function emptyOutputDir(host) {
 }
 //#endregion
 //#region src/react/hooks/use-compilation.ts
-function useCompilation({ host, selectedEmitter, compilerOptions, typespecModel }) {
+function useCompilation({ host, selectedEmitter, tspconfig, typespecModel }) {
 	const [compilationState, setCompilationState] = useState(void 0);
 	const [isCompiling, setIsCompiling] = useState(false);
 	const [isOutputStale, setIsOutputStale] = useState(false);
@@ -1856,7 +1810,7 @@ function useCompilation({ host, selectedEmitter, compilerOptions, typespecModel
 		setIsCompiling(true);
 		let state;
 		try {
-			state = await compile(host, currentContent, selectedEmitter, compilerOptions);
+			state = await compile(host, currentContent, selectedEmitter, tspconfig);
 		} catch (error) {
 			console.error("Compilation failed", error);
 			isCompilingRef.current = false;
@@ -1903,7 +1857,7 @@ function useCompilation({ host, selectedEmitter, compilerOptions, typespecModel
 	}, [
 		host,
 		selectedEmitter,
-		compilerOptions,
+		tspconfig,
 		typespecModel
 	]);
 	useEffect(() => {
@@ -1941,12 +1895,13 @@ function useDebouncedCompile({ typespecModel, doCompile, debounceDelay = 200 })
 }
 //#endregion
 //#region src/react/hooks/use-editor-actions.ts
-function useEditorActions({ typespecModel, editorRef, selectedEmitter, compilerOptions, selectedSampleName, isSampleUntouched, selectedViewer, viewerState, onSave, onFileBug }) {
+function useEditorActions({ typespecModel, editorRef, selectedEmitter, compilerOptions, tspconfig, selectedSampleName, isSampleUntouched, selectedViewer, viewerState, onSave, onFileBug }) {
 	const saveCode = useCallback(() => {
 		if (onSave) onSave({
 			content: typespecModel.getValue(),
 			emitter: selectedEmitter,
 			compilerOptions,
+			tspconfig,
 			sampleName: isSampleUntouched ? selectedSampleName : void 0,
 			selectedViewer,
 			viewerState
@@ -1956,6 +1911,7 @@ function useEditorActions({ typespecModel, editorRef, selectedEmitter, compilerO
 		onSave,
 		selectedEmitter,
 		compilerOptions,
+		tspconfig,
 		selectedSampleName,
 		isSampleUntouched,
 		selectedViewer,
@@ -2612,6 +2568,62 @@ var ProblemPaneContent = ({ compilationState, onDiagnosticSelected }) => {
 	});
 };
 //#endregion
+//#region src/react/editor-panel/tspconfig-utils.ts
+function hasLinterRules(linterRuleSet) {
+	if (!linterRuleSet) return false;
+	return Boolean(linterRuleSet.extends && linterRuleSet.extends.length > 0 || linterRuleSet.enable && Object.keys(linterRuleSet.enable).length > 0 || linterRuleSet.disable && Object.keys(linterRuleSet.disable).length > 0);
+}
+/**
+* Serialize the current playground state (emitter + compiler options) to tspconfig.yaml content.
+*/
+function compilerOptionsToTspConfig(selectedEmitter, compilerOptions) {
+	const config = {};
+	if (selectedEmitter) config.emit = [selectedEmitter];
+	if (compilerOptions.options && Object.keys(compilerOptions.options).length > 0) config.options = compilerOptions.options;
+	if (hasLinterRules(compilerOptions.linterRuleSet)) config.linter = compilerOptions.linterRuleSet;
+	return stringify(config, { indent: 2 }) || "";
+}
+/**
+* Update an existing tspconfig.yaml with structured changes coming from the visual form
+* (emitter + compiler options) while preserving comments and any other fields the form
+* doesn't manage (e.g. `output-dir`, `warn-as-error`, `imports`).
+*/
+function updateTspConfigYaml(existingYaml, selectedEmitter, compilerOptions) {
+	let doc;
+	try {
+		doc = parseDocument(existingYaml ?? "");
+	} catch {
+		return compilerOptionsToTspConfig(selectedEmitter, compilerOptions);
+	}
+	if (doc.errors.length > 0 || !isMap(doc.contents)) return compilerOptionsToTspConfig(selectedEmitter, compilerOptions);
+	if (selectedEmitter) doc.setIn(["emit"], [selectedEmitter]);
+	else doc.deleteIn(["emit"]);
+	if (compilerOptions.options && Object.keys(compilerOptions.options).length > 0) doc.setIn(["options"], compilerOptions.options);
+	else doc.deleteIn(["options"]);
+	if (hasLinterRules(compilerOptions.linterRuleSet)) doc.setIn(["linter"], compilerOptions.linterRuleSet);
+	else doc.deleteIn(["linter"]);
+	return doc.toString();
+}
+/**
+* Parse tspconfig.yaml content back to playground state.
+* Returns undefined if the YAML is invalid.
+*/
+function parseTspConfigYaml(yamlContent) {
+	try {
+		const config = parse(yamlContent);
+		if (!config || typeof config !== "object") return { compilerOptions: {} };
+		const compilerOptions = {};
+		if (config.options) compilerOptions.options = config.options;
+		if (config.linter) compilerOptions.linterRuleSet = config.linter;
+		return {
+			selectedEmitter: config.emit?.[0],
+			compilerOptions
+		};
+	} catch {
+		return;
+	}
+}
+//#endregion
 //#region src/react/use-playground-state.ts
 function usePlaygroundState({ libraries, samples, playgroundState: controlledPlaygroundState, defaultPlaygroundState, onPlaygroundStateChange, defaultEmitter, defaultContent }) {
 	const [playgroundState, setPlaygroundState] = useControllableValue(controlledPlaygroundState, useMemo(() => {
@@ -2633,8 +2645,14 @@ function usePlaygroundState({ libraries, samples, playgroundState: controlledPla
 		libraries,
 		defaultContent
 	]), onPlaygroundStateChange);
-	const selectedEmitter = playgroundState.emitter;
-	const compilerOptions = useMemo(() => playgroundState.compilerOptions ?? {}, [playgroundState.compilerOptions]);
+	const tspconfig = useMemo(() => playgroundState.tspconfig ?? compilerOptionsToTspConfig(playgroundState.emitter ?? "", playgroundState.compilerOptions ?? {}), [
+		playgroundState.tspconfig,
+		playgroundState.emitter,
+		playgroundState.compilerOptions
+	]);
+	const parsedConfig = useMemo(() => parseTspConfigYaml(tspconfig) ?? { compilerOptions: {} }, [tspconfig]);
+	const selectedEmitter = parsedConfig.selectedEmitter ?? "";
+	const compilerOptions = parsedConfig.compilerOptions;
 	const selectedSampleName = playgroundState.sampleName ?? "";
 	const selectedViewer = playgroundState.selectedViewer;
 	const content = playgroundState.content ?? "";
@@ -2644,8 +2662,17 @@ function usePlaygroundState({ libraries, samples, playgroundState: controlledPla
 			...updates
 		});
 	}, [playgroundState, setPlaygroundState]);
-	const onSelectedEmitterChange = useCallback((emitter) => updateState({ emitter }), [updateState]);
-	const onCompilerOptionsChange = useCallback((compilerOptions) => updateState({ compilerOptions }), [updateState]);
+	const onTspconfigChange = useCallback((tspconfig) => updateState({ tspconfig }), [updateState]);
+	const onSelectedEmitterChange = useCallback((emitter) => updateState({ tspconfig: updateTspConfigYaml(tspconfig, emitter, compilerOptions) }), [
+		updateState,
+		tspconfig,
+		compilerOptions
+	]);
+	const onCompilerOptionsChange = useCallback((newOptions) => updateState({ tspconfig: updateTspConfigYaml(tspconfig, selectedEmitter, newOptions) }), [
+		updateState,
+		tspconfig,
+		selectedEmitter
+	]);
 	const onSelectedSampleNameChange = useCallback((sampleName) => updateState({ sampleName }), [updateState]);
 	const onSelectedViewerChange = useCallback((selectedViewer) => updateState({ selectedViewer }), [updateState]);
 	const onViewerStateChange = useCallback((viewerState) => updateState({ viewerState }), [updateState]);
@@ -2657,8 +2684,7 @@ function usePlaygroundState({ libraries, samples, playgroundState: controlledPla
 			if (config?.content) {
 				lastProcessedSample.current = selectedSampleName;
 				const updates = { content: config.content };
-				if (config.preferredEmitter) updates.emitter = config.preferredEmitter;
-				if (config.compilerOptions) updates.compilerOptions = config.compilerOptions;
+				if (config.preferredEmitter || config.compilerOptions) updates.tspconfig = compilerOptionsToTspConfig(config.preferredEmitter ?? "", config.compilerOptions ?? {});
 				updateState(updates);
 			}
 		}
@@ -2670,12 +2696,14 @@ function usePlaygroundState({ libraries, samples, playgroundState: controlledPla
 	return {
 		selectedEmitter,
 		compilerOptions,
+		tspconfig,
 		selectedSampleName,
 		selectedViewer,
 		viewerState: playgroundState.viewerState ?? {},
 		content,
 		onSelectedEmitterChange,
 		onCompilerOptionsChange,
+		onTspconfigChange,
 		onSelectedSampleNameChange,
 		onSelectedViewerChange,
 		onViewerStateChange,
@@ -2785,7 +2813,7 @@ var Playground = (props) => {
 		debugGlobals().host = host;
 	}, [host]);
 	const typespecModel = useMonacoModel("inmemory://test/main.tsp", "typespec");
-	const { selectedEmitter, compilerOptions, selectedSampleName, selectedViewer, viewerState, content, onSelectedEmitterChange, onCompilerOptionsChange, onSelectedSampleNameChange, onSelectedViewerChange, onViewerStateChange, onContentChange } = usePlaygroundState({
+	const { selectedEmitter, compilerOptions, tspconfig, selectedSampleName, selectedViewer, viewerState, content, onSelectedEmitterChange, onCompilerOptionsChange, onTspconfigChange, onSelectedSampleNameChange, onSelectedViewerChange, onViewerStateChange, onContentChange } = usePlaygroundState({
 		libraries: props.libraries,
 		samples: props.samples,
 		playgroundState: props.playgroundState,
@@ -2802,7 +2830,7 @@ var Playground = (props) => {
 	const { compilationState, isCompiling, isOutputStale, doCompile } = useCompilation({
 		host,
 		selectedEmitter,
-		compilerOptions,
+		tspconfig,
 		typespecModel
 	});
 	useDebouncedCompile({
@@ -2815,6 +2843,7 @@ var Playground = (props) => {
 		editorRef,
 		selectedEmitter,
 		compilerOptions,
+		tspconfig,
 		selectedSampleName,
 		isSampleUntouched: useMemo(() => {
 			return Boolean(selectedSampleName && content === props.samples?.[selectedSampleName]?.content);
@@ -2882,8 +2911,10 @@ var Playground = (props) => {
 		onMount: onTypeSpecEditorMount,
 		selectedEmitter,
 		compilerOptions,
+		tspconfig,
 		onCompilerOptionsChange,
 		onSelectedEmitterChange,
+		onTspconfigChange,
 		commandBar: isMobile ? void 0 : commandBar
 	});
 	const outputPanel = /* @__PURE__ */ jsx(OutputView, {
@@ -2981,8 +3012,8 @@ var StandalonePlayground = (config) => {
 	const onPlaygroundStateChange = useCallback((newState) => {
 		saveToStorage({
 			content: lastSavedData?.content || "",
-			emitter: newState.emitter || "",
-			compilerOptions: newState.compilerOptions,
+			emitter: "",
+			tspconfig: newState.tspconfig,
 			sampleName: newState.sampleName,
 			selectedViewer: newState.selectedViewer,
 			viewerState: newState.viewerState
@@ -2995,6 +3026,7 @@ var StandalonePlayground = (config) => {
 		defaultPlaygroundState: {
 			emitter: context.initialState.emitter ?? config.defaultPlaygroundState?.emitter,
 			compilerOptions: context.initialState.compilerOptions ?? config.defaultPlaygroundState?.compilerOptions,
+			tspconfig: context.initialState.tspconfig ?? config.defaultPlaygroundState?.tspconfig,
 			sampleName: context.initialState.sampleName ?? config.defaultPlaygroundState?.sampleName,
 			selectedViewer: context.initialState.selectedViewer ?? config.defaultPlaygroundState?.selectedViewer,
 			viewerState: context.initialState.viewerState ?? config.defaultPlaygroundState?.viewerState
@@ -3035,6 +3067,10 @@ function createStandalonePlaygroundStateStorage() {
 			type: "object",
 			queryParam: "options"
 		},
+		tspconfig: {
+			queryParam: "tspconfig",
+			compress: "lz-base64"
+		},
 		sampleName: { queryParam: "sample" },
 		selectedViewer: { queryParam: "v" },
 		viewerState: {
@@ -3046,11 +3082,16 @@ function createStandalonePlaygroundStateStorage() {
 		load: stateStorage.load,
 		resolveSearchParams: stateStorage.resolveSearchParams,
 		save(data) {
-			stateStorage.save(data.sampleName ? {
+			const cleaned = {
 				...data,
+				emitter: void 0,
+				compilerOptions: void 0
+			};
+			stateStorage.save(cleaned.sampleName ? {
+				...cleaned,
 				content: void 0,
-				sampleName: data.sampleName
-			} : data);
+				sampleName: cleaned.sampleName
+			} : cleaned);
 		}
 	};
 }

package/dist/{services-okAeHMZK.js → services-D_Na2-tW.js}

@@ -386,6 +386,10 @@ async function registerMonacoLanguage(host) {
 		extensions: [".tsp"]
 	});
 	monaco.languages.setLanguageConfiguration("typespec", getTypeSpecLanguageConfiguration());
+	monaco.languages.register({
+		id: "yaml",
+		extensions: [".yaml", ".yml"]
+	});
 	if (window.registeredServices) return;
 	window.registeredServices = true;
 	const serverHost = {
@@ -597,6 +601,48 @@ async function registerMonacoLanguage(host) {
 			return { suggestions };
 		}
 	});
+	monaco.languages.registerCompletionItemProvider({
+		language: "yaml",
+		pattern: "**/tspconfig.yaml"
+	}, {
+		triggerCharacters: [
+			":",
+			" ",
+			"/",
+			"-",
+			".",
+			"\""
+		],
+		async provideCompletionItems(model, position) {
+			const result = await serverLib.complete(lspArgs(model, position));
+			const word = model.getWordUntilPosition(position);
+			const range = {
+				startLineNumber: position.lineNumber,
+				endLineNumber: position.lineNumber,
+				startColumn: word.startColumn,
+				endColumn: word.endColumn
+			};
+			const suggestions = [];
+			for (const item of result.items) {
+				let itemRange = range;
+				let insertText = item.insertText ?? item.label;
+				if (item.textEdit && "range" in item.textEdit) {
+					itemRange = LspToMonaco.range(item.textEdit.range);
+					insertText = item.textEdit.newText;
+				}
+				suggestions.push({
+					label: item.label,
+					kind: item.kind,
+					documentation: item.documentation,
+					insertText,
+					range: itemRange,
+					commitCharacters: item.commitCharacters,
+					tags: item.tags
+				});
+			}
+			return { suggestions };
+		}
+	});
 	monaco.languages.registerCodeActionProvider("typespec", { async provideCodeActions(model, range) {
 		const compiler = _currentCompiler;
 		if (!compiler) return {

package/dist/src/react/compilation/compile.d.ts

@@ -1,5 +1,4 @@
-import { CompilerOptions } from '@typespec/compiler';
 import { BrowserHost } from '../../types.js';
 import { CompilationState } from '../types.js';
-export declare function compile(host: BrowserHost, content: string, selectedEmitter: string, options: CompilerOptions): Promise<CompilationState>;
+export declare function compile(host: BrowserHost, content: string, selectedEmitter: string, tspconfig: string): Promise<CompilationState>;
 //# sourceMappingURL=compile.d.ts.map

package/dist/src/react/compilation/compile.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"compile.d.ts","sourceRoot":"","sources":["../../../../src/react/compilation/compile.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAG1D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAIpD,wBAAsB,OAAO,CAC3B,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,MAAM,EACf,eAAe,EAAE,MAAM,EACvB,OAAO,EAAE,eAAe,GACvB,OAAO,CAAC,gBAAgB,CAAC,CAwB3B"}
+{"version":3,"file":"compile.d.ts","sourceRoot":"","sources":["../../../../src/react/compilation/compile.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAIpD,wBAAsB,OAAO,CAC3B,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,MAAM,EACf,eAAe,EAAE,MAAM,EACvB,SAAS,EAAE,MAAM,GAChB,OAAO,CAAC,gBAAgB,CAAC,CAsC3B"}

package/dist/src/react/editor-panel/config-panel.d.ts

@@ -6,8 +6,11 @@ export interface ConfigPanelProps {
     host: BrowserHost;
     selectedEmitter: string;
     compilerOptions: CompilerOptions;
+    /** Raw tspconfig.yaml content (source of truth). */
+    tspconfig: string;
     onCompilerOptionsChange: (options: CompilerOptions) => void;
     onSelectedEmitterChange: (emitter: string) => void;
+    onTspconfigChange: (tspconfig: string) => void;
     editorOptions?: PlaygroundEditorsOptions;
 }
 export declare const ConfigPanel: FunctionComponent<ConfigPanelProps>;

package/dist/src/react/editor-panel/config-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"config-panel.d.ts","sourceRoot":"","sources":["../../../../src/react/editor-panel/config-panel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,OAAO,EAAqD,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAClG,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAKjE,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,WAAW,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,eAAe,CAAC;IACjC,uBAAuB,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IAC5D,uBAAuB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,aAAa,CAAC,EAAE,wBAAwB,CAAC;CAC1C;AAID,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,CA8F3D,CAAC"}
+{"version":3,"file":"config-panel.d.ts","sourceRoot":"","sources":["../../../../src/react/editor-panel/config-panel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,OAAO,EAAqD,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAClG,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAIjE,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,WAAW,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,eAAe,CAAC;IACjC,oDAAoD;IACpD,SAAS,EAAE,MAAM,CAAC;IAClB,uBAAuB,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IAC5D,uBAAuB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,iBAAiB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,aAAa,CAAC,EAAE,wBAAwB,CAAC;CAC1C;AAID,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,CAgF3D,CAAC"}

package/dist/src/react/editor-panel/editor-panel.d.ts

@@ -13,8 +13,10 @@ export interface EditorPanelProps {
     onMount?: (data: OnMountData) => void;
     selectedEmitter: string;
     compilerOptions: CompilerOptions;
+    tspconfig: string;
     onCompilerOptionsChange: (options: CompilerOptions) => void;
     onSelectedEmitterChange: (emitter: string) => void;
+    onTspconfigChange: (tspconfig: string) => void;
     /** Toolbar content rendered above the editor area */
     commandBar?: ReactNode;
 }

package/dist/src/react/editor-panel/editor-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"editor-panel.d.ts","sourceRoot":"","sources":["../../../../src/react/editor-panel/editor-panel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAyB,KAAK,iBAAiB,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACtF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAChD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAKjE,MAAM,MAAM,cAAc,GAAG,KAAK,GAAG,KAAK,CAAC;AAkB3C,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,WAAW,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC,iBAAiB,EAAE,CAAC;IACrC,aAAa,CAAC,EAAE,wBAAwB,CAAC;IACzC,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IAEtC,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,eAAe,CAAC;IACjC,uBAAuB,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IAC5D,uBAAuB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAEnD,qDAAqD;IACrD,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,CAwD3D,CAAC"}
+{"version":3,"file":"editor-panel.d.ts","sourceRoot":"","sources":["../../../../src/react/editor-panel/editor-panel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAyB,KAAK,iBAAiB,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACtF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAChD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAKjE,MAAM,MAAM,cAAc,GAAG,KAAK,GAAG,KAAK,CAAC;AAkB3C,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,WAAW,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC,iBAAiB,EAAE,CAAC;IACrC,aAAa,CAAC,EAAE,wBAAwB,CAAC;IACzC,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IAEtC,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,eAAe,CAAC;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,uBAAuB,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,IAAI,CAAC;IAC5D,uBAAuB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,iBAAiB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAE/C,qDAAqD;IACrD,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,CA4D3D,CAAC"}

package/dist/src/react/editor-panel/tspconfig-utils.d.ts

@@ -12,6 +12,12 @@ export interface TspConfig {
  * Serialize the current playground state (emitter + compiler options) to tspconfig.yaml content.
  */
 export declare function compilerOptionsToTspConfig(selectedEmitter: string, compilerOptions: CompilerOptions): string;
+/**
+ * Update an existing tspconfig.yaml with structured changes coming from the visual form
+ * (emitter + compiler options) while preserving comments and any other fields the form
+ * doesn't manage (e.g. `output-dir`, `warn-as-error`, `imports`).
+ */
+export declare function updateTspConfigYaml(existingYaml: string, selectedEmitter: string, compilerOptions: CompilerOptions): string;
 export interface ParsedTspConfig {
     selectedEmitter?: string;
     compilerOptions: CompilerOptions;

package/dist/src/react/editor-panel/tspconfig-utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tspconfig-utils.d.ts","sourceRoot":"","sources":["../../../../src/react/editor-panel/tspconfig-utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGzE,MAAM,WAAW,SAAS;IACxB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAClD,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,wBAAgB,0BAA0B,CACxC,eAAe,EAAE,MAAM,EACvB,eAAe,EAAE,eAAe,GAC/B,MAAM,CAgBR;AAED,MAAM,WAAW,eAAe;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,EAAE,eAAe,CAAC;CAClC;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,WAAW,EAAE,MAAM,GAAG,eAAe,GAAG,SAAS,CAuBnF"}
+{"version":3,"file":"tspconfig-utils.d.ts","sourceRoot":"","sources":["../../../../src/react/editor-panel/tspconfig-utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGzE,MAAM,WAAW,SAAS;IACxB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAClD,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAWD;;GAEG;AACH,wBAAgB,0BAA0B,CACxC,eAAe,EAAE,MAAM,EACvB,eAAe,EAAE,eAAe,GAC/B,MAAM,CAgBR;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CACjC,YAAY,EAAE,MAAM,EACpB,eAAe,EAAE,MAAM,EACvB,eAAe,EAAE,eAAe,GAC/B,MAAM,CAgCR;AAED,MAAM,WAAW,eAAe;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,EAAE,eAAe,CAAC;CAClC;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,WAAW,EAAE,MAAM,GAAG,eAAe,GAAG,SAAS,CAuBnF"}

package/dist/src/react/hooks/use-compilation.d.ts

@@ -1,11 +1,11 @@
-import { CompilerOptions } from '@typespec/compiler';
 import { editor } from 'monaco-editor';
 import { BrowserHost } from '../../types.js';
 import { CompilationState } from '../types.js';
 export interface UseCompilationOptions {
     host: BrowserHost;
     selectedEmitter: string;
-    compilerOptions: CompilerOptions;
+    /** Raw tspconfig.yaml content used to configure the compilation. */
+    tspconfig: string;
     typespecModel: editor.ITextModel;
 }
 export interface UseCompilationResult {
@@ -14,5 +14,5 @@ export interface UseCompilationResult {
     isOutputStale: boolean;
     doCompile: () => Promise<void>;
 }
-export declare function useCompilation({ host, selectedEmitter, compilerOptions, typespecModel, }: UseCompilationOptions): UseCompilationResult;
+export declare function useCompilation({ host, selectedEmitter, tspconfig, typespecModel, }: UseCompilationOptions): UseCompilationResult;
 //# sourceMappingURL=use-compilation.d.ts.map

package/dist/src/react/hooks/use-compilation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-compilation.d.ts","sourceRoot":"","sources":["../../../../src/react/hooks/use-compilation.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,OAAO,EAA6B,MAAM,EAAE,MAAM,eAAe,CAAC;AAGlE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGlD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAEpD,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,WAAW,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,eAAe,CAAC;IACjC,aAAa,EAAE,MAAM,CAAC,UAAU,CAAC;CAClC;AAED,MAAM,WAAW,oBAAoB;IACnC,gBAAgB,EAAE,gBAAgB,GAAG,SAAS,CAAC;IAC/C,WAAW,EAAE,OAAO,CAAC;IACrB,aAAa,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAChC;AAED,wBAAgB,cAAc,CAAC,EAC7B,IAAI,EACJ,eAAe,EACf,eAAe,EACf,aAAa,GACd,EAAE,qBAAqB,GAAG,oBAAoB,CA0G9C"}
+{"version":3,"file":"use-compilation.d.ts","sourceRoot":"","sources":["../../../../src/react/hooks/use-compilation.ts"],"names":[],"mappings":"AACA,OAAO,EAA6B,MAAM,EAAE,MAAM,eAAe,CAAC;AAGlE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGlD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAEpD,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,WAAW,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,oEAAoE;IACpE,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,MAAM,CAAC,UAAU,CAAC;CAClC;AAED,MAAM,WAAW,oBAAoB;IACnC,gBAAgB,EAAE,gBAAgB,GAAG,SAAS,CAAC;IAC/C,WAAW,EAAE,OAAO,CAAC;IACrB,aAAa,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAChC;AAED,wBAAgB,cAAc,CAAC,EAC7B,IAAI,EACJ,eAAe,EACf,SAAS,EACT,aAAa,GACd,EAAE,qBAAqB,GAAG,oBAAoB,CA0G9C"}

package/dist/src/react/hooks/use-editor-actions.d.ts

@@ -13,6 +13,7 @@ export interface UseEditorActionsOptions {
     editorRef: RefObject<editor.IStandaloneCodeEditor | undefined>;
     selectedEmitter: string;
     compilerOptions: CompilerOptions;
+    tspconfig: string;
     selectedSampleName: string;
     isSampleUntouched: boolean;
     selectedViewer?: string;
@@ -26,5 +27,5 @@ export interface UseEditorActionsResult {
     fileBug: () => Promise<void>;
     editorActions: editor.IActionDescriptor[];
 }
-export declare function useEditorActions({ typespecModel, editorRef, selectedEmitter, compilerOptions, selectedSampleName, isSampleUntouched, selectedViewer, viewerState, onSave, onFileBug, }: UseEditorActionsOptions): UseEditorActionsResult;
+export declare function useEditorActions({ typespecModel, editorRef, selectedEmitter, compilerOptions, tspconfig, selectedSampleName, isSampleUntouched, selectedViewer, viewerState, onSave, onFileBug, }: UseEditorActionsOptions): UseEditorActionsResult;
 //# sourceMappingURL=use-editor-actions.d.ts.map

package/dist/src/react/hooks/use-editor-actions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-editor-actions.d.ts","sourceRoot":"","sources":["../../../../src/react/hooks/use-editor-actions.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAmB,MAAM,EAAE,MAAM,eAAe,CAAC;AACxD,OAAO,EAAwB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAElE,MAAM,WAAW,kBAAmB,SAAQ,eAAe;IACzD,yCAAyC;IACzC,OAAO,EAAE,MAAM,CAAC;IAChB,oBAAoB;IACpB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,uBAAuB;IACtC,aAAa,EAAE,MAAM,CAAC,UAAU,CAAC;IACjC,SAAS,EAAE,SAAS,CAAC,MAAM,CAAC,qBAAqB,GAAG,SAAS,CAAC,CAAC;IAC/D,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,eAAe,CAAC;IACjC,kBAAkB,EAAE,MAAM,CAAC;IAC3B,iBAAiB,EAAE,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACjC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7B,aAAa,EAAE,MAAM,CAAC,iBAAiB,EAAE,CAAC;CAC3C;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,aAAa,EACb,SAAS,EACT,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,cAAc,EACd,WAAW,EACX,MAAM,EACN,SAAS,GACV,EAAE,uBAAuB,GAAG,sBAAsB,CA2ClD"}
+{"version":3,"file":"use-editor-actions.d.ts","sourceRoot":"","sources":["../../../../src/react/hooks/use-editor-actions.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAmB,MAAM,EAAE,MAAM,eAAe,CAAC;AACxD,OAAO,EAAwB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAElE,MAAM,WAAW,kBAAmB,SAAQ,eAAe;IACzD,yCAAyC;IACzC,OAAO,EAAE,MAAM,CAAC;IAChB,oBAAoB;IACpB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,uBAAuB;IACtC,aAAa,EAAE,MAAM,CAAC,UAAU,CAAC;IACjC,SAAS,EAAE,SAAS,CAAC,MAAM,CAAC,qBAAqB,GAAG,SAAS,CAAC,CAAC;IAC/D,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,eAAe,CAAC;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,iBAAiB,EAAE,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACjC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7B,aAAa,EAAE,MAAM,CAAC,iBAAiB,EAAE,CAAC;CAC3C;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,aAAa,EACb,SAAS,EACT,eAAe,EACf,eAAe,EACf,SAAS,EACT,kBAAkB,EAClB,iBAAiB,EACjB,cAAc,EACd,WAAW,EACX,MAAM,EACN,SAAS,GACV,EAAE,uBAAuB,GAAG,sBAAsB,CA6ClD"}

package/dist/src/react/playground.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"playground.d.ts","sourceRoot":"","sources":["../../../src/react/playground.tsx"],"names":[],"mappings":"AAEA,OAAO,sCAAsC,CAAC;AAE9C,OAAO,EAML,KAAK,iBAAiB,EACtB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAMjE,OAAO,EAKL,KAAK,kBAAkB,EACxB,MAAM,kBAAkB,CAAC;AAI1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAElE,OAAO,EAAsB,KAAK,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAIrF,YAAY,EAAE,eAAe,EAAE,CAAC;AAEhC,MAAM,WAAW,wBAAwB;IACvC,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,WAAW,CAAC;IAElB,iDAAiD;IACjD,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,kCAAkC;IAClC,QAAQ,CAAC,SAAS,EAAE,SAAS,MAAM,EAAE,CAAC;IAEtC,wBAAwB;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAE3C,oCAAoC;IACpC,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,yDAAyD;IACzD,sBAAsB,CAAC,EAAE,eAAe,CAAC;IACzC,6CAA6C;IAC7C,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAE3D;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IAEvB,mDAAmD;IACnD,eAAe,CAAC,EAAE,cAAc,EAAE,CAAC;IAEnC,kDAAkD;IAClD,OAAO,CAAC,EAAE,aAAa,EAAE,CAAC;IAE1B,4FAA4F;IAC5F,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,EAAE,CAAC,CAAC;IAEpD;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,wBAAwB,CAAC,CAAC;IAE1D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAE7C,aAAa,CAAC,EAAE,wBAAwB,CAAC;IAEzC;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,MAAM,WAAW,wBAAwB;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAGD,YAAY,EAAE,kBAAkB,EAAE,CAAC;AAEnC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,eAAO,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,CAiNzD,CAAC"}
+{"version":3,"file":"playground.d.ts","sourceRoot":"","sources":["../../../src/react/playground.tsx"],"names":[],"mappings":"AAEA,OAAO,sCAAsC,CAAC;AAE9C,OAAO,EAML,KAAK,iBAAiB,EACtB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAMjE,OAAO,EAKL,KAAK,kBAAkB,EACxB,MAAM,kBAAkB,CAAC;AAI1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAElE,OAAO,EAAsB,KAAK,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAIrF,YAAY,EAAE,eAAe,EAAE,CAAC;AAEhC,MAAM,WAAW,wBAAwB;IACvC,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,WAAW,CAAC;IAElB,iDAAiD;IACjD,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,kCAAkC;IAClC,QAAQ,CAAC,SAAS,EAAE,SAAS,MAAM,EAAE,CAAC;IAEtC,wBAAwB;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAE3C,oCAAoC;IACpC,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,yDAAyD;IACzD,sBAAsB,CAAC,EAAE,eAAe,CAAC;IACzC,6CAA6C;IAC7C,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAE3D;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IAEvB,mDAAmD;IACnD,eAAe,CAAC,EAAE,cAAc,EAAE,CAAC;IAEnC,kDAAkD;IAClD,OAAO,CAAC,EAAE,aAAa,EAAE,CAAC;IAE1B,4FAA4F;IAC5F,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,EAAE,CAAC,CAAC;IAEpD;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,wBAAwB,CAAC,CAAC;IAE1D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAE7C,aAAa,CAAC,EAAE,wBAAwB,CAAC;IAEzC;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,MAAM,WAAW,wBAAwB;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAGD,YAAY,EAAE,kBAAkB,EAAE,CAAC;AAEnC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,eAAO,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,CAsNzD,CAAC"}

package/dist/src/react/standalone.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"standalone.d.ts","sourceRoot":"","sources":["../../../src/react/standalone.tsx"],"names":[],"mappings":"AASA,OAAO,EAML,KAAK,iBAAiB,EACtB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAEvD,OAAO,EAGL,KAAK,eAAe,EACrB,MAAM,qBAAqB,CAAC;AAE7B,OAAO,EAEL,KAAK,eAAe,EACpB,KAAK,kBAAkB,EAExB,MAAM,iBAAiB,CAAC;AAEzB,MAAM,WAAW,qBAAsB,SAAQ,OAAO,CAAC,eAAe,CAAC;IACrE,QAAQ,CAAC,SAAS,EAAE,SAAS,MAAM,EAAE,CAAC;IACtC,QAAQ,CAAC,YAAY,CAAC,EAAE,oBAAoB,CAAC;IAC7C,sEAAsE;IACtE,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;CAC/B;AAyBD,eAAO,MAAM,oBAAoB,EAAE,iBAAiB,CAAC,qBAAqB,CAuFzE,CAAC;AAEF,wBAAsB,qBAAqB,CAAC,MAAM,EAAE,qBAAqB,wCAExE;AAED,wBAAsB,qBAAqB,CAAC,MAAM,EAAE,qBAAqB,iBASxE;AAED,wBAAgB,sCAAsC,IAAI,eAAe,CAAC,kBAAkB,CAAC,CAkC5F"}
+{"version":3,"file":"standalone.d.ts","sourceRoot":"","sources":["../../../src/react/standalone.tsx"],"names":[],"mappings":"AASA,OAAO,EAML,KAAK,iBAAiB,EACtB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAEvD,OAAO,EAGL,KAAK,eAAe,EACrB,MAAM,qBAAqB,CAAC;AAE7B,OAAO,EAEL,KAAK,eAAe,EACpB,KAAK,kBAAkB,EAExB,MAAM,iBAAiB,CAAC;AAEzB,MAAM,WAAW,qBAAsB,SAAQ,OAAO,CAAC,eAAe,CAAC;IACrE,QAAQ,CAAC,SAAS,EAAE,SAAS,MAAM,EAAE,CAAC;IACtC,QAAQ,CAAC,YAAY,CAAC,EAAE,oBAAoB,CAAC;IAC7C,sEAAsE;IACtE,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;CAC/B;AAyBD,eAAO,MAAM,oBAAoB,EAAE,iBAAiB,CAAC,qBAAqB,CA0FzE,CAAC;AAEF,wBAAsB,qBAAqB,CAAC,MAAM,EAAE,qBAAqB,wCAExE;AAED,wBAAsB,qBAAqB,CAAC,MAAM,EAAE,qBAAqB,iBASxE;AAED,wBAAgB,sCAAsC,IAAI,eAAe,CAAC,kBAAkB,CAAC,CAkD5F"}

package/dist/src/react/use-playground-state.d.ts

@@ -5,6 +5,8 @@ export interface PlaygroundState {
     emitter?: string;
     /** Emitter options */
     compilerOptions?: CompilerOptions;
+    /** Raw tspconfig.yaml content. Source of truth for the compiler configuration. */
+    tspconfig?: string;
     /** Sample to use */
     sampleName?: string;
     /** Selected viewer */
@@ -36,12 +38,15 @@ export interface UsePlaygroundStateProps {
 export interface PlaygroundStateResult {
     selectedEmitter: string;
     compilerOptions: CompilerOptions;
+    /** Raw tspconfig.yaml content (source of truth for the configuration). */
+    tspconfig: string;
     selectedSampleName: string;
     selectedViewer?: string;
     viewerState: Record<string, any>;
     content: string;
     onSelectedEmitterChange: (emitter: string) => void;
     onCompilerOptionsChange: (compilerOptions: CompilerOptions) => void;
+    onTspconfigChange: (tspconfig: string) => void;
     onSelectedSampleNameChange: (sampleName: string) => void;
     onSelectedViewerChange: (selectedViewer: string) => void;
     onViewerStateChange: (viewerState: Record<string, any>) => void;

package/dist/src/react/use-playground-state.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-playground-state.d.ts","sourceRoot":"","sources":["../../../src/react/use-playground-state.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAG1D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAEpD,MAAM,WAAW,eAAe;IAC9B,qBAAqB;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,sBAAsB;IACtB,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,oBAAoB;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sBAAsB;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gCAAgC;IAChC,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAClC,uBAAuB;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,uBAAuB;IACtC,kCAAkC;IAClC,QAAQ,CAAC,SAAS,EAAE,SAAS,MAAM,EAAE,CAAC;IAEtC,wBAAwB;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAE3C,oCAAoC;IACpC,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,yDAAyD;IACzD,sBAAsB,CAAC,EAAE,eAAe,CAAC;IACzC,6CAA6C;IAC7C,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAE3D;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,gEAAgE;IAChE,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,qBAAqB;IAEpC,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,eAAe,CAAC;IACjC,kBAAkB,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACjC,OAAO,EAAE,MAAM,CAAC;IAGhB,uBAAuB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,uBAAuB,EAAE,CAAC,eAAe,EAAE,eAAe,KAAK,IAAI,CAAC;IACpE,0BAA0B,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,sBAAsB,EAAE,CAAC,cAAc,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,mBAAmB,EAAE,CAAC,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IAChE,eAAe,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAG3C,eAAe,EAAE,eAAe,CAAC;IACjC,kBAAkB,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;CACtD;AAED,wBAAgB,kBAAkB,CAAC,EACjC,SAAS,EACT,OAAO,EACP,eAAe,EAAE,yBAAyB,EAC1C,sBAAsB,EACtB,uBAAuB,EAEvB,cAAc,EACd,cAAc,GACf,EAAE,uBAAuB,GAAG,qBAAqB,CA0GjD"}
+{"version":3,"file":"use-playground-state.d.ts","sourceRoot":"","sources":["../../../src/react/use-playground-state.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAG1D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAOpD,MAAM,WAAW,eAAe;IAC9B,qBAAqB;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,sBAAsB;IACtB,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,kFAAkF;IAClF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oBAAoB;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sBAAsB;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gCAAgC;IAChC,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAClC,uBAAuB;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,uBAAuB;IACtC,kCAAkC;IAClC,QAAQ,CAAC,SAAS,EAAE,SAAS,MAAM,EAAE,CAAC;IAEtC,wBAAwB;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAE3C,oCAAoC;IACpC,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,yDAAyD;IACzD,sBAAsB,CAAC,EAAE,eAAe,CAAC;IACzC,6CAA6C;IAC7C,uBAAuB,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IAE3D;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,gEAAgE;IAChE,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,qBAAqB;IAEpC,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,eAAe,CAAC;IACjC,0EAA0E;IAC1E,SAAS,EAAE,MAAM,CAAC;IAClB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACjC,OAAO,EAAE,MAAM,CAAC;IAGhB,uBAAuB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,uBAAuB,EAAE,CAAC,eAAe,EAAE,eAAe,KAAK,IAAI,CAAC;IACpE,iBAAiB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,0BAA0B,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,sBAAsB,EAAE,CAAC,cAAc,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,mBAAmB,EAAE,CAAC,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IAChE,eAAe,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAG3C,eAAe,EAAE,eAAe,CAAC;IACjC,kBAAkB,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;CACtD;AAED,wBAAgB,kBAAkB,CAAC,EACjC,SAAS,EACT,OAAO,EACP,eAAe,EAAE,yBAAyB,EAC1C,sBAAsB,EACtB,uBAAuB,EAEvB,cAAc,EACd,cAAc,GACf,EAAE,uBAAuB,GAAG,qBAAqB,CAsIjD"}

package/dist/src/services.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"services.d.ts","sourceRoot":"","sources":["../../src/services.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,UAAU,EACf,KAAK,gBAAgB,EACrB,KAAK,QAAQ,EAEd,MAAM,oBAAoB,CAAC;AAC5B,OAAO,KAAK,MAAM,MAAM,eAAe,CAAC;AAMxC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAO9C;;;;GAIG;AACH,wBAAgB,6BAA6B,CAC3C,QAAQ,EAAE,cAAc,oBAAoB,CAAC,EAC7C,WAAW,EAAE,SAAS,UAAU,EAAE,QAInC;AAmCD,wBAAsB,sBAAsB,CAAC,IAAI,EAAE,WAAW,iBAgZ7D;AAED,wBAAgB,cAAc,CAC5B,gBAAgB,EAAE,cAAc,oBAAoB,CAAC,EACrD,MAAM,EAAE,gBAAgB,GAAG,OAAO,QAAQ,GACzC,MAAM,CAAC,MAAM,CAkBf"}
+{"version":3,"file":"services.d.ts","sourceRoot":"","sources":["../../src/services.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,UAAU,EACf,KAAK,gBAAgB,EACrB,KAAK,QAAQ,EAEd,MAAM,oBAAoB,CAAC;AAC5B,OAAO,KAAK,MAAM,MAAM,eAAe,CAAC;AAMxC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAO9C;;;;GAIG;AACH,wBAAgB,6BAA6B,CAC3C,QAAQ,EAAE,cAAc,oBAAoB,CAAC,EAC7C,WAAW,EAAE,SAAS,UAAU,EAAE,QAInC;AAmCD,wBAAsB,sBAAsB,CAAC,IAAI,EAAE,WAAW,iBA2b7D;AAED,wBAAgB,cAAc,CAC5B,gBAAgB,EAAE,cAAc,oBAAoB,CAAC,EACrD,MAAM,EAAE,gBAAgB,GAAG,OAAO,QAAQ,GACzC,MAAM,CAAC,MAAM,CAkBf"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@typespec/playground",
-  "version": "0.15.1",
+  "version": "0.16.0-dev.2",
   "author": "Microsoft Corporation",
   "description": "TypeSpec playground UI components.",
   "homepage": "https://typespec.io",
@@ -61,6 +61,15 @@
   "dependencies": {
     "@fluentui/react-components": "^9.73.7",
     "@fluentui/react-icons": "^2.0.323",
+    "@typespec/bundler": "^0.6.0 || >= 0.6.1-dev.0",
+    "@typespec/compiler": "^1.13.0 || >= 1.14.0-dev.0",
+    "@typespec/html-program-viewer": "^0.83.0 || >= 0.84.0-dev.0",
+    "@typespec/http": "^1.13.0 || >= 1.14.0-dev.0",
+    "@typespec/openapi": "^1.13.0 || >= 1.14.0-dev.0",
+    "@typespec/openapi3": "^1.13.0 || >= 1.14.0-dev.1",
+    "@typespec/protobuf": "^0.83.0 || >= 0.84.0-dev.0",
+    "@typespec/rest": "^0.83.0 || >= 0.84.0-dev.0",
+    "@typespec/versioning": "^0.83.0 || >= 0.84.0-dev.0",
     "clsx": "^2.1.1",
     "debounce": "^3.0.0",
     "lzutf8": "0.6.3",
@@ -71,16 +80,7 @@
     "swagger-ui-dist": "^5.32.2",
     "vscode-languageserver": "^9.0.1",
     "vscode-languageserver-textdocument": "^1.0.12",
-    "yaml": "^2.8.3",
-    "@typespec/bundler": "^0.6.0",
-    "@typespec/html-program-viewer": "^0.83.0",
-    "@typespec/compiler": "^1.13.0",
-    "@typespec/http": "^1.13.0",
-    "@typespec/openapi": "^1.13.0",
-    "@typespec/versioning": "^0.83.0",
-    "@typespec/openapi3": "^1.13.0",
-    "@typespec/rest": "^0.83.0",
-    "@typespec/protobuf": "^0.83.0"
+    "yaml": "^2.8.3"
   },
   "devDependencies": {
     "@babel/core": "^7.29.0",
@@ -95,6 +95,7 @@
     "@types/react": "^19.2.16",
     "@types/react-dom": "^19.2.3",
     "@types/swagger-ui-dist": "^3.30.6",
+    "@typespec/bundler": "^0.6.0 || >= 0.6.1-dev.0",
     "@vitejs/plugin-react": "^6.0.1",
     "cross-env": "^10.1.0",
     "es-module-shims": "^2.8.0",
@@ -105,8 +106,7 @@
     "vite-plugin-checker": "^0.14.1",
     "vite-plugin-dts": "5.0.1",
     "vitest": "^4.1.3",
-    "@typespec/react-components": "^0.57.0",
-    "@typespec/bundler": "^0.6.0"
+    "@typespec/react-components": "^0.57.0"
   },
   "scripts": {
     "clean": "rimraf ./dist ./dist-dev ./temp ./typespecContents.json",