feat(framework-editor): resizable + size-remembering description editor (FRAME-3)

[tofikwest]

What

Makes the large multi-line cell editor (used for requirement/control descriptions) resizable in both directions and remembers the size between opens.

Why (FRAME-3)

1. The editor could effectively only grow vertically — the textarea was w-full inside a fixed 760px dialog, so horizontal dragging did nothing. Long requirement text (NIST SP800-53 PL-2 was called out as an extreme example) was cramped.
2. The editor always reopened at the default size, so any resize was forgotten.

Changes

• Textarea is now freely resizable (resize, min-w-[320px], max-w-[92vw]). The dialog uses w-fit max-w-[95vw] so it grows to fit the textarea up to near full-viewport width.
• Size is persisted to localStorage and restored on reopen. (The ticket said "cookie"; localStorage is the idiomatic web-storage choice here — no server round-trip, per-browser — and behaves the same from the user's point of view. Happy to switch to a cookie if you specifically need it shared server-side.)
• Persistence is a small, validated helper (editor-size-storage.ts): ignores malformed/zero/non-numeric values and storage errors.

Testing

• editor-size-storage.test.ts: 4 tests — round-trip, missing key, malformed JSON, invalid dimensions.
• EditableCell.test.tsx: added a test asserting the editor reopens at the persisted size. 11 tests pass.
• npx turbo run typecheck --filter=@trycompai/framework-editor: clean.

Frontend-only; no API or DB changes. Worth a quick visual check on the preview (resize handle + reopen-at-size).

🤖 Generated with Claude Code

---

Summary by cubic

Makes the large description editor resizable in both directions and remembers its size between opens. Completes Linear FRAME-3 by adding horizontal resize and persisting dimensions via a cookie.

• New Features
  • Textarea resizable horizontally and vertically; dialog grows to fit up to ~95vw (min width 320px).
  • Size saved to a cookie and restored on reopen; small validated storage helper with tests.

^{Written for commit 9ef22dc. Summary will update on new commits.}

[linear]

FRAME-3

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
comp-framework-editor	Ready	Preview, Comment	Jun 12, 2026 6:55pm

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
app	Skipped		Jun 12, 2026 6:55pm
portal	Skipped		Jun 12, 2026 6:55pm

[cubic-dev-ai]

cubic analysis

2 issues found across 4 files

Confidence score: 3/5

• In apps/framework-editor/app/components/table/EditableCell.tsx, the free vertical resize can grow past the viewport with no dialog height cap/scroll area, which can push Save/Cancel off-screen and block users from completing edits — add a max-height and internal scrolling before merging.
• In apps/framework-editor/app/components/table/EditableCell.tsx, size persistence uses localStorage instead of the cookie mechanism requested in FRAME-3, so behavior will diverge from the agreed requirement — switch persistence to cookies (or align product expectations) before merge.

Prompt for AI agents (unresolved issues)

Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.


<file name="apps/framework-editor/app/components/table/EditableCell.tsx">

<violation number="1" location="apps/framework-editor/app/components/table/EditableCell.tsx:14">
P3: According to linked Linear issue FRAME-3, the remembered size must be stored in a cookie. This implementation persists via localStorage instead, so it doesn’t meet the requested persistence mechanism.</violation>
</file>

Linked issue analysis

Linked issue: FRAME-3: Framework Editor - re-sizing widget changes

Status	Acceptance criteria	Notes
✅	Editor can be resized horizontally and vertically (not just vertically)	Textarea and dialog classes were changed to allow horizontal growth (resize enabled, min/max widths, dialog uses w-fit/max-w), so horizontal dragging can change width.
✅	Persist the editor size and restore it when reopening (issue said cookie)	A storage helper was added and used: sizes are validated, saved, and loaded. The PR uses localStorage (not a cookie) but achieves the expected persistent restore behavior; tests cover storage and reopen behavior.

<sub>Reply with feedback, questions, or to request a fix.

Fix all with cubic | Re-trigger cubic</sub>

[cubic-dev-ai]

P3: According to linked Linear issue FRAME-3, the remembered size must be stored in a cookie. This implementation persists via localStorage instead, so it doesn’t meet the requested persistence mechanism.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At apps/framework-editor/app/components/table/EditableCell.tsx, line 14:

<comment>According to linked Linear issue FRAME-3, the remembered size must be stored in a cookie. This implementation persists via localStorage instead, so it doesn’t meet the requested persistence mechanism.</comment>

<file context>
@@ -10,7 +10,8 @@ import {
 import { Maximize2 } from 'lucide-react';
-import { useState } from 'react';
+import { useRef, useState } from 'react';
+import { loadEditorSize, saveEditorSize, type EditorSize } from './editor-size-storage';
 
 interface EditableCellProps {
</file context>

[tofikwest]

Rebased onto main (resolved the EditableCell overlap with FRAME-7 — the editor now has both the row-highlight onExpandedChange and the resize/persist) and addressed both cubic findings:

• P2 (resize can push Save/Cancel off-screen): capped the dialog at max-h-[95vh] with overflow-y-auto, and the textarea at max-h-[80vh]. A tall resize now keeps the footer reachable (scrolls if needed).
• P3 (localStorage vs cookie): switched persistence to a cookie (fwk-editor-expand-editor-size), matching the FRAME-3 acceptance criteria. Same load/save API; tests updated accordingly.

17 tests pass (EditableCell incl. the merged FRAME-7 + FRAME-3 cases, plus the storage round-trip/validation tests); turbo typecheck clean.