Report pane resize handle size to assistive tech (APG window splitter)

src/app/stores/PanesStore.test.ts

@@ -1,5 +1,13 @@
 import { beforeEach, describe, expect, test } from 'vitest';
-import { clampSideWidth, HANDLES_TOTAL, PANE_DEFAULT, PANE_MIN, usePanesStore } from './PanesStore';
+import {
+  clampSideWidth,
+  HANDLES_TOTAL,
+  maxSideWidth,
+  PANE_DEFAULT,
+  PANE_MIN,
+  sideWidthValue,
+  usePanesStore,
+} from './PanesStore';
 
 const store = () => usePanesStore.getState();
 
@@ -32,6 +40,38 @@ describe('clampSideWidth', () => {
   });
 });
 
+describe('sideWidthValue (aria-valuenow, 0–100 per WAI-ARIA APG window splitter)', () => {
+  const W = 1400;
+
+  test('reports 0 at the pane minimum and 100 at the pane maximum', () => {
+    const other = PANE_DEFAULT.preview;
+    const max = maxSideWidth('library', W, other);
+    expect(sideWidthValue('library', PANE_MIN.library, W, other)).toBe(0);
+    expect(sideWidthValue('library', max, W, other)).toBe(100);
+  });
+
+  test('reports the midpoint as ~50', () => {
+    const other = PANE_DEFAULT.preview;
+    const mid = (PANE_MIN.library + maxSideWidth('library', W, other)) / 2;
+    expect(sideWidthValue('library', mid, W, other)).toBe(50);
+  });
+
+  test('clamps out-of-range widths into 0–100', () => {
+    const other = PANE_DEFAULT.preview;
+    expect(sideWidthValue('library', 0, W, other)).toBe(0);
+    expect(sideWidthValue('library', 99999, W, other)).toBe(100);
+  });
+
+  test('returns null before layout is known (container width 0)', () => {
+    expect(sideWidthValue('library', 280, 0, PANE_DEFAULT.preview)).toBeNull();
+  });
+
+  test('returns null when the range has collapsed (container too narrow)', () => {
+    // 500px can't fit all the minimums, so min == max and there is no range.
+    expect(sideWidthValue('library', 200, 500, PANE_MIN.preview)).toBeNull();
+  });
+});
+
 describe('usePanesStore', () => {
   beforeEach(() =>
     store().hydrate({ libraryWidth: PANE_DEFAULT.library, previewWidth: PANE_DEFAULT.preview }),