From d333c0332ea2c020174d596c6c4c3647f7e27c55 Mon Sep 17 00:00:00 2001
From: Timothee Guerin <tiguerin@microsoft.com>
Date: Thu, 6 Jun 2024 12:42:18 -0700
Subject: [PATCH 1/3] Fix some styles in the playground with overflow

---
 packages/playground/src/react/editor.tsx                     | 2 +-
 .../playground/src/react/output-tabs/output-tabs.module.css  | 1 +
 packages/playground/src/react/playground.module.css          | 5 +++++
 packages/playground/src/react/playground.tsx                 | 2 +-
 4 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/playground/src/react/editor.tsx b/packages/playground/src/react/editor.tsx
index bb21acba39..1cdce05796 100644
--- a/packages/playground/src/react/editor.tsx
+++ b/packages/playground/src/react/editor.tsx
@@ -53,7 +53,7 @@ export const Editor: FunctionComponent<EditorProps> = ({ model, options, actions
   return (
     <div
       className="monaco-editor-container"
-      style={{ width: "100%", height: "100%", overflow: "hidden" }}
+      style={{ width: "100%", height: "100%" }}
       ref={editorContainerRef}
       data-tabster='{"uncontrolled": {}}' // https://github.com/microsoft/tabster/issues/316
     ></div>
diff --git a/packages/playground/src/react/output-tabs/output-tabs.module.css b/packages/playground/src/react/output-tabs/output-tabs.module.css
index 89228b7686..ef98e3a5c3 100644
--- a/packages/playground/src/react/output-tabs/output-tabs.module.css
+++ b/packages/playground/src/react/output-tabs/output-tabs.module.css
@@ -1,6 +1,7 @@
 .tabs {
   border-bottom: 1px solid var(--colorNeutralStroke1);
   box-shadow: var(--shadow2);
+  overflow-y: auto;
 }
 
 .tab-divider {
diff --git a/packages/playground/src/react/playground.module.css b/packages/playground/src/react/playground.module.css
index 80fcee1243..6f6b9ac94d 100644
--- a/packages/playground/src/react/playground.module.css
+++ b/packages/playground/src/react/playground.module.css
@@ -5,3 +5,8 @@
   height: 100%;
   overflow: hidden;
 }
+
+.edit-pane {
+  display: flex;
+  flex-direction: column;
+}
diff --git a/packages/playground/src/react/playground.tsx b/packages/playground/src/react/playground.tsx
index b677999830..6a36f32fc1 100644
--- a/packages/playground/src/react/playground.tsx
+++ b/packages/playground/src/react/playground.tsx
@@ -261,7 +261,7 @@ export const Playground: FunctionComponent<PlaygroundProps> = (props) => {
         <SplitPane sizes={verticalPaneSizes} onChange={onVerticalPaneSizeChange} split="horizontal">
           <Pane>
             <SplitPane initialSizes={["50%", "50%"]}>
-              <Pane>
+              <Pane className={style["edit-pane"]}>
                 <EditorCommandBar
                   host={host}
                   selectedEmitter={selectedEmitter}

From 09cbb65d40c312749269fd8c7c034a0087cd18f7 Mon Sep 17 00:00:00 2001
From: Timothee Guerin <timothee.guerin@outlook.com>
Date: Thu, 6 Jun 2024 12:49:50 -0700
Subject: [PATCH 2/3] Create
 fix-playground-styles-overflow-2024-5-6-19-45-49.md

---
 .../fix-playground-styles-overflow-2024-5-6-19-45-49.md   | 8 ++++++++
 1 file changed, 8 insertions(+)
 create mode 100644 .chronus/changes/fix-playground-styles-overflow-2024-5-6-19-45-49.md

diff --git a/.chronus/changes/fix-playground-styles-overflow-2024-5-6-19-45-49.md b/.chronus/changes/fix-playground-styles-overflow-2024-5-6-19-45-49.md
new file mode 100644
index 0000000000..544a57cab1
--- /dev/null
+++ b/.chronus/changes/fix-playground-styles-overflow-2024-5-6-19-45-49.md
@@ -0,0 +1,8 @@
+---
+# Change versionKind to one of: internal, fix, dependencies, feature, deprecation, breaking
+changeKind: fix
+packages:
+  - "@typespec/playground"
+---
+
+Fix issue where hover tooltip would be cropped or not visibile

From fc1f2a1ef08ef6d1163669c927dc347db998bd67 Mon Sep 17 00:00:00 2001
From: Timothee Guerin <tiguerin@microsoft.com>
Date: Thu, 6 Jun 2024 13:01:21 -0700
Subject: [PATCH 3/3] Fix typo

---
 .../changes/fix-playground-styles-overflow-2024-5-6-19-45-49.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.chronus/changes/fix-playground-styles-overflow-2024-5-6-19-45-49.md b/.chronus/changes/fix-playground-styles-overflow-2024-5-6-19-45-49.md
index 544a57cab1..0fb6b39703 100644
--- a/.chronus/changes/fix-playground-styles-overflow-2024-5-6-19-45-49.md
+++ b/.chronus/changes/fix-playground-styles-overflow-2024-5-6-19-45-49.md
@@ -5,4 +5,4 @@ packages:
   - "@typespec/playground"
 ---
 
-Fix issue where hover tooltip would be cropped or not visibile
+Fix issue where hover tooltip would be cropped or not visible