@docubook/create 1.15.0 → 1.15.2

package/src/dist/contents/docs/components/file-tree/index.mdx

@@ -1,109 +0,0 @@
----
-title: File Tree Component
-description: A customizable file tree component for displaying hierarchical file structures in your documentation.
-date: 28-05-2025
----
-
-The File Tree component allows you to display hierarchical file structures in your documentation with collapsible folders and files.
-
-## Basic Usage
-
-```
-<Files>
-  <Folder name="src">
-    <File name="App.tsx" />
-    <File name="index.tsx" />
-    <Folder name="components">
-      <File name="Button.tsx" />
-      <File name="Card.tsx" />
-    </Folder>
-    <Folder name="pages">
-      <File name="Home.tsx" />
-      <File name="About.tsx" />
-    </Folder>
-  </Folder>
-</Files>
-```
-
-Render As:
-<Files>
-  <Folder name="src">
-    <File name="App.tsx" />
-    <File name="index.tsx" />
-    <Folder name="components">
-      <File name="Button.tsx" />
-      <File name="Card.tsx" />
-    </Folder>
-    <Folder name="pages">
-      <File name="Home.tsx" />
-      <File name="About.tsx" />
-    </Folder>
-  </Folder>
-</Files>
-
-## Props
-
-### Files
-
-The root component that wraps the entire file tree.
-
-### Folder
-
-| Prop     | Type     | Required | Description                           |
-|----------|----------|----------|---------------------------------------|
-| `name`     | string   | Yes      | The name of the folder                |
-| `children` | ReactNode | No      | Child elements (File or Folder)       |
-
-### File
-
-| Prop | Type   | Required | Description                |
-|------|--------|----------|----------------------------|
-| `name` | string | Yes      | The name of the file       |
-
-
-## Examples
-
-### Nested Folder Structure
-
-```
-<Files>
-  <Folder name="project-root">
-    <File name="package.json" />
-    <File name="tsconfig.json" />
-    <Folder name="src">
-      <File name="index.ts" />
-      <Folder name="components">
-        <File name="Button.tsx" />
-        <File name="Card.tsx" />
-      </Folder>
-    </Folder>
-  </Folder>
-</Files>
-```
-
-### Minimal Example
-
-```
-<Files>
-  <Folder name="components">
-    <File name="Button.tsx" />
-    <File name="Input.tsx" />
-  </Folder>
-</Files>
-```
-
-## Best Practices
-
-1. Keep the nesting level reasonable (recommended max 3-4 levels deep)
-2. Use clear and descriptive names for files and folders
-3. Consider the user experience when displaying large file structures
-4. Use consistent naming conventions throughout your file tree
-
-## Accessibility
-
-The File Tree component includes built-in accessibility features:
-
-- Keyboard navigation support
-- ARIA attributes for screen readers
-- Focus management for interactive elements
-- High contrast mode support

package/src/dist/contents/docs/components/image/index.mdx

@@ -1,37 +0,0 @@
----
-title: Image
-description: A component used to display images in Markdown.
-date: 14-12-2024
----
-
-In DocuBook, all images written in Markdown are automatically converted to their respective Next.js components. This allows for better optimization and performance in your application.
-
-## Images
-
-Similarly, images in Markdown are transformed into the Next.js `Image` component. This allows for automatic image optimization, such as lazy loading and resizing, which enhances performance and user experience. Here’s an example:
-
-### Markdown
-
-```markdown
-![Alt text for the image](https://via.placeholder.com/150)
-```
-
-### Rendered Output
-
-The above Markdown is converted to:
-
-```jsx
-<Image
-  src="https://via.placeholder.com/150"
-  alt="Alt text for the image"
-  width={800}
-  height={350}
-/>
-```
-
-## Benefits
-
-- **Performance Optimization**: Automatic conversion to Next.js components ensures optimized loading of images.
-- **Responsive Images**: Next.js `Image` component handles responsive images, providing the best quality for various device sizes.
-
-By utilizing these features, you can ensure that your documentation is not only visually appealing but also performs efficiently.

package/src/dist/contents/docs/components/index.mdx

@@ -1,9 +0,0 @@
----
-title: Components
-description: This section provides an overview of the custom components available in DocuBook.
-date: 29-11-2024
----
-
-Explore the custom components we've defined for easy integration and development within your projects. Each component is designed to enhance your workflow and streamline your development process.
-
-<Outlet path="components" />

package/src/dist/contents/docs/components/keyboard/index.mdx

@@ -1,117 +0,0 @@
----
-title: Keyboard
-description: Display keyboard keys with platform-specific styling for Windows and macOS.
-date : 19-05-2025
----
-
-The `Keyboard` component automatically renders platform-appropriate key symbols for macOS and Windows. It's perfect for documenting keyboard shortcuts in your application.
-
-## Usage
-
-### Basic Usage
-
-Simply use the `Kbd` component with a `show` prop:
-
-```tsx
-<Kbd show="cmd" type="mac" /> + <Kbd show="c" />
-```
-
-Renders as:
-<Kbd show="cmd" type="mac" /> + <Kbd show="c" />
-
-### Automatic Symbol Rendering
-
-The component automatically renders appropriate symbols based on the platform:
-
-```tsx
-{/* Windows style (default) */}
-<Kbd show="ctrl" /> + <Kbd show="v" />
-
-{/* Mac style */}
-<Kbd show="cmd" type="mac" /> + <Kbd show="v" type="mac" />
-```
-
-Renders as:
-- Windows: <Kbd show="ctrl" type="window" /> + <Kbd show="v" type="window" />
-- Mac: <Kbd show="cmd" type="mac" /> + <Kbd show="v" type="mac" />
-
-### Custom Content
-
-For custom key labels, provide children:
-
-```tsx
-<Kbd show="custom">Custom</Kbd>
-```
-
-Renders as: <Kbd show="custom">Custom</Kbd>
-
-## Props
-
-| Prop      | Type                | Default    | Description |
-|-----------|---------------------|------------|-------------|
-| `show`    | string            | (required) | The key identifier (e.g., 'cmd', 'ctrl', 'a') |
-| `type`    | string | `window` | for device type `mac` or `window` | Platform style or custom content |
-| `children`| ReactNode         | -          | Custom content to display (overrides automatic rendering) |
-
-## Supported Keys
-
-The component includes special handling for common keys:
-
-| Key Name    | Windows | macOS |
-|-------------|---------|-------|
-| command/cmd | `Win`   | `⌘`   |
-| option/alt  | `Alt`   | `⌥`   |
-| shift       | `Shift` | `⇧`   |
-| ctrl/control| `Ctrl`  | `⌃`   |
-| tab         | `Tab`   | `⇥`   |
-| enter/return| `Enter` | `⏎`   |
-| delete      | `Del`   | `⌫`   |
-| escape/esc  | `Esc`   | `⎋`   |
-| up/down/left/right  | `↑` `↓` `←` `→` | `↑` `↓` `←` `→` |
-| space       | `Space` | `␣`   |
-
-## Examples
-
-### Common Shortcuts
-
-```tsx
-{/* Copy shortcut */}
-<Kbd show="ctrl" /> + <Kbd show="c" />
-
-{/* Paste shortcut */}
-<Kbd show="cmd" type="mac" /> + <Kbd show="v" type="mac" />
-
-{/* Save shortcut */}
-<Kbd show="ctrl" /> + <Kbd show="s" />
-```
-
-### Custom Key Combinations
-
-```tsx
-{/* Custom application shortcut */}
-<Kbd show="cmd" type="mac" /> + <Kbd show="option" type="mac" /> + <Kbd show="a" type="mac"/>
-```
-
-Render as: <Kbd show="cmd" type="mac" /> + <Kbd show="option" type="mac" /> + <Kbd show="a" type="mac"/>
-
-### Arrow Key
-
-```tsx
-<Kbd show="up" /> <Kbd show="down" /> <Kbd show="left" /> <Kbd show="right" />
-```
-
-Render as: <Kbd show="up" /> <Kbd show="down" /> <Kbd show="left" /> <Kbd show="right" />
-
-## Best Practices
-
-1. **Be Consistent**: Stick to one platform style within the same context
-2. **Use Type Wisely**:
-   - Use `type="mac"` for Mac-specific documentation
-   - Use `type="window"` (default) for Windows/Linux
-3. **Accessibility**: The component uses semantic `<kbd>` HTML for better accessibility
-
-## Notes
-
-- The component automatically capitalizes single letters (e.g., 'a' becomes 'A')
-- Unrecognized keys are displayed as-is
-- Dark mode is automatically supported through Tailwind's dark mode classes

package/src/dist/contents/docs/components/link/index.mdx

@@ -1,34 +0,0 @@
----
-title: Link
-description: A component used to create links that can be used to navigate to other pages.
-date: 14-12-2024
----
-
-In DocuBook, all links written in Markdown are automatically converted to their respective Next.js components. This allows for better optimization and performance in your application.
-
-## Links
-
-When you create a link in your Markdown, it is converted to the Next.js `Link` component. This enables client-side navigation and improves loading times. Here’s an example of how a Markdown link is transformed:
-
-### Markdown
-
-```markdown
-[Visit OpenAI](https://www.openai.com)
-```
-
-### Rendered Output
-
-The above Markdown is converted to:
-
-```jsx
-<Link href="https://www.openai.com" target="_blank" rel="noopener noreferrer">
-  Visit OpenAI
-</Link>
-```
-
-## Benefits
-
-- **Performance Optimization**: Automatic conversion to Next.js components ensures optimized loading of links.
-- **Improved User Experience**: Client-side navigation with Next.js `Link` improves the browsing experience.
-
-By utilizing these features, you can ensure that your documentation is not only visually appealing but also performs efficiently.

package/src/dist/contents/docs/components/note/index.mdx

@@ -1,44 +0,0 @@
----
-title: Note
-description: A component used to display different types of messages such as general notes, warnings, or success notifications.
-date: 14-12-2024
----
-
-## Preview
-
-<Note type="note" title="Note">
-  This is a general note to convey information to the user.
-</Note>
-<Note type="danger" title="Danger">
-  This is a danger alert to notify the user of a critical issue.
-</Note>
-<Note type="warning" title="Warning">
-  This is a warning alert for issues that require attention.
-</Note>
-<Note type="success" title="Success">
-  This is a success message to inform the user of successful actions.
-</Note>
-
-## Props
-
-| Prop    | Type                                           | Default | Description                              |
-| ------- | ---------------------------------------------- | ------- | ---------------------------------------- |
-| `title` | string                                       | "Note"  | Sets the title of the note.              |
-| `type`  | "note" "danger" "success" "warning" | undefined | Determines the visual style of the note. |
-
-## Output Markdown
-
-```markdown
-<Note type="note" title="Note">
-  This is a general note to convey information to the user.
-</Note>
-<Note type="danger" title="Danger">
-  This is a danger alert to notify the user of a critical issue.
-</Note>
-<Note type="warning" title="Warning">
-  This is a warning alert for issues that require attention.
-</Note>
-<Note type="success" title="Success">
-  This is a success message to inform the user of successful actions.
-</Note>
-```

package/src/dist/contents/docs/components/release-note/index.mdx

@@ -1,130 +0,0 @@
----
-title: Release Note
-description: The Release Note component makes it easy for you to write updates for each version of your application.
-date: 31-12-2024
----
-
-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.
-
-## Basic Usage
-
-Here is a basic example of using the Release Note component:
-
-```markdown
-<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 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>
-
-## Release Component
-
-The `Release` component is used to display key information about a release version, such as version number, release date, and title.
-
-### Release Props
-
-| 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 |
-
-```markdown
-<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>`

package/src/dist/contents/docs/components/stepper/index.mdx

@@ -1,45 +0,0 @@
----
-title: Stepper
-description: A component used to display step-by-step instructions directly within the markdown render.
-date: 14-12-2024
----
-
-In this guide, we utilize a custom `Stepper` component, specifically designed for DocuBook, which enables users to display step-by-step instructions directly within the markdown render.
-
-## Preview
-
-<Stepper>
-  <StepperItem title="Step 1: Clone the DocuBook Repository">
-    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec interdum,
-    felis sed efficitur tincidunt, justo nulla viverra enim, et maximus nunc
-    dolor in lorem.
-  </StepperItem>
-  <StepperItem title="Step 2: Access the Project Directory">
-    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin non neque ut
-    eros auctor accumsan. Mauris a nisl vitae magna ultricies aliquam.
-  </StepperItem>
-  <StepperItem title="Step 3: Install Required Dependencies">
-    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ut
-    ipsum nec nulla ultricies porttitor et non justo.
-  </StepperItem>
-</Stepper>
-
-## Output Markdown
-
-```markdown
-<Stepper>
-  <StepperItem title="Step 1: Clone the DocuBook Repository">
-    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec interdum,
-    felis sed efficitur tincidunt, justo nulla viverra enim, et maximus nunc
-    dolor in lorem.
-  </StepperItem>
-  <StepperItem title="Step 2: Access the Project Directory">
-    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin non neque ut
-    eros auctor accumsan. Mauris a nisl vitae magna ultricies aliquam.
-  </StepperItem>
-  <StepperItem title="Step 3: Install Required Dependencies">
-    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ut
-    ipsum nec nulla ultricies porttitor et non justo.
-  </StepperItem>
-</Stepper>
-```

package/src/dist/contents/docs/components/tabs/index.mdx

@@ -1,70 +0,0 @@
----
-title: Tabs
-description: Organize content into multiple sections with switchable tabs.
-date: 14-12-2024
----
-
-The `Tabs` component allows you to organize content into multiple sections, enabling users to switch between them easily. This is particularly useful for displaying related content in a compact manner.
-
-## Preview
-
-<Tabs defaultValue="java" className="pt-5 pb-1">
-  <TabsList>
-    <TabsTrigger value="java">Java</TabsTrigger>
-    <TabsTrigger value="typescript">TypeScript</TabsTrigger>
-  </TabsList>
-  <TabsContent value="java">
-    ```java
-    // HelloWorld.java
-    public class HelloWorld {
-        public static void main(String[] args) {
-            System.out.println("Hello, World!");
-        }
-    }
-    ```
-  </TabsContent>
-  <TabsContent value="typescript">
-    ```typescript
-    // helloWorld.ts
-    function helloWorld(): void {
-        console.log("Hello, World!");
-    }
-    helloWorld();
-    ```
-  </TabsContent>
-</Tabs>
-
-## Props
-
-| Prop           | Type     | Default | Description                                            |
-| -------------- | -------- | ------- | ------------------------------------------------------ |
-| `defaultValue` | string   | null    | The value of the tab that is selected by default.      |
-| `className`    | string   | null    | Additional CSS classes for styling the Tabs component. |
-
-## Output Markdown
-
-````plaintext
-<Tabs defaultValue="java" className="pt-5 pb-1">
-  <TabsList>
-    <TabsTrigger value="java">Java</TabsTrigger>
-    <TabsTrigger value="typescript">TypeScript</TabsTrigger>
-  </TabsList>
-  <TabsContent value="java">
-    ```java
-    // HelloWorld.java
-    public class HelloWorld {
-        public static void main(String[] args) {
-            System.out.println("Hello, World!");
-        }
-    }
-    ```</TabsContent>
-  <TabsContent value="typescript">
-    ```typescript
-    // helloWorld.ts
-    function helloWorld(): void {
-        console.log("Hello, World!");
-    }
-    helloWorld();
-    ```</TabsContent>
-</Tabs>
-````

package/src/dist/contents/docs/components/tooltips/index.mdx

@@ -1,22 +0,0 @@
----
-title: Tooltips
-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 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.
-
-### Preview
-
-What do you know about <Tooltip text="DocuBook" tip="npx @docubook/create@latest" /> ? Create interactive nested documentations using MDX.
-
-### Output Markdown
-
-The above Markdown is converted to:
-
-```markdown:index.mdx
-What do you know about <Tooltip text="DocuBook" tip="npx @docubook/create@latest" /> ? Create interactive nested documentations using MDX.
-```

package/src/dist/contents/docs/components/youtube/index.mdx

@@ -1,23 +0,0 @@
----
-title: Youtube
-description: A component used to embed YouTube videos directly into your documentation.
-date: 14-12-2024
----
-
-I have implemented a `YouTube` component for your documentation. This component allows you to easily embed YouTube videos directly into your documentation by simply inputting the video's ID.
-
-## Preview
-
-<Youtube videoId="8sM0Di7Ew9Q" />
-
-## Output Markdown
-
-```markdown
-<Youtube videoId="8sM0Di7Ew9Q" />
-```
-
-## Usage
-
-<Note type="note" title="Usage">
-  for example the youtube URL show this https://www.youtube.com/watch?v=8sM0Di7Ew9Q the ID `8sM0Di7Ew9Q`
-</Note>