Update
Display changelog entries, version updates, and product announcements with labeled sections and timeline layouts.
Overview
The <Update> component creates visually structured changelog entries with a sticky label sidebar and content area. Perfect for changelogs, release notes, and product announcements.
Common use cases:
- Changelog entries with version numbers and release dates
- Product update announcements with timestamps
- Feature release timelines and roadmaps
- API version deprecation notices
- Release notes documentation
<Update label="2024-10-11" description="v0.1.0">
## New features
We've added support for real-time collaboration and team workspaces.
- Multi-user editing with live cursor tracking
- Team workspace management
- Enhanced permission controls
- Activity feed and notifications
</Update>
New features
We've added support for real-time collaboration and team workspaces.
- Multi-user editing with live cursor tracking
- Team workspace management
- Enhanced permission controls
- Activity feed and notifications
Basic syntax
Use the <Update> component to create changelog entries with labels and descriptions:
<Update label="2024-10-15" description="v1.2.0">
Released new analytics dashboard with real-time metrics and custom reporting.
</Update>
Released new analytics dashboard with real-time metrics and custom reporting.
Tags
Add optional tags to categorize and label updates:
<Update
label="2024-10-20"
description="v2.0.0"
tags={["breaking", "security", "performance"]}
>
## Major release
This release includes breaking changes and performance improvements.
- Updated API authentication flow requiring new credentials
- Optimized database queries for 3x faster response times
- Enhanced security with improved encryption standards
</Update>
Major release
This release includes breaking changes and performance improvements.
- Updated API authentication flow requiring new credentials
- Optimized database queries for 3x faster response times
- Enhanced security with improved encryption standards
Use tags to highlight update categories like "breaking", "feature", "bugfix", "security", or "deprecated".
Rich content
Updates support all MDX components including code blocks, images, cards, and other components:
<Update label="2024-10-18" description="Feature Launch" tags={["feature"]}>
## Interactive API Playground
Test API endpoints directly from documentation with our new interactive playground.
<Columns cols={2}>
<Card title="Try it now" icon="play-circle" href="/docs/playground">
Explore the playground with live examples
</Card>
<Card title="API Reference" icon="book-open" href="/docs/api">
View complete endpoint documentation
</Card>
</Columns>
<Callout kind="tip">
The playground supports all authentication methods and provides instant response previews.
</Callout>
</Update>
Interactive API Playground
Test API endpoints directly from documentation with our new interactive playground.
Try it now
Explore the playground with live examples
API Reference
View complete endpoint documentation
The playground supports all authentication methods and provides instant response previews.
Sequential updates
Stack multiple updates to create a changelog timeline:
<Update label="2024-10-22" description="v2.1.1" tags={["bugfix"]}>
- Fixed authentication token refresh issue
- Improved error messages for API validation
- Updated dependencies for security patches
</Update>
<Update label="2024-10-15" description="v2.1.0" tags={["feature"]}>
- Added bulk export functionality
- Implemented advanced search filters
- Enhanced mobile responsive design
</Update>
<Update label="2024-10-01" description="v2.0.0" tags={["breaking", "feature"]}>
- Complete UI redesign with modern interface
- New team collaboration features
- Performance improvements across all modules
</Update>
- Fixed authentication token refresh issue
- Improved error messages for API validation
- Updated dependencies for security patches
- Added bulk export functionality
- Implemented advanced search filters
- Enhanced mobile responsive design
- Complete UI redesign with modern interface
- New team collaboration features
- Performance improvements across all modules
The sidebar uses sticky positioning on desktop to remain visible while scrolling through long updates.
Attributes
The primary label displayed in the sidebar. Typically used for dates (YYYY-MM-DD format) or version identifiers.
Supporting description displayed below the label. Commonly used for version numbers, release types, or brief categorizations.
The main content of the update. Supports all MDX content including headings, text, code blocks, images, cards, callouts, and other components.
Common patterns
- Release changelogs - Use dates as labels and version numbers as descriptions, with tags like "breaking", "feature", or "bugfix" to categorize changes.
- Product announcements - Highlight new features with launch dates and descriptive labels, using tags to indicate feature categories.
- API versioning - Document API changes with version numbers and migration information, tagging deprecated or breaking changes.
- Security updates - Publish security advisories with CVE identifiers and disclosure dates, using "security" tags for visibility.
- Integration launches - Announce new integrations with partner names and capabilities, including documentation links and setup guides.
- Deprecation notices - Communicate breaking changes with clear timelines and migration paths, using "deprecated" or "breaking" tags.
Combine Update components with Cards, Callouts, and Steps to create comprehensive changelog and announcement pages.