feat(web): add Modal + EmptyState primitives and a11y hooks

- Modal: shared backdrop/panel with ESC-close, backdrop-click-close,
  focus trap, body scroll lock; supports center + drawer-right variants,
  matrix/violet accents, default/wide widths.
- EmptyState: icon + title + hint + optional CTA; compact variant
  for tight rails.
- useEscapeKey, useFocusTrap: reusable hooks powering Modal; will also
  be adopted by CommandPalette and ContextMenu in follow-up commits.

No retrofits yet — primitives only. tsc clean.
This commit is contained in:
2026-04-22 17:04:37 -04:00
parent 73ccf12678
commit d0463c2c16
6 changed files with 271 additions and 0 deletions

View File

@@ -0,0 +1,24 @@
/* Drawer-right variant: reuses .modal-backdrop + .modal base from DeckyFleet.css
and shifts the panel to the right edge as a full-height side panel. */
.modal-backdrop.drawer {
justify-content: flex-end;
align-items: stretch;
}
.modal.modal-drawer-right {
width: 520px;
max-width: 96vw;
max-height: 100vh;
height: 100vh;
border-left: 1px solid var(--matrix);
border-top: none;
border-right: none;
border-bottom: none;
box-shadow: -8px 0 30px rgba(0, 0, 0, 0.6);
}
.modal.modal-drawer-right.violet {
border-left-color: var(--violet);
box-shadow: -8px 0 30px rgba(238, 130, 238, 0.25);
}