fix(rich-editor): make suggestion menus scrollable inside modals

- Mount the slash/@ menu popup inside the host dialog (when present) instead of
  document.body: Radix's scroll-lock blocks wheel events outside the dialog
  subtree, so a body-level popup couldn't scroll in a modal. position:fixed keeps
  it viewport-positioned (the modal centers via flex, no transform) so it isn't clipped
- Fix the invalid max-w arbitrary value (calc needs spaces) that left the menu uncapped
- Match the version-description editor's dynamic-import loading height to the field
  so the modal doesn't grow when the chunk loads

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/menus/suggestion-menu-chrome.ts

@@ -6,7 +6,7 @@
 
 /** The floating panel: bordered card with the enter animation, width-capped like the chat mention menu. */
 export const SUGGESTION_SURFACE_CLASS =
-  'min-w-[220px] max-w-[min(300px,calc(100vw-32px))] origin-top-left animate-in rounded-xl border border-[var(--border)] bg-[var(--bg)] p-1.5 shadow-sm duration-100 fade-in-0 zoom-in-95 slide-in-from-top-2 motion-reduce:animate-none'
+  'min-w-[220px] max-w-[320px] origin-top-left animate-in rounded-xl border border-[var(--border)] bg-[var(--bg)] p-1.5 shadow-sm duration-100 fade-in-0 zoom-in-95 slide-in-from-top-2 motion-reduce:animate-none'
 
 /**
  * A scrollable list body, added alongside {@link SUGGESTION_SURFACE_CLASS}. Caps the height and scrolls

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/menus/suggestion-popup.ts

@@ -72,7 +72,11 @@ export function createSuggestionPopupRenderer<P, H extends SuggestionListHandle>
         popup = document.createElement('div')
         popup.className = 'fixed top-0 left-0 z-[var(--z-popover)]'
         popup.appendChild(component.element)
-        document.body.appendChild(popup)
+        // Mount inside the host dialog when the editor is in a modal: Radix's scroll-lock blocks wheel
+        // events outside the dialog subtree, so a body-level popup can't be scrolled. `position: fixed`
+        // keeps it viewport-positioned (the modal centers via flex, no transform) so it isn't clipped.
+        const host = props.editor.view.dom.closest('[role="dialog"]') ?? document.body
+        host.appendChild(popup)
         boundEditor = props.editor
         boundEditor.on('destroy', teardown)
         const reference = { getBoundingClientRect: () => props.clientRect?.() ?? new DOMRect() }

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/deploy/components/deploy-modal/components/general/components/version-description-modal.tsx

@@ -26,7 +26,7 @@ const RichMarkdownField = dynamic(
     ).then((m) => m.RichMarkdownField),
   {
     ssr: false,
-    loading: () => <div className={cn('min-h-[120px]', chipFieldSurfaceClass)} />,
+    loading: () => <div className={cn('min-h-[240px]', chipFieldSurfaceClass)} />,
   }
 )