feat(FN-4712): complete Step 7 — document autosize pattern

Fusion-Task-Id: FN-4712
Fusion-Task-Lineage: 92ef2161-7ce2-4277-9921-7fe1dd204e98
This commit is contained in:
Fusion (runfusion.ai)
2026-05-15 22:21:09 -07:00
committed by gsxdsm
parent 3887a3dabd
commit 7cb81b0478
2 changed files with 9 additions and 0 deletions

View File

@@ -0,0 +1,5 @@
---
"@runfusion/fusion": patch
---
Auto-grow chat-style entry textareas in mailbox compose, planning mode, and agent onboarding so inputs expand while typing up to a max height, matching existing chat composer behavior.

View File

@@ -723,6 +723,10 @@ A `prefetchLazyViews()` function runs once on mount via `requestIdleCallback` to
`packages/dashboard/app/components/FileEditor.tsx` is CodeMirror 6-backed as the single edit surface (no fallback `<textarea>` pane). Language resolution lives in `packages/dashboard/app/utils/codemirror-language.ts` via `resolveCodeMirrorLanguage(filePath)`, currently mapping JS/TS, CSS, JSON, and Markdown extensions; unknown extensions intentionally fall back to plain text.
### Chat-style textarea autosize pattern
For chat-like composer fields (mailbox compose, planning interview textareas, onboarding Q&A), use `packages/dashboard/app/hooks/useAutosizeTextarea.ts` as the canonical pattern. It mirrors ChatView/QuickChat behavior: set `height = "auto"`, then clamp `scrollHeight` to min/max bounds, and re-run on value/dependency changes in `useLayoutEffect`. Pair it with component CSS that disables manual resize and uses `overflow-y: auto` plus token-based min/max heights.
### Design Tokens
All new CSS **must** use these token variables instead of hardcoded values. Tokens are defined at `:root` and adapted for light mode via `[data-theme="light"]`.