fix release version 1.11.0

This commit is contained in:
Wildan Nursahidan
2025-05-25 03:20:17 +07:00
parent 209a80d5e8
commit 73a9843d4e
53 changed files with 1985 additions and 3334 deletions

View File

@@ -1,10 +1,10 @@
---
title: Accordion
description: This section previews the Accordion component.
description: A component used to create collapsible content that can be hidden and shown again.
date: 22-12-2024
---
I have implemented the `accordion` component into markdown which is ready to use.
The Accordion component is a collapsible content container that can be used to hide and show content again. It is a flexible component that can be used to display any content, including HTML elements, markdown components, and plain text.
## Preview

View File

@@ -1,10 +1,10 @@
---
title: Button
description: This section previews the Button component.
description: A component used to create buttons that can be used to trigger actions or navigate to other pages.
date: 14-12-2024
---
I have implemented the `button` component into markdown which is ready to use.
The Button component is a component used to create buttons that can be used to trigger actions or navigate to other pages.
## Preview

View File

@@ -1,10 +1,10 @@
---
title: Card Group
description: This section previews the Card Group component.
description: A component used to create card groups that can be used to display multiple cards in a compact and organized way.
date: 20-02-2025
---
I have implemented the `card group` component into markdown which is ready to use.
The CardGroup component is a component used to create card groups that can be used to display multiple cards in a compact and organized way.
## Preview

View File

@@ -1,10 +1,10 @@
---
title: Cards
description: This section previews the Cards component.
description: A component used to create cards that can be used to display content in a compact and organized way.
date: 20-02-2025
---
I have implemented the `cards` component into markdown which is ready to use.
The Card component is a component used to create cards that can be used to display content in a compact and organized way.
## Example

View File

@@ -1,10 +1,10 @@
---
title: Code Block
description: This section previews the Code Block features in markdown.
description: A component used to display code snippets with optional line numbering and line highlighting.
date: 14-12-2024
---
The Code Block in this documentation allows you to display code snippets with optional line numbering and line highlighting.
The Code Block component is a component used to display code snippets with optional line numbering and line highlighting.
## Preview

View File

@@ -1,6 +1,6 @@
---
title: Image
description: This section provides an overview of how DocuBook handles images in Markdown.
description: A component used to display images in Markdown.
date: 14-12-2024
---

View File

@@ -1,6 +1,6 @@
---
title: Link
description: This section provides an overview of how DocuBook handles links in Markdown.
description: A component used to create links that can be used to navigate to other pages.
date: 14-12-2024
---

View File

@@ -1,6 +1,6 @@
---
title: Note
description: This section previews the Note component.
description: A component used to display different types of messages such as general notes, warnings, or success notifications.
date: 14-12-2024
---

View File

@@ -4,43 +4,127 @@ description: The Release Note component makes it easy for you to write updates f
date: 31-12-2024
---
## Usage
The Release Note component makes it easy for you to write and display changelogs in a structured and organized way. This component consists of two main parts: `Release` and `Changes` which can be used to display version, date, release title, and a list of changes categorized by type.
To fill in the Release Note content that will be displayed on the Changelog page, open the `CHANGELOG.md` file, write it with the markdown tag.
## Basic Usage
<Accordion title="Example" defaultOpen={true}>
```plaintext:CHANGELOG.md
## [1.3.0] - 2024-12-31
Here is a basic example of using the Release Note component:
> Release Note Feature to Make it Easier to Write Changelogs
```jsx
<Release version="1.10.1" date="2025-05-24" title="Accessibility Improvements and Bug Fixes">
<Changes type="added">
- New feature to improve accessibility
- Keyboard navigation support for dialog components
</Changes>
<Changes type="fixed">
- Bug fix for mobile menu
- Fixed loading issues on documentation pages
</Changes>
</Release>
```
![Your Image Alt Text](https://docubook.pro/images/example-img.png)
### Added
- New Release Note Feature
- New Layout for Changelog page
- New Changelog page
- add Release Note Component
- Easily write release notes directly from the CHANGELOG.md file
- Toc for versioning
- Write with the markdown tag
- add lib / changelog.ts
```
<Accordion title="Render As" defaultOpen={true}>
<Release version="1.10.1" date="2025-05-24" title="Accessibility Improvements and Bug Fixes">
<Changes type="added">
- New feature to improve accessibility
- Keyboard navigation support for dialog components
</Changes>
<Changes type="fixed">
- Bug fix for mobile menu
- Fixed loading issues on documentation pages
</Changes>
</Release>
</Accordion>
## Preview : Render Output
## Release Component
<Accordion title="Show Render">
![show demo changelog](/images/view-changelog.png)
</Accordion>
The `Release` component is used to display key information about a release version, such as version number, release date, and title.
## Changes Category
### Release Props
| **Category** | **Description** |
| -------------- | ---------------------------------------------------------------------------------------------------- |
| **Added** | Features or functionalities that are newly introduced. |
| **Improved** | Enhancements or optimizations made to existing features or performance. |
| **Fixed** | Bugs, issues, or errors that have been resolved in this version. |
| **Deprecated** | Features or functionalities that are no longer recommended for use and may be removed in the future. |
| **Removed** | Features or functionalities that have been completely taken out of the product. |
| Prop | Type | Required | Description |
|------|------|----------|-------------|
| `version` | string | ✅ | Version number to display (without "v" prefix) |
| `title` | string | ✅ | Title or name of the release |
| `date` | string | ❌ | Release date in a valid format (example: "2025-05-24") |
| `children` | ReactNode | ✅ | Child content, typically `Changes` components |
```jsx
<Release
version="1.10.1"
date="2025-05-24"
title="Accessibility Improvements and Bug Fixes"
>
{/* Changes content here */}
</Release>
```
## Changes Component
The `Changes` component is used to group changes by category with appropriate icons and colors.
### Changes Props
| Prop | Type | Required | Description |
|------|------|----------|-------------|
| `type` | string | ✅ | Type of change: 'added', 'fixed', 'improved', 'deprecated', or 'removed' |
| `children` | ReactNode | ✅ | List of changes, can be text with Markdown formatting |
### Changes Note
| Category | Description |
|----------|-------------|
| `added` | New features or functionality added |
| `fixed` | Bugs or issues that have been fixed |
| `improved` | Enhancements or optimizations to existing features |
| `deprecated` | Features that are not recommended and may be removed in future |
| `removed` | Features that have been completely removed |
### Changes Example
```jsx
<Changes type="added">
- New feature to improve accessibility
- Keyboard navigation support for dialog components
</Changes>
<Changes type="fixed">
- Bug fix for mobile menu
- Fixed loading issues on documentation pages
</Changes>
```
## Complete Implementation
Here is a complete example of using the Release Note component in an MDX file:
````plaintext
<!-- hidden heading for TOC -->
<Release version="1.10.1" date="2025-05-24" title="Accessibility Improvements and Bug Fixes">
<Changes type="added">
- Keyboard navigation for all interactive components
- Screen reader support for table components
- Dark mode feature with system preference detection
</Changes>
<Changes type="fixed">
- Fixed mobile menu bug that wouldn't close when navigating to another page
- Fixed loading issues on documentation pages
- Fixed display issues in Safari browser
</Changes>
<Changes type="improved">
- Improved page loading performance
- Optimized JavaScript bundle size
- Enhanced responsive design across all viewports
</Changes>
</Release>
````
## Usage Tips
1. **Date Format**: Use a consistent date format for all releases.
2. **Version Ordering**: Arrange versions in reverse chronological order (newest version at the top).
3. **List Items**: You can use standard Markdown list format (`-` or `*`) or write text directly, the component will handle the formatting.
4. **TOC**: Use hidden headings to ensure each version is detected in the Table of Contents. Use `<div className="sr-only">### v 1.10.1</div>`

View File

@@ -1,6 +1,6 @@
---
title: Stepper
description: This section previews the stepper component.
description: A component used to display step-by-step instructions directly within the markdown render.
date: 14-12-2024
---

View File

@@ -1,6 +1,6 @@
---
title: Tabs
description: This section previews the Tabs component.
description: Organize content into multiple sections with switchable tabs.
date: 14-12-2024
---

View File

@@ -1,10 +1,10 @@
---
title: Tooltips
description: This section previews the Tooltips component.
description: A component used to display additional information when hovering over a word or phrase.
date: 19-02-2025
---
I have implemented the `tooltips` component into markdown which is ready to use.
I have implemented the `tooltips` component into markdown which allows you to add additional information to a word or phrase when hovering. This feature is useful for providing definitions, explanations, or any other additional information that can enhance the user experience.
## Usage
You can use tooltips in your Markdown content to provide additional information when hovering over a word or phrase.

View File

@@ -1,6 +1,6 @@
---
title: Youtube
description: This section previews the Youtube video embed component.
description: A component used to embed YouTube videos directly into your documentation.
date: 14-12-2024
---