Without a dedicated viewer, decks become fragile custom components — each host rebuilds aspect-ratio math, keyboard navigation, build-step timing, and transition logic from scratch, introducing bugs and drift. A presenter needs to advance fluidly through entrance animations, jump to specific slides, blank the screen, and exit cleanly, with no DOM-scraping agent support and no bulky animation libraries.

SlideViewer is a controlled read-only deck player that renders one slide at a time at maximum size while preserving the theme's aspect ratio. It accepts a deck object (JSON-friendly structure with title, slides, theme, and metadata), controlled index + onIndexChange for slide navigation, and optional onExit + autoAdvanceMs for kiosk mode. Build steps — intra-slide entrance animations — advance independently from slide changes, so elements reveal progressively as the presenter clicks; renderElement lets you override the default renderer for custom element types (chart, code, table, embed). Keyboard nav is built in: arrow keys navigate slides, spacebar/click advances, digit keys jump, F11 fullscreens, B blanks the screen, and Esc exits. Slide-entrance transitions (fade, zoom, slide left/right/up/down) inherit from the theme and play automatically with prefers-reduced-motion respect.

Import from @particle-academy/fancy-slides, pass a Deck object and wrap it in a fullscreen container: <div style={display: "flex", height: "100vh"}><SlideViewer deck={myDeck} index={index} onIndexChange={setIndex} onExit={() => router.back()} /></div>. For kiosk mode, add autoAdvanceMs={3000}. Custom renders—pass renderElement={(elem, width) => …}. Agents operate by reading/writing the index and buildStep data attributes on the root div (stable handles data-fancy-slides-viewer and data-fancy-slides-build-step); MCP tools can query slide content via the Deck schema directly, no DOM scraping required.