5.2.6 Preview lightbox — full-screen image/PDF preview modal from a panel card (download inside; non-previewable types download)
Estimate: 22m · Depends on: 5.2.4, 5.2.5
The preview affordance: clicking an image or PDF card opens a full-screen lightbox (the Jira behaviour — verified: images + PDF preview, other types download). A reusable AttachmentPreview composed on the Modal primitive per the 5.2.4 design: dark-scrim full-screen panel, header (filename + size + Download + close ×), the image contain-fit centered, the PDF in an embedded frame (<object>/<iframe> over the blob URL with a download fallback message when the browser can't inline it). Non-previewable cards never open it — their click/activation downloads (5.2.5 wires the split via the DTO's isImage/isPdf flags). NO prev/next navigation (unverified in the mirror; documented out in 5.2.4).
A11y: the full Modal contract — focus trap, Esc closes, focus returns to the opening card; the dialog is labelled by the filename; the image carries the filename as alt; preview state conveyed as text in the header (name + size), not implied by imagery alone.
Acceptance criteria
- An image card opens the lightbox (contain-fit, header with name/size/Download/×); a PDF previews in-frame with the fallback message path; a
.zip/doc card downloads instead of opening; all matching the 5.2.4 mockup. - Focus trap + Esc + return-focus verified; labelled dialog; axe-clean inside the open modal.
- Reuses
Modal(adding a full-screen size token per the growth pattern only if the design notes call for it); colour/shape through the token tiers; no new primitive beyond the composed preview. - Component tests cover the three type branches (image / pdf / download-only) and the keyboard path.
Context refs
design/work-items/attachments.mock.html(5.2.4) — the lightbox panelscomponents/ui/Modal.tsx(focus-trap/Esc/return-focus contract; the 2.5.19 size-token growth precedent)- 5.2.5 (the card click wiring + DTO flags)
- The verified Jira preview contract (images+PDF only; no guaranteed prev/next) in the Story 5.2 description