renusify 2.5.1 → 3.0.0

package/scripts/generate-docs.mjs

@@ -0,0 +1,226 @@
+import fs from 'fs';
+import path from 'path';
+import {VueComponentAPIParser} from './parser.mjs';
+import {MenuBuilder} from "./menu.mjs";
+
+function extractExportPaths(text) {
+    const paths = [];
+
+    const exportRegex = /export\s*\*\s*as\s+(\w+)\s+from\s+['"]([^'"]+)['"]/g;
+
+    let match;
+    while ((match = exportRegex.exec(text)) !== null) {
+        paths.push({
+            alias: match[1],
+            path: match[2]
+        });
+    }
+
+    return paths;
+}
+
+function build_directives() {
+    const componentFiles = fs.readFileSync('./directive/index.js', 'utf-8')
+    const simplePaths = extractExportPaths(componentFiles);
+    const builder = new MenuBuilder();
+
+    for (let i = 0; i < simplePaths.length; i++) {
+        const name = (simplePaths[i]['alias'])
+
+        let file_path = "./docs/src/views/index/directive"
+        simplePaths[i]['path'].replace('./', '').split("/").forEach(path => {
+            if (path !== "index.js") {
+                file_path += "/" + path.replace('.js', '')
+            }
+        })
+        builder.addPath(simplePaths[i]['path'])
+
+        let p = simplePaths[i]['path'].replace('./', './directive/');
+
+        const vueFile = fs.readFileSync(p, 'utf-8')
+
+        const componentInfo = VueComponentAPIParser.parse(vueFile)
+
+        create_component_directive(name, file_path + '/index.vue', componentInfo)
+    }
+
+    const menu = builder.build('directive');
+
+    let menu_file = JSON.parse(fs.readFileSync('./docs/src/views/index/menu/menu.json', 'utf-8'))
+    menu_file.forEach((item) => {
+        if (item.name === 'directive') {
+            item.childs = menu
+        }
+    })
+    fs.writeFileSync('./docs/src/views/index/menu/menu.json', JSON.stringify(menu_file, null, 2), 'utf8');
+
+}
+
+function build_components() {
+    const componentFiles = fs.readFileSync('./components/index.js', 'utf-8')
+    const simplePaths = extractExportPaths(componentFiles);
+    const builder = new MenuBuilder();
+
+    for (let i = 0; i < simplePaths.length; i++) {
+        const name = (simplePaths[i]['alias'])
+        console.log(name)
+        let file_path = "./docs/src/views/index/component"
+        simplePaths[i]['path'].replace('./', '').split("/").forEach(path => {
+            if (path !== "index.js") {
+                file_path += "/" + path.replace('.js', '')
+            }
+        })
+        builder.addPath(simplePaths[i]['path'])
+
+        let p = simplePaths[i]['path'].replace('./', './components/').replace('.js', '.vue');
+        if (name === 'rMeta') {
+            p = "./components/meta/meta.js";
+        }
+        const vueFile = fs.readFileSync(p, 'utf-8')
+
+        const componentInfo = VueComponentAPIParser.parse(vueFile)
+
+        create_component(name, file_path + '/index.vue', componentInfo)
+    }
+
+    const menu = builder.build();
+    let menu_file = JSON.parse(fs.readFileSync('./docs/src/views/index/menu/menu.json', 'utf-8'))
+    menu_file.forEach((item) => {
+        if (item.name === 'component') {
+            item.childs = menu
+        }
+    })
+    fs.writeFileSync('./docs/src/views/index/menu/menu.json', JSON.stringify(menu_file, null, 2), 'utf8');
+
+}
+
+function create_component(component_name, file_path, componentInfo = {}) {
+    const dirPath = path.dirname(file_path);
+
+    if (!fs.existsSync(dirPath)) {
+        fs.mkdirSync(dirPath, {recursive: true});
+    }
+    if (Object.keys(componentInfo.example).length === 0) {
+        let scr = "import {ref} from 'vue';\n";
+        let tmp = "<" + component_name + " "
+        componentInfo.props.forEach(prop => {
+            if (prop.name === "modelValue") {
+                tmp += `\n v-model="${prop.name}"`
+            } else {
+                tmp += `\n :${prop.name}="${prop.name}"`
+            }
+            let d = prop.default !== "undefined" ? prop.default : null
+            if (prop.default !== "undefined") {
+                let types = prop.type.split("|")[0].trim()
+                if (types === "String") {
+                    d = "'" + prop.default + "'"
+                }
+            }
+
+            scr += `\nconst ${prop.name}=ref(${d})`
+        })
+        componentInfo.emits.forEach(emit => {
+            tmp += `\n@${emit.name}="log('${emit.name}',$event)"`
+        })
+        tmp += ">\n"
+        componentInfo.slots.forEach(slot => {
+            if (slot.example) {
+                tmp += `<template #${slot.name}>
+${slot.example}
+</template>\n`
+            }
+        })
+        tmp += "</" + component_name + ">"
+
+        componentInfo.example['basic usage'] = {
+            'template': tmp,
+            'script': scr + `\nconst log=(name,e)=>{
+        console.log(name,e)
+        }`
+        }
+
+    }
+    const template = `
+<template>
+  <section>
+    <r-meta title="${component_name} Component | Renusify" description="Document with example for Renusify ${component_name} component."></r-meta>
+    <div class="mb-2">
+      <h1 class="display-3 font-weight-light py-1 br-lg">
+       ${component_name} Component
+      </h1>
+    </div>
+    <table-props :items="info.props"></table-props>
+    <table-events :items="info.emits"></table-events>
+    <table-provide :items="info.provide"></table-provide>
+    <table-expose :items="info.expose"></table-expose>
+    <table-slots :items="info.slots"></table-slots>
+  </section>
+  <br/>
+  <section v-for="(item,i) in info.example" :key="i">
+    <div class="title-1">{{i}}</div>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        scriptSetup
+        :script='item.script'
+        :template='item.template'
+        :css='item.style'
+    >
+    </r-code-editor>
+  </section>
+</template>
+<script setup>
+const info=${JSON.stringify(componentInfo, null, 2)}
+</script>`;
+
+    fs.writeFileSync(file_path, template, 'utf8');
+
+    return true;
+
+}
+
+function create_component_directive(component_name, file_path, componentInfo = {}) {
+
+    const dirPath = path.dirname(file_path);
+
+    if (!fs.existsSync(dirPath)) {
+        fs.mkdirSync(dirPath, {recursive: true});
+    }
+
+    const template = `
+<template>
+  <section>
+    <div class="mb-2">
+      <h1 class="display-3 font-weight-light ps-4 pb-1 pt-1 br-lg">
+       ${component_name} Directive
+      </h1>
+    </div>
+  </section>
+  <br/>
+  <section v-for="(item,i) in info.example" :key="i">
+    <div class="title-1">{{i}}</div>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        scriptSetup
+        :script='item.script'
+        :template='item.template'
+        :css='item.style'
+    >
+    </r-code-editor>
+  </section>
+</template>
+<script setup>
+const info=${JSON.stringify(componentInfo, null, 2)}
+</script>`;
+
+    fs.writeFileSync(file_path, template, 'utf8');
+
+    return true;
+
+}
+
+
+build_components()
+build_directives()
+

package/scripts/menu.mjs

@@ -0,0 +1,240 @@
+export class MenuBuilder {
+    constructor() {
+        this.pathMap = new Map();
+        this.addOrder = []; // Track order of addition at root level
+    }
+
+    addPath(path) {
+        const normalizedPath = path.replace(/^\.\//, '').replace(/\/index\.js$/, '');
+        const parts = normalizedPath.split('/');
+
+        let currentLevel = this.pathMap;
+        let currentAddOrder = this.addOrder; // Track order at current level
+        let fullPath = '';
+
+        for (let i = 0; i < parts.length; i++) {
+            const part = parts[i];
+            const partName = part.replace(/([A-Z])/g, ' $1').replace(/\.js$/, '').toLowerCase().trim();
+            const partKey = part.replace(/\.js$/, '');
+            fullPath += (i > 0 ? '/' : '') + partKey;
+
+            if (i === parts.length - 1) {
+                // Leaf node (file)
+                if (!currentLevel.has(partKey)) {
+                    currentLevel.set(partKey, {
+                        type: 'file',
+                        name: partName,
+                        path: fullPath,
+                        isIndex: path.endsWith('/index.js') || path.endsWith('index.js'),
+                        addOrder: currentAddOrder.length // Store addition order
+                    });
+                    // Track addition order
+                    currentAddOrder.push(partKey);
+                } else {
+                    const existing = currentLevel.get(partKey);
+                    if ((path.endsWith('/index.js') || path.endsWith('index.js')) && existing.type === 'dir') {
+                        existing.hasIndex = true;
+                        existing.indexPath = fullPath;
+                        // Don't update addOrder for existing directory with index
+                    }
+                }
+            } else {
+                // Directory
+                if (!currentLevel.has(partKey)) {
+                    const newDir = {
+                        type: 'dir',
+                        name: partName,
+                        children: new Map(),
+                        addOrder: currentAddOrder.length, // Store addition order
+                        childAddOrder: [], // Track order of children
+                        hasIndex: false
+                    };
+                    currentLevel.set(partKey, newDir);
+                    // Track addition order
+                    currentAddOrder.push(partKey);
+                } else {
+                    const existing = currentLevel.get(partKey);
+                    if (existing.type === 'file') {
+                        // Convert file to directory
+                        const newDir = {
+                            type: 'dir',
+                            name: existing.name,
+                            children: new Map(),
+                            addOrder: existing.addOrder, // Preserve original add order
+                            childAddOrder: [], // Track order of children
+                            hasIndex: false
+                        };
+                        currentLevel.set(partKey, newDir);
+
+                        // Move existing file into children
+                        const dir = currentLevel.get(partKey);
+                        dir.children.set(partKey, {
+                            type: 'file',
+                            name: existing.name,
+                            path: existing.path,
+                            isIndex: false,
+                            addOrder: 0 // First child gets order 0
+                        });
+                        dir.childAddOrder.push(partKey);
+                    }
+                }
+
+                const dir = currentLevel.get(partKey);
+                if (!dir.children) {
+                    dir.children = new Map();
+                    dir.childAddOrder = [];
+                }
+                currentLevel = dir.children;
+                currentAddOrder = dir.childAddOrder; // Use childAddOrder for this level
+            }
+        }
+    }
+
+    build(typ = 'component') {
+        const convertMapToArray = (map, addOrder) => {
+            const result = [];
+
+            // Sort items by their addOrder property
+            const sortedEntries = Array.from(map.entries())
+                .sort(([keyA, valueA], [keyB, valueB]) => {
+                    // Use addOrder if available, otherwise fall back to insertion order
+                    const orderA = valueA.addOrder !== undefined ? valueA.addOrder : Infinity;
+                    const orderB = valueB.addOrder !== undefined ? valueB.addOrder : Infinity;
+                    return orderA - orderB;
+                });
+
+            for (const [key, value] of sortedEntries) {
+                if (value.type === 'file') {
+                    result.push({
+                        name: value.name,
+                        to: {
+                            name: 'pages',
+                            params: {
+                                lang: 'en',
+                                path: `${typ}-${value.path.replace(/\//g, '-')}`
+                            }
+                        }
+                    });
+                } else if (value.type === 'dir') {
+                    const children = value.children && value.childAddOrder
+                        ? convertMapToArray(value.children, value.childAddOrder)
+                        : [];
+
+                    // Check if we should create a group or just show as individual item
+                    if (children.length > 0) {
+                        // Find index file (child with same name)
+                        const indexChildIndex = children.findIndex(child => child.name === value.name);
+
+                        if (indexChildIndex !== -1) {
+                            const indexChild = children[indexChildIndex];
+                            const otherChildren = children.filter((_, idx) => idx !== indexChildIndex);
+
+                            if (otherChildren.length > 0) {
+                                result.push({
+                                    name: value.name,
+                                    childs: [
+                                        {
+                                            name: value.name,
+                                            to: indexChild.to
+                                        },
+                                        ...otherChildren
+                                    ]
+                                });
+                            } else {
+                                // Just the index file, no need for grouping
+                                result.push(indexChild);
+                            }
+                        } else if (children.length === 1 && children[0].name === value.name) {
+                            // Single child with same name (flatten)
+                            result.push(children[0]);
+                        } else {
+                            // Group all children
+                            result.push({
+                                name: value.name,
+                                childs: children
+                            });
+                        }
+                    } else if (value.hasIndex && value.indexPath) {
+                        // Directory with only an index file
+                        result.push({
+                            name: value.name,
+                            to: {
+                                name: 'pages',
+                                params: {
+                                    lang: 'en',
+                                    path: `${typ}-${value.indexPath.replace(/\//g, '-')}`
+                                }
+                            }
+                        });
+                    } else {
+                        // Empty directory
+                        result.push({
+                            name: value.name,
+                            childs: []
+                        });
+                    }
+                }
+            }
+
+            return result;
+        };
+
+        return convertMapToArray(this.pathMap, this.addOrder);
+    }
+
+    // Simplified version that preserves addition order
+    buildSimple(typ = 'component') {
+        const convertMapToArray = (map, addOrder) => {
+            // Sort by addOrder
+            const sortedEntries = Array.from(map.entries())
+                .sort(([keyA, valueA], [keyB, valueB]) => {
+                    const orderA = valueA.addOrder !== undefined ? valueA.addOrder : Infinity;
+                    const orderB = valueB.addOrder !== undefined ? valueB.addOrder : Infinity;
+                    return orderA - orderB;
+                });
+
+            return sortedEntries.map(([key, value]) => {
+                if (value.type === 'file') {
+                    return {
+                        name: value.name,
+                        to: {
+                            name: 'pages',
+                            params: {
+                                lang: 'en',
+                                path: `${typ}-${value.path.replace(/\//g, '-')}`
+                            }
+                        }
+                    };
+                }
+
+                // Directory
+                const children = value.children && value.childAddOrder
+                    ? convertMapToArray(value.children, value.childAddOrder)
+                    : [];
+
+                if (value.hasIndex && value.indexPath) {
+                    const baseItem = {
+                        name: value.name,
+                        to: {
+                            name: 'pages',
+                            params: {
+                                lang: 'en',
+                                path: `${typ}-${value.indexPath.replace(/\//g, '-')}`
+                            }
+                        }
+                    };
+
+                    return children.length > 0
+                        ? {...baseItem, childs: children}
+                        : baseItem;
+                }
+
+                return children.length > 0
+                    ? {name: value.name, childs: children}
+                    : {name: value.name, childs: []};
+            });
+        };
+
+        return convertMapToArray(this.pathMap, this.addOrder);
+    }
+}