fix(home): keep a focused divider's value current through window resizes

The window-resize clamp updated the panel width but not the focused
divider's aria-valuemax/valuenow, so assistive tech kept the old bounds
until the divider was focused again. The clamp now also reports to the
divider while it holds focus, including when the pinned width stays
within the new bounds.

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/home/hooks/use-mothership-resize.test.tsx

@@ -198,6 +198,31 @@ describe('useMothershipResize keyboard divider', () => {
     await unmount()
   })
 
+  it('keeps a focused divider reporting the width a window resize clamps it to', async () => {
+    const { separator, panel, press, unmount } = await mountDivider()
+    vi.stubGlobal('requestAnimationFrame', (callback: FrameRequestCallback) => {
+      callback(0)
+      return 1
+    })
+    await act(async () => separator.focus())
+    press('End')
+    const wideMax = maxPanelWidth(VIEWPORT, CONTAINER)
+    expect(separator.getAttribute('aria-valuenow')).toBe(String(Math.round(wideMax)))
+
+    const narrowViewport = 800
+    vi.stubGlobal('innerWidth', narrowViewport)
+    act(() => {
+      window.dispatchEvent(new Event('resize'))
+    })
+
+    const narrowMax = Math.round(maxPanelWidth(narrowViewport, CONTAINER))
+    expect(narrowMax).toBeLessThan(Math.round(wideMax))
+    expect(panel.style.width).toBe(`${maxPanelWidth(narrowViewport, CONTAINER)}px`)
+    expect(separator.getAttribute('aria-valuemax')).toBe(String(narrowMax))
+    expect(separator.getAttribute('aria-valuenow')).toBe(String(narrowMax))
+    await unmount()
+  })
+
   it('leaves modified and unrelated keys to the rest of the page', async () => {
     const { panel, press, unmount } = await mountDivider()
     for (const event of [

apps/sim/app/workspace/[workspaceId]/home/hooks/use-mothership-resize.ts

@@ -118,6 +118,7 @@ function syncDividerValue(handle: HTMLElement, el: HTMLElement, maxWidth = measu
 export function useMothershipResize(desktopScopeId: string) {
   const mothershipRef = useRef<HTMLDivElement | null>(null)
   const cleanupRef = useRef<(() => void) | null>(null)
+  const focusedDividerRef = useRef<HTMLElement | null>(null)
   const desktopScopeIdRef = useRef(desktopScopeId)
   desktopScopeIdRef.current = desktopScopeId
 
@@ -256,11 +257,14 @@ export function useMothershipResize(desktopScopeId: string) {
     const clampWidth = () => {
       rafId = null
       const el = mothershipRef.current
-      const pinned = el?.style.width
-      if (!el || !pinned) return
+      if (!el) return
+      const pinned = el.style.width
+      const divider = focusedDividerRef.current
+      const reportsToDivider = divider !== null && document.activeElement === divider
+      if (!pinned && !reportsToDivider) return
       const maxWidth = measureMaxWidth(el)
-      if (Number.parseFloat(pinned) <= maxWidth) return
-      writeWidthInstantly(el, maxWidth)
+      if (pinned && Number.parseFloat(pinned) > maxWidth) writeWidthInstantly(el, maxWidth)
+      if (reportsToDivider) syncDividerValue(divider, el, maxWidth)
     }
 
     const handleWindowResize = () => {
@@ -288,8 +292,9 @@ export function useMothershipResize(desktopScopeId: string) {
     syncDividerValue(e.currentTarget, el, maxWidth)
   }, [])
 
-  /** Reports the current width when the divider takes focus. */
+  /** Reports the current width when the divider takes focus, and while it keeps focus. */
   const handleResizeFocus = useCallback((e: React.FocusEvent<HTMLElement>) => {
+    focusedDividerRef.current = e.currentTarget
     const el = mothershipRef.current
     if (el) syncDividerValue(e.currentTarget, el)
   }, [])