@

feat(ui): add DataTable and Toaster, drop the legacy Table, fix overlay dialogs

DataTable replaces the 20-line Table scaffold entirely: columns, sorting,
filtering, pagination, selection, bulk actions, comparison layout, sticky
first column, custom HTML cells, and a remote source driven by a `request`
output rather than a function prop (props travel as HTML attributes, so a
function arrives as its own source text).

Toaster replaces the hand-rolled status div: tone icons, actions, hover
pause/resume and a progress bar.

Overlays audit -- Modal and Drawer declared aria-modal="true" but nothing
ever moved focus into the panel, so the @keydown handler on their root
never ran and closeOnEscape did nothing. Focus, focus restore, a Tab trap
and a body scroll lock now live in the reactive runtime, shared by both.

ContextMenu placed pointer menus by subtracting a guessed 340x420 from the
viewport, which pushed every menu that was not that size away from the
pointer; it now positions at the pointer and lets the anchored clamp pull
it back once it can be measured.

The reactive runtime size budget moves 150k -> 175k to cover anchored
overlays, dialog behaviour, the toaster and the DataTable client half.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
@

packages/ui/components/ContextMenu.wrn

@@ -45,8 +45,12 @@ component ContextMenu {
         sourceEvent.preventDefault()
       }
       if (placement === "pointer" && sourceEvent) {
-        positionX = Math.max(12, Math.min(sourceEvent.clientX || 12, window.innerWidth - 340))
-        positionY = Math.max(12, Math.min(sourceEvent.clientY || 12, window.innerHeight - 420))
+        // Place the menu at the pointer and let the anchored clamp in the
+        // runtime pull it back on screen once it has been laid out and can
+        // actually be measured. Subtracting a guessed 340x420 here instead
+        // pushed every menu that was not that size away from the pointer.
+        positionX = Math.max(12, sourceEvent.clientX || 12)
+        positionY = Math.max(12, sourceEvent.clientY || 12)
       }
       visible = true
       output.open({
@@ -161,6 +165,7 @@ component ContextMenu {
 
       <div
         class="wire-context-menu__panel"
+        data-wrn-anchored="true"
         data-show='{open || visible}'
         role="menu"
         aria-label='{label}'