[ragojose]

Summary

The hero dashboard now plays a Remotion tool tour with eased chart and metric transitions. Hovering a tool takes control, hovering a chart bar holds its tooltip values, and reduced motion keeps the dashboard static. Playback pauses offscreen or in a hidden tab. Add an Email → Resend shortcut in the middleware list, keep the Errors metric label untruncated, and give narrow hero frames enough height to show every middleware row.

Homepage blog covers load their optimized images and prepare their shaders as soon as the hero artwork renders its first frame, before the reader scrolls to them. Prepared offscreen canvases pause rather than running continuously.

• Use angular connections in the transport and app illustrations, tighten the app window corners, and replace its cube with wider animated code lines.
• Give each docs page a distinct icon, including official Sentry and Upstash marks; test rendered SVG geometry to catch duplicate shapes.
• Use the supplied chrome-logo GIF for default Open Graph artwork and its first frame for Twitter cards. Preserve page-specific blog/docs artwork. Sharing clients may display the GIF as a still.
• Center the 404 heading, explanatory copy, and recovery links beneath the existing animated X artwork. Fill the available viewport without the marketing footer, scale the artwork on short screens, clear the desktop sidebar, and retain visible keyboard focus.

These are website presentation changes; framework documentation and a runnable package example do not apply. The website preview is the runnable demonstration.

Type of Change

• Bug fixing
• Adding a feature
• Improving documentation
• Adding or updating examples
• Performance - bundle size improvement (if applicable)

Affected Packages

• xmcp (core framework)
• create-xmcp-app
• init-xmcp
• Plugins
• Documentation
• Examples

Contributor Checklist

• I read AGENTS.md and the scoped rules for the areas I touched.
• I kept this PR focused on the stated change.
• I ran the relevant build, lint, test, or example checks.
• I updated docs and a runnable example for user-facing behavior, or explained why an example does not fit.
• I checked REVIEW_RULES.md for logging, timers, config shape, wrappers, compiler/loader changes, and stale examples.

Validation

• Production website build, TypeScript, Prettier, and diff whitespace checks passed.

• All four docs icon tests passed.

• Changed TS/TSX files pass ESLint with the repository's Next.js flat rule sets. The normal website lint command remains blocked by the existing FlatCompat circular-config error.

• Browser checks cover dashboard playback and hover interactions, stable Errors positioning, reduced motion, and responsive widths from 320 to 1440px.

• Browser checks gate the hero request, confirm homepage blog preparation starts after it is ready, and verify all four covers are ready before scrolling. WebGPU and WebGL fallback were exercised; offscreen WebGL canvases stop drawing after preparation.

• Production browser checks cover 404 layouts in both themes at 320–1920px, missing root/docs/blog/templates/showcase routes, HTTP 404 and noindex, keyboard recovery links, and OG metadata/assets on all six pages using the shared artwork.

• Follow-up browser checks confirm no 404 scrolling on desktop, mobile, and landscape viewports; all middleware rows fit at 320–1440px; the Email shortcut opens the Resend guide; and Errors remains untruncated. The six feature animations pass seamless-loop, reduced-motion, offscreen-pause, and responsive-containment checks.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
xmcp-website	Ready	Preview	Oct 22, 2026 7:03pm UTC