rspress-plugin-file-tree 1.0.1 → 1.0.2

package/dist/0~301.js

@@ -0,0 +1,2 @@
+const htmlraw_namespaceObject = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\"><path fill=\"#e65100\" d=\"m4 4 2 22 10 2 10-2 2-22Zm19.72 7H11.28l.29 3h11.86l-.802 9.335L15.99 25l-6.635-1.646L8.93 19h3.02l.19 2 3.86.77 3.84-.77.29-4H8.84L8 8h16Z\"/></svg>";
+export { htmlraw_namespaceObject };

package/dist/components/FileTree/FileTree.css

@@ -4,6 +4,7 @@
   border: var(--rp-code-block-border, 1px solid var(--rp-c-divider-light));
   min-height: 100%;
   box-shadow: var(--rp-code-block-shadow, none);
+  background-color: var(--rp-code-block-bg);
   padding: 8px;
   font-family: inherit;
   font-size: 13px;
@@ -64,6 +65,15 @@
   overflow: hidden;
 }
 
+.comment-_zMtnb {
+  color: var(--rp-c-text-2);
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  margin-left: 8px;
+  font-style: italic;
+  overflow: hidden;
+}
+
 .children-yp3kEz {
   flex-direction: column;
   display: flex;

package/dist/components/FileTree/FileTree.js

@@ -141,6 +141,18 @@ const SUPPORTED_LANGUAGES = [
                 matcher: /^.*\.(md|mdx)$/
             }
         ]
+    },
+    {
+        id: 'html',
+        icons: [
+            {
+                name: 'html',
+                content: ()=>import("../../0~301.js").then((mod)=>({
+                            default: mod.htmlraw_namespaceObject
+                        })),
+                matcher: /^.*\.html?$/
+            }
+        ]
     }
 ];
 const FOLDER_ICONS = {
@@ -404,6 +416,7 @@ const FileTreeItem_module = {
     chevron: "chevron-Zi120f",
     iconWrapper: "iconWrapper-SwAXs4",
     name: "name-ItNtUc",
+    comment: "comment-_zMtnb",
     children: "children-yp3kEz",
     indentGuide: "indentGuide-bjr2fi"
 };
@@ -432,7 +445,8 @@ const RemoteSvgIcon = ({ content, className })=>{
 };
 const INDENT_SIZE = 12;
 const FileTreeItem = ({ node, depth })=>{
-    const [expanded, setExpanded] = useState(true);
+    const hasChildren = 'directory' === node.type && node.children.length > 0;
+    const [expanded, setExpanded] = useState(hasChildren);
     const icon = useMemo(()=>{
         if ('directory' === node.type) return getFolderIcon(node.name);
         return getFileIcon(node.name);
@@ -483,6 +497,10 @@ const FileTreeItem = ({ node, depth })=>{
                     /*#__PURE__*/ jsx("span", {
                         className: FileTreeItem_module.name,
                         children: node.name
+                    }),
+                    node.comment && /*#__PURE__*/ jsx("span", {
+                        className: FileTreeItem_module.comment,
+                        children: node.comment
                     })
                 ]
             }),

package/dist/components/tree-parser/types.d.ts

@@ -3,6 +3,7 @@ export interface TreeNode {
     type: 'file' | 'directory';
     children: TreeNode[];
     extension?: string;
+    comment?: string;
 }
 export interface ParsedTree {
     nodes: TreeNode[];

package/dist/index.js

@@ -1,21 +1,22 @@
 import node_path from "node:path";
 import { RemarkCodeBlockToGlobalComponentPluginFactory } from "rspress-plugin-devkit";
 function parseTreeContent(content) {
-    const lines = content.split('\n').filter((line)=>line.trim());
+    let lines = content.split('\n').filter((line)=>line.trim());
+    if (lines.length > 0 && '.' === lines[0].trim()) lines = lines.slice(1);
     const nodes = [];
     const stack = [];
     for (const line of lines){
         const indent = calculateIndent(line);
         const fullName = extractName(line);
-        const commentMatch = fullName.match(/^(.*?)(?:\s*\/\/\s*(.*))?$/);
-        const name = commentMatch ? commentMatch[1].trim() : fullName;
+        const { name, comment } = extractNameAndComment(fullName);
         if (!name) continue;
         const isDirectory = isDirectoryName(name);
         const node = {
             name: name.replace(/\/$/, ''),
             type: isDirectory ? 'directory' : 'file',
             children: [],
-            extension: isDirectory ? void 0 : getExtension(name)
+            extension: isDirectory ? void 0 : getExtension(name),
+            comment
         };
         while(stack.length > 0 && stack[stack.length - 1].indent >= indent)stack.pop();
         if (0 === stack.length) nodes.push(node);
@@ -40,11 +41,21 @@ function calculateIndent(line) {
             i += 4;
             continue;
         }
+        if ('│' === char && ' ' === line[i + 1]) {
+            indent++;
+            i += 2;
+            continue;
+        }
         if ('    ' === line.substring(i, i + 4)) {
             indent++;
             i += 4;
             continue;
         }
+        if ('  ' === line.substring(i, i + 2)) {
+            indent++;
+            i += 2;
+            continue;
+        }
         if ('├' === char || '└' === char) {
             if ('├──' === line.substring(i, i + 3) || '└──' === line.substring(i, i + 3)) indent++;
         }
@@ -55,10 +66,64 @@ function calculateIndent(line) {
 function extractName(line) {
     return line.replace(/^[\s│]*/g, '').replace(/^[├└]──\s*/, '').trim();
 }
+function extractNameAndComment(fullName) {
+    const trimmed = fullName.trim();
+    if (!trimmed) return {
+        name: '',
+        comment: void 0
+    };
+    if (/^\.{2,}$/.test(trimmed)) return {
+        name: trimmed,
+        comment: void 0
+    };
+    const doubleSpaceMatch = trimmed.match(/^(.+?)\s{2,}(.+)$/);
+    if (doubleSpaceMatch) {
+        const potentialName = doubleSpaceMatch[1].trim();
+        const potentialComment = doubleSpaceMatch[2].trim();
+        if (isValidName(potentialName)) return {
+            name: potentialName,
+            comment: potentialComment
+        };
+    }
+    const singleSpaceMatch = trimmed.match(/^(.+?\.[a-zA-Z0-9]+)\s+([^.].*)$/);
+    if (singleSpaceMatch) {
+        const potentialName = singleSpaceMatch[1].trim();
+        const potentialComment = singleSpaceMatch[2].trim();
+        return {
+            name: potentialName,
+            comment: potentialComment
+        };
+    }
+    const hiddenFileMatch = trimmed.match(/^(\.[^\s]+)\s+(.+)$/);
+    if (hiddenFileMatch) return {
+        name: hiddenFileMatch[1].trim(),
+        comment: hiddenFileMatch[2].trim()
+    };
+    const dirCommentMatch = trimmed.match(/^([\w][\w.\s-]*?)\s+([^a-zA-Z0-9].*)$/);
+    if (dirCommentMatch) {
+        const potentialName = dirCommentMatch[1].trim();
+        if (!/\.[a-zA-Z0-9]+$/.test(potentialName)) return {
+            name: potentialName,
+            comment: dirCommentMatch[2].trim()
+        };
+    }
+    return {
+        name: trimmed,
+        comment: void 0
+    };
+}
+function isValidName(name) {
+    if (!name) return false;
+    if (name.endsWith('/')) return true;
+    if (/\.[a-zA-Z0-9]+$/.test(name)) return true;
+    if (name.startsWith('.')) return true;
+    if (/^[\w\s.-]+$/.test(name)) return true;
+    return false;
+}
 function isDirectoryName(name) {
-    const cleanName = name.split(/\s+\/\//)[0].trim();
-    if (cleanName.endsWith('/')) return true;
-    const lastPart = cleanName.split('/').pop() || cleanName;
+    if (name.endsWith('/')) return true;
+    const lastPart = name.split('/').pop() || name;
+    if (/^\.{2,}$/.test(lastPart)) return false;
     if (lastPart.startsWith('.')) return false;
     if (/\.[a-zA-Z0-9]+$/.test(lastPart)) return false;
     return true;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rspress-plugin-file-tree",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Rspress plugin that add support for file tree component.",
   "files": [
     "dist"