@mgks/docmd 0.3.1 → 0.3.3

package/docs/content/containers/nested-containers.md

@@ -1,329 +0,0 @@
----
-title: "Nested Containers"
-description: "Learn how to use the advanced nested container system to create complex, interactive documentation layouts with seamless container nesting."
----
-
-# Nested Containers
-
-The advanced nested container system in docmd allows you to create complex, interactive documentation layouts by nesting containers within each other. This powerful feature enables you to build rich, structured content that was previously impossible.
-
-## Overview
-
-With docmd v0.2.0, you can nest containers seamlessly:
-
-- **Cards within Tabs** - Organize content into structured sections within tabs
-- **Callouts within Cards** - Add informational content within structured cards
-- **Buttons within Any Container** - Place action buttons in any context
-- **Multiple Levels of Nesting** - Support for complex nested structures up to 7+ levels
-- **Steps for Simple Sequences** - Use steps containers for straightforward, sequential instructions
-
-## Container Nesting Rules
-
-### Supported Nesting Combinations
-
-| Container | Can Nest Inside | Can Contain |
-|-----------|----------------|-------------|
-| **Callouts** | Any container | Any container |
-| **Cards** | Any container | Any container |
-| **Buttons** | Any container | None (self-closing) |
-| **Steps** | Any container (except tabs) | Any container (except tabs) |
-| **Tabs** | Any container (except steps) | Any container (except tabs, steps) |
-
-### Nesting Best Practices
-
-1. **Logical Structure** - Nest containers in a way that makes logical sense
-2. **Readability** - Don't nest too deeply (3-4 levels maximum for readability)
-3. **Performance** - Complex nesting is supported but keep it reasonable
-4. **Content Organization** - Use nesting to organize related content
-5. **Use the Right Tool** - Use steps for simple sequences, cards/tabs for complex content
-
-### Nesting Limitations
-
-::: callout error Known Issues
-**Steps ↔ Tabs Incompatibility:** Steps and tabs containers cannot be nested within each other due to parsing complexity. Use them as separate sections instead.
-:::
-
-- **Tabs cannot contain tabs** - This prevents infinite recursion
-- **Tabs cannot contain steps** - Due to parsing conflicts with markdown processing
-- **Steps cannot contain tabs** - Due to parsing complexity 
-- **Steps cannot be inside tabs** - Due to container recognition issues
-- **Maximum depth** - While technically unlimited, keep it under 7 levels for readability
-- **Performance** - Very deep nesting may impact rendering performance
-
-## Basic Nesting Examples
-
-### Cards with Nested Content
-
-```bash
-::: card Installation Guide
-
-Here's how to install the application:
-
-::: callout tip Pro Tip
-Make sure to download the correct version for your platform.
-:::
-
-::: button Download_Now /downloads
-
-:::
-```
-
-::: card Installation Guide
-
-Here's how to install the application:
-
-::: callout tip Pro Tip
-Make sure to download the correct version for your platform.
-:::
-
-::: button Download_Now /downloads
-
-:::
-
-### Tabs with Nested Content
-
-```bash
-::: tabs
-
-== tab "Windows"
-Download the Windows installer (.exe) file.
-
-::: callout tip
-Make sure to run as administrator for best results.
-:::
-
-::: button Download_Windows /downloads/windows
-
-== tab "macOS"
-Download the macOS package (.pkg) file.
-
-::: callout warning
-You may need to allow the app in Security & Privacy settings.
-:::
-
-::: button Download_macOS /downloads/macos
-
-== tab "Linux"
-Download the Linux tarball (.tar.gz) file.
-
-::: button Download_Linux /downloads/linux
-
-:::
-```
-
-::: tabs
-
-== tab "Windows"
-Download the Windows installer (.exe) file.
-
-::: callout tip
-Make sure to run as administrator for best results.
-:::
-
-::: button Download_Windows /downloads/windows
-
-== tab "macOS"
-Download the macOS package (.pkg) file.
-
-::: callout warning
-You may need to allow the app in Security & Privacy settings.
-:::
-
-::: button Download_macOS /downloads/macos
-
-== tab "Linux"
-Download the Linux tarball (.tar.gz) file.
-
-::: button Download_Linux /downloads/linux
-
-:::
-
-## Advanced Nesting Patterns
-
-### Complex Nested Structure
-
-````bash
-::: card Installation Guide
-
-**Download**
-Get the latest version for your platform.
-
-::: button Download_Now /downloads
-
-**Install**
-Run the installer and follow the prompts.
-
-```bash
-install docmd
-```
-
-**Configure**
-Set up your preferences.
-
-::: callout warning Important
-Don't forget to configure your settings!
-:::
-
-:::
-````
-
-::: card Installation Guide
-
-**Download**
-Get the latest version for your platform.
-
-::: button Download_Now /downloads
-
-**Install**
-Run the installer and follow the prompts.
-
-```bash
-install docmd
-```
-
-**Configure**
-Set up your preferences.
-
-::: callout warning Important
-Don't forget to configure your settings!
-:::
-
-:::
-
-### Cards with Multiple Nested Elements
-
-```markdown
-::: card API Reference
-
-::: callout info API Key Required
-All API requests require a valid API key.
-:::
-
-**Setup Steps**
-
-1. Get your API key from the dashboard
-2. Include it in your request headers
-3. Test your connection
-
-::: button Test_API /api/test
-
-:::
-```
-
-::: card API Reference
-
-::: callout info API Key Required
-All API requests require a valid API key.
-:::
-
-**Setup Steps**
-
-1. Get your API key from the dashboard
-2. Include it in your request headers
-3. Test your connection
-
-::: button Test_API /api/test
-
-:::
-
-## Steps Container
-
-Steps containers are designed for simple, sequential instructions and work well with other containers:
-
-```bash
-::: steps
-
-1. **Download the Application**
-   Get the latest version from our download page.
-
-   ::: button Download_Now /downloads
-
-2. **Install the Application**
-   Run the installer and follow the setup wizard.
-
-   ::: callout tip Pro Tip
-   Check our system requirements page for detailed information.
-   :::
-
-3. **Configure Settings**
-   Set up your preferences and start using the app.
-
-   ::: card Configuration
-   - Choose your theme
-   - Set up notifications
-   - Configure integrations
-   :::
-
-:::
-```
-
-::: steps
-
-1. **Download the Application**
-   Get the latest version from our download page.
-
-   ::: button Download_Now /downloads
-
-2. **Install the Application**
-   Run the installer and follow the setup wizard.
-
-   ::: callout tip Pro Tip
-   Check our system requirements page for detailed information.
-   :::
-
-3. **Configure Settings**
-   Set up your preferences and start using the app.
-
-   ::: card Configuration
-   - Choose your theme
-   - Set up notifications
-   - Configure integrations
-   :::
-
-:::
-
-## Troubleshooting
-
-### Common Issues
-
-1. **Container not rendering** - Ensure proper spacing and syntax
-2. **Nested content not showing** - Check for proper closing tags
-3. **Performance issues** - Reduce nesting depth if experiencing slowdowns
-
-### Debugging Tips
-
-- **Check syntax** - Ensure all containers have proper opening and closing tags
-- **Verify nesting** - Make sure containers are properly nested
-- **Test incrementally** - Build complex structures step by step
-- **Use browser dev tools** - Inspect the generated HTML for issues
-- **Use the right container** - Steps for simple sequences, cards/tabs for complex content
-
-## Migration from v0.1.x
-
-### Breaking Changes
-
-- **Container parsing** - The internal parsing system has been optimized for reliability
-- **Nesting behavior** - Most containers support seamless nesting
-
-### What's New
-
-- **Enhanced nesting** - Cards, tabs, callouts, and buttons support seamless nesting
-- **Better performance** - Improved parsing performance for complex structures
-- **Clear limitations** - Well-defined boundaries for what each container can do
-
-### Backward Compatibility
-
-- **Existing syntax** - All existing container syntax remains the same
-- **Enhanced functionality** - New nesting capabilities are additive for supported containers
-
-## Future Container Types
-
-The nested container system is designed to be easily extensible. Future container types that could be added include:
-
-- **Timeline containers** - For chronological content
-- **Changelog containers** - For version history
-- **FAQ containers** - For question-answer content
-- **Gallery containers** - For image collections
-- **Code playground containers** - For interactive code examples
-
-The architecture supports adding new containers by simply defining them in the containers object and implementing their render functions. 

package/docs/content/containers/steps.md

@@ -1,175 +0,0 @@
----
-title: "Steps Container"
-description: "Create step-by-step instructions and tutorials with the steps container."
----
-
-# Steps Container
-
-The steps container allows you to create clear, sequential instructions and tutorials. It automatically numbers your steps and provides a clean, organized layout.
-
-## Basic Usage
-
-**Code:**
-
-```markdown
-::: steps
-
-1. **Create a new project**
-   Initialize your project with the necessary configuration files.
-
-2. **Install dependencies**
-   Run the package manager to install required libraries.
-
-3. **Start development**
-   Begin coding your application with the setup complete.
-
-   ::: button Learn_More #customization color:green
-
-:::
-```
-
-**Rendered Preview:**
-
-::: steps
-
-1. **Create a new project**
-   Initialize your project with the necessary configuration files.
-
-2. **Install dependencies**
-   Run the package manager to install required libraries.
-
-3. **Start development**
-   Begin coding your application with the setup complete.
-
-   ::: button Learn_More #customization color:green
-
-:::
-
-## Steps with Nested Containers
-
-You can include cards, callouts, and buttons inside steps for richer content:
-
-**Code:**
-
-```markdown
-::: steps
-
-1. **Plan Your Project**
-   Define the scope and requirements for your application.
-
-   ::: callout info Planning Tip
-   Consider creating user stories to better understand your requirements.
-   :::
-
-2. **Setup Development Environment**
-   Configure your local development tools and workspace.
-
-   ::: card Environment Checklist
-   - Install code editor (VS Code recommended)
-   - Setup version control (Git)
-   - Install Node.js and npm
-   - Configure linting and formatting tools
-   :::
-
-3. **Initialize Project**
-   Create the project structure and configuration files.
-
-   ::: button Create_Project external:https://github.com/new color:#2564e4
-
-4. **Start Coding**
-   Begin implementing your application features.
-
-   ::: callout success Ready to Code
-   Your development environment is now ready! Happy coding!
-   :::
-
-:::
-```
-
-**Rendered Preview:**
-
-::: steps
-
-1. **Plan Your Project**
-   Define the scope and requirements for your application.
-
-   ::: callout info Planning Tip
-   Consider creating user stories to better understand your requirements.
-   :::
-
-2. **Setup Development Environment**
-   Configure your local development tools and workspace.
-
-   ::: card Environment Checklist
-   - Install code editor (VS Code recommended)
-   - Setup version control (Git)
-   - Install Node.js and npm
-   - Configure linting and formatting tools
-   :::
-
-3. **Initialize Project**
-   Create the project structure and configuration files.
-
-   ::: button Create_Project external:https://github.com/new color:#2564e4
-
-4. **Start Coding**
-   Begin implementing your application features.
-
-   ::: callout success Ready to Code
-   Your development environment is now ready! Happy coding!
-   :::
-
-:::
-
-## Steps and Tabs Compatibility
-
-::: callout error Important Limitation
-**Steps and tabs containers are incompatible** - they cannot be nested within each other due to markdown parsing conflicts. Use them as separate sections instead.
-
-**Supported in steps:** Cards, callouts, buttons  
-**Not supported:** Tabs containers
-:::
-
-**Code:**
-
-```markdown
-## Installation Steps
-
-::: steps
-
-1. **Choose Your Platform**
-   Select the appropriate installation method for your operating system.
-
-2. **Download the Installer**
-   Get the latest version from the downloads section.
-
-3. **Run Installation**
-   Follow the setup wizard to complete installation.
-
-:::
-
-## Platform-Specific Instructions
-
-::: tabs
-== tab "Windows"
-Download the `.exe` installer and run as administrator.
-
-::: button Learn_More #customization
-
-== tab "macOS" 
-Download the `.dmg` file and drag to Applications folder.
-
-::: button Learn_More #customization
-
-:::
-```
-
-## Customization
-
-Steps containers automatically apply consistent styling and numbering. The container handles:
-
-- **Automatic numbering** - Steps are numbered sequentially
-- **Consistent spacing** - Proper spacing between steps
-- **Responsive design** - Works on all screen sizes
-- **Theme integration** - Matches your site's theme
-- **Smart list handling** - Only step items get special styling, nested lists remain normal

package/docs/content/containers/tabs.md

@@ -1,228 +0,0 @@
----
-title: "Tabs Container"
-description: "Create tabbed content sections with the tabs container for organizing related information."
----
-
-# Tabs Container
-
-The tabs container allows you to organize content into multiple tabbed sections, making it easy to present related information in a clean, organized way.
-
-## Basic Usage
-
-```markdown
-::: tabs
-
-== tab "First Tab"
-Content for the first tab goes here.
-
-== tab "Second Tab"
-Content for the second tab goes here.
-
-== tab "Third Tab"
-Content for the third tab goes here.
-
-:::
-```
-
-::: tabs
-
-== tab "First Tab"
-Content for the first tab goes here.
-
-== tab "Second Tab"
-Content for the second tab goes here.
-
-== tab "Third Tab"
-Content for the third tab goes here.
-
-:::
-
-## Tabs with Nested Content
-
-### Tabs with Buttons
-
-```markdown
-::: tabs
-
-== tab "Download"
-Get the latest version of our application.
-
-::: button Download_Here external:https://github.com/mgks/docmd/releases
-::: button Learn_More #advanced-tabs
-::: button NPM_Package external:https://www.npmjs.com/package/@mgks/docmd
-
-== tab "Documentation"
-Read our comprehensive documentation.
-
-::: button View_Getting_Started #basic-usage
-::: button API_Reference external:https://github.com/mgks/docmd/wiki
-::: button View_Examples #advanced-tabs
-
-:::
-```
-
-::: tabs
-
-== tab "Download"
-Get the latest version of our application.
-
-::: button Download_Here external:https://github.com/mgks/docmd/releases
-::: button Learn_More #advanced-tabs
-::: button NPM_Package external:https://www.npmjs.com/package/@mgks/docmd
-
-== tab "Documentation"
-Read our comprehensive documentation.
-
-::: button View_Getting_Started #basic-usage
-::: button API_Reference external:https://github.com/mgks/docmd/wiki
-::: button View_Examples #advanced-tabs
-
-:::
-
-### Tabs with Callouts
-
-```markdown
-::: tabs
-
-== tab "Getting Started"
-Welcome to our platform!
-
-::: callout info Welcome
-This is your first time here. Let's get you started!
-:::
-
-::: callout tip Pro Tip
-Check out our quick start guide for the fastest setup.
-:::
-
-== tab "Advanced Features"
-Explore advanced functionality.
-
-::: callout warning Important
-Some features require additional configuration.
-:::
-
-::: callout success Ready
-You're all set to explore advanced features!
-:::
-
-:::
-```
-
-::: tabs
-
-== tab "Getting Started"
-Welcome to our platform!
-
-::: callout info Welcome
-This is your first time here. Let's get you started!
-:::
-
-::: callout tip Pro Tip
-Check out our quick start guide for the fastest setup.
-:::
-
-== tab "Advanced Features"
-Explore advanced functionality.
-
-::: callout warning Important
-Some features require additional configuration.
-:::
-
-::: callout success Ready
-You're all set to explore advanced features!
-:::
-
-:::
-
-## Complex Nested Structure
-
-````bash
-::: tabs
-
-== tab "Nested Card Example"
-::: card Installation Guide
-
-**Download**
-Get the latest version for your platform.
-
-::: button Get_Latest external:https://github.com/mgks/docmd/releases
-
-**Install**
-Run the installer and follow the prompts.
-
-```bash
-install docmd
-```
-
-:::
-
-== tab "Callout Example"
-
-**Configure**
-Set up your preferences.
-
-::: callout warning Configuration
-Don't forget to configure your settings!
-:::
-
-:::
-````
-
-::: tabs
-
-== tab "Nested Card Example"
-::: card Installation Guide
-
-**Download**
-Get the latest version for your platform.
-
-::: button Get_Latest external:https://github.com/mgks/docmd/releases
-
-**Install**
-Run the installer and follow the prompts.
-
-```bash
-install docmd
-```
-
-:::
-
-== tab "Callout Example"
-
-**Configure**
-Set up your preferences.
-
-::: callout warning Configuration
-Don't forget to configure your settings!
-:::
-
-:::
-
-## Customization
-
-Tabs containers automatically handle:
-
-- **Responsive design** - Works on all screen sizes
-- **Theme integration** - Matches your site's theme
-- **Accessibility** - Proper ARIA labels and keyboard navigation
-- **Smooth transitions** - Elegant tab switching animations
-
-## Best Practices
-
-1. **Clear Labels** - Use descriptive tab names
-2. **Consistent Content** - Keep similar content types in each tab
-3. **Logical Order** - Arrange tabs in a logical sequence
-4. **Not Too Many** - Limit to 5-7 tabs for best usability
-5. **Mobile Friendly** - Consider mobile users when organizing content
-
-## Nesting Limitations
-
-::: callout error Important Limitation
-**Steps containers cannot be used inside tabs** due to parsing conflicts. If you need step-by-step instructions within tabs, use regular numbered lists or consider restructuring your content.
-:::
-
-- **Tabs cannot contain tabs** - This prevents infinite recursion
-- **Steps inside tabs not supported** - Use regular ordered lists instead
-- **Maximum depth** - While technically unlimited, keep it under 7 levels for readability
-- **Performance** - Very deep nesting may impact rendering performance