feat(examples): Add video-resource-server example

Demonstrates serving binary content (video) via MCP resources using the
base64 blob pattern:

1. Server fetches video from CDN
2. Returns as base64 blob via `videos://{id}` resource template
3. Widget fetches resource and plays in `<video>` element

Includes multiple video sizes for testing (1MB to 150MB).

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Anton Pidkuiko MacBook 2025-12-17 15:14:19 +00:00
commit ba45157d55
No known key found for this signature in database

View file

@ -0,0 +1,54 @@
.main {
width: 100%;
max-width: 640px;
}
.loading {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 2rem;
gap: 1rem;
color: #6b7280;
}
.spinner {
width: 48px;
height: 48px;
border: 4px solid #e5e7eb;
border-top-color: #3b82f6;
border-radius: 50%;
animation: spin 1s linear infinite;
}
@keyframes spin {
to { transform: rotate(360deg); }
}
.error {
padding: 1rem;
color: #dc2626;
}
.error-title {
font-weight: 600;
margin: 0 0 0.5rem 0;
}
.error p {
margin: 0;
}
.player video {
width: 100%;
max-height: 480px;
border-radius: 8px;
background-color: #000;
}
.video-info {
margin-top: 0.5rem;
font-size: 0.875rem;
color: #6b7280;
}