Sidebar tweaks (#2433)

<!-- ELLIPSIS_HIDDEN -->



> [!IMPORTANT]
> UI and styling updates for sidebar components, including text changes,
dependency updates, and minor CSS adjustments.
> 
>   - **UI Changes**:
>     - `preview-toolbar.tsx`: Changed "Run Test" button text to "Run".
> - `index.tsx`: Added `Settings` and `SidebarCloseIcon` imports;
commented out button for closing sidebar.
> - `sidebar.tsx`: Updated sidebar keyboard shortcut to "b"; adjusted
sidebar width constants.
>   - **Dependency Updates**:
>     - Removed `vscode-webview` from `playground-common/package.json`.
> - Updated `@tailwindcss/postcss` and `tailwindcss` to `4.1.13` in
`ui/package.json`.
>   - **Styling**:
> - `globals.css`: Minor formatting change in CSS variable declaration.
> 
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=BoundaryML%2Fbaml&utm_source=github&utm_medium=referral)<sup>
for 2355dc5. You can
[customize](https://app.ellipsis.dev/BoundaryML/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>

<!-- ELLIPSIS_HIDDEN -->

Author: aaronvg

pnpm-lock.yaml

@@ -77,7 +77,6 @@
     "swr": "2.3.3",
     "tailwind-merge": "3.3.1",
     "unist-util-visit": "5.0.0",
-    "vscode-webview": "1.0.1-beta.1",
     "zod": "3.25.66"
   },
   "devDependencies": {

typescript/packages/playground-common/package.json

@@ -61,7 +61,7 @@ const RunButton: React.FC<{ className?: string }> = ({ className }) => {
       }}
     >
       <Play className="size-4 flex-shrink-0" />
-      <span className="text-sm whitespace-nowrap">Run Test</span>
+      <span className="text-sm whitespace-nowrap">Run</span>
     </Button>
   );
 };

typescript/packages/playground-common/src/shared/baml-project-panel/playground-panel/preview-toolbar.tsx

@@ -112,6 +112,7 @@ export const PromptRenderWrapper = () => {
   };
 
   return (
+    // this used to be flex flex-col h-full min-h-0
     <Tabs defaultValue="preview" className="flex flex-col min-h-0">
       <div className="flex items-center justify-between">
         <div className="flex items-center gap-2">

typescript/packages/playground-common/src/shared/baml-project-panel/playground-panel/prompt-preview/prompt-render-wrapper.tsx

@@ -25,6 +25,8 @@ import {
   ChevronUp,
   FlaskConical,
   Play,
+  Settings,
+  SidebarCloseIcon,
 } from 'lucide-react';
 import * as React from 'react';
 import { selectedItemAtom } from '../atoms';
@@ -34,6 +36,7 @@ import { FunctionItem } from './function-item';
 import { SearchForm } from './search-form';
 import { TestItem } from './test-item';
 import type { FunctionData } from './types';
+import { Button } from '@baml/ui/button';
 
 export { isSidebarOpenAtom };
 
@@ -108,6 +111,11 @@ export function TestingSidebar() {
           </SidebarMenuItem>
         </SidebarMenu>
         <SearchForm searchTerm={searchTerm} onSearchChange={setSearchTerm} />
+        {/* <Button variant="ghost" size="sm" className='absolute right-0 top-0 xl:hidden' onClick={() => {
+          
+        }}>
+          <SidebarCloseIcon className="size-4 scale-x-[-1]" />
+        </Button> */}
       </SidebarHeader>
       <SidebarContent>
         <div className="flex-1 min-h-0 overflow-y-auto">

typescript/packages/playground-common/src/shared/baml-project-panel/playground-panel/side-bar/index.tsx

@@ -72,10 +72,10 @@
   },
   "devDependencies": {
     "@baml/tsconfig": "workspace:*",
-    "@tailwindcss/postcss": "4.1.11",
+    "@tailwindcss/postcss": "4.1.13",
     "@types/react": "19.1.8",
     "@types/react-dom": "19.1.6",
-    "tailwindcss": "4.1.11",
+    "tailwindcss": "4.1.13",
     "typescript": "5.8.3",
     "zod": "3.25.66"
   },