PRO-1081: Make CodeMirror code viewer resizable

* PRO-1081: Make CodeMirror code viewer resizable

- Switch .CodeMirror from fixed height: 100px to min-height: 100px so the
  box starts compact but can be dragged taller
- Add max-height: 600px to keep it bounded by default
- Set resize: vertical and overflow: hidden to enable the native resize handle
  (overflow must be non-visible for CSS resize to work; CodeMirror-scroll
  handles internal scrolling independently)
- Add ResizeObserver in CodeMirrorViewer to call cm.refresh() after each drag,
  keeping line rendering correct after the container height changes

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

* PRO-1081: Tighten ResizeObserver — rAF, guard, cancel on cleanup

- Default height 160px (down from 320px)
- Guard ResizeObserver construction behind window.ResizeObserver check
- Wrap refresh() call in requestAnimationFrame to avoid "ResizeObserver
  loop limit exceeded" errors; cancel pending rAF on unmount

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

---------

Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>

Author: pattonwebz

src/issueModal/components/CodeMirrorViewer.js

@@ -42,8 +42,25 @@ const CodeMirrorViewer = ( { value } ) => {
 
 		editorRef.current = window.wp.codeEditor.initialize( textareaRef.current, editorSettings );
 
+		// When the user drags the resize handle, CodeMirror's JS viewport
+		// measurements don't update automatically. Observing the wrapper element
+		// and calling refresh() keeps line rendering correct after a resize.
+		// rAF defers the refresh out of the ResizeObserver callback to avoid
+		// "ResizeObserver loop limit exceeded" errors in some browsers.
+		const cmEl = editorRef.current.codemirror.getWrapperElement();
+		let rafId;
+		const observer = window.ResizeObserver
+			? new ResizeObserver( () => {
+				cancelAnimationFrame( rafId );
+				rafId = requestAnimationFrame( () => editorRef.current?.codemirror?.refresh() );
+			} )
+			: null;
+		observer?.observe( cmEl );
+
 		// Cleanup on unmount
 		return () => {
+			cancelAnimationFrame( rafId );
+			observer?.disconnect();
 			if ( editorRef.current?.codemirror ) {
 				editorRef.current.codemirror.toTextArea();
 				editorRef.current = null;

src/issueModal/sass/issue-modal.scss

@@ -404,7 +404,14 @@
 	}
 
 	.CodeMirror {
-		height: 100px;
+		// overflow: hidden is required for CSS resize to work (visible blocks
+		// the resize handle). CodeMirror's own .CodeMirror-scroll handles
+		// internal scrolling.
+		height: 160px;
+		min-height: 100px;
+		max-height: 600px;
+		resize: vertical;
+		overflow: hidden;
 		border: 1px solid #ddd;
 		border-radius: 4px;
 		font-size: 12px;