react-vite-themes/dist/utils/documentationLoader.js

A test/experimental React theme system created for learning purposes. Features atomic design components, SCSS variables, and dark/light theme support. Not intended for production use.

/**
 * Documentation Loader Utility
 *
 * This utility automatically loads and joins all .md files from the atoms components
 * using the raw-loader approach (Method 1).
 */
/**
 * Loads all .md files from atoms components and joins them into one comprehensive document
 */
export const loadAtomsDocumentation = async () => {
    try {
        // Import all .md files using raw-loader
        const navbarDoc = await import('../components/atoms/Navbar/USAGE.md?raw');
        const statCardDoc = await import('../components/atoms/StatCard/README.md?raw');
        // Define component documentation
        const components = [
            {
                componentName: 'Navbar',
                content: navbarDoc.default,
                filePath: 'src/components/atoms/Navbar/USAGE.md'
            },
            {
                componentName: 'StatCard',
                content: statCardDoc.default,
                filePath: 'src/components/atoms/StatCard/README.md'
            }
        ];
        // Generate table of contents
        const tableOfContents = components.map(comp => comp.componentName);
        // Join all content
        const fullContent = generateFullDocumentation(components);
        return {
            title: 'React Theme System - Atoms Components Documentation',
            tableOfContents,
            components,
            fullContent
        };
    }
    catch (error) {
        console.error('Error loading documentation:', error);
        throw new Error('Failed to load documentation files');
    }
};
/**
 * Generates the full documentation content by joining all component docs
 */
const generateFullDocumentation = (components) => {
    let content = `# React Theme System - Atoms Components Documentation

This document contains comprehensive documentation for all atoms components in the React Theme System.

---

## Table of Contents

${components.map((comp, index) => `${index + 1}. [${comp.componentName} Component](#${comp.componentName.toLowerCase()}-component)`).join('\n')}

---

`;
    // Add each component's documentation
    components.forEach((component, index) => {
        content += `## ${component.componentName} Component

${component.content}

${index < components.length - 1 ? '---\n\n' : ''}`;
    });
    // Add footer
    content += `## Additional Components

This documentation will be updated as more components are added to the atoms library. Each component will include:

- Overview and features
- Basic usage examples
- Complete props documentation
- Advanced examples and use cases
- Styling and customization options
- Accessibility considerations

---

*Last updated: ${new Date().toLocaleDateString()}*
*Generated automatically from component documentation files*
`;
    return content;
};
/**
 * Saves the joined documentation to a file
 */
export const saveJoinedDocumentation = async () => {
    try {
        const documentation = await loadAtomsDocumentation();
        // In a real implementation, you would write to a file
        // For now, we'll return the content that can be saved
        console.log('Documentation loaded successfully!');
        console.log(`Found ${documentation.components.length} component documentation files`);
        return documentation.fullContent;
    }
    catch (error) {
        console.error('Error saving documentation:', error);
        throw error;
    }
};
/**
 * Get documentation for a specific component
 */
export const getComponentDocumentation = async (componentName) => {
    try {
        const documentation = await loadAtomsDocumentation();
        return documentation.components.find(comp => comp.componentName.toLowerCase() === componentName.toLowerCase()) || null;
    }
    catch (error) {
        console.error(`Error loading documentation for ${componentName}:`, error);
        return null;
    }
};
/**
 * Get list of all documented components
 */
export const getDocumentedComponents = async () => {
    try {
        const documentation = await loadAtomsDocumentation();
        return documentation.components.map(comp => comp.componentName);
    }
    catch (error) {
        console.error('Error getting documented components:', error);
        return [];
    }
};