rspress-plugin-file-tree 0.1.3-beta.0 → 0.1.4-beta.0

package/dist/index.js

@@ -7,7 +7,7 @@ export default function rspressPluginFileTree(options = {}) {
         components: [
             {
                 lang: 'tree',
-                componentPath: path.join(__dirname, './components/Tree/FileTreeRender.tsx'),
+                componentPath: path.join(__dirname, '../components/Tree/FileTreeRender.tsx'),
                 propsProvider(code) {
                     return {
                         tree: parseInput(code),

package/package.json

@@ -1,7 +1,11 @@
 {
   "name": "rspress-plugin-file-tree",
-  "version": "0.1.3-beta.0",
+  "version": "0.1.4-beta.0",
   "description": "Rspress plugin that add support for file tree component.",
+  "files": [
+    "dist",
+    "components"
+  ],
   "keywords": [
     "rspress",
     "plugin",
@@ -25,7 +29,7 @@
   },
   "dependencies": {
     "@rspress/shared": "^1.17.1",
-    "rspress-plugin-devkit": "^0.1.3-beta.0"
+    "rspress-plugin-devkit": "^0.1.3"
   },
   "devDependencies": {
     "@types/node": "^20.12.5",

package/CHANGELOG.md

@@ -1,40 +0,0 @@
-# rspress-plugin-file-tree
-
-## 0.1.3-beta.0
-
-### Patch Changes
-
-- Updated dependencies [2891f27]
-  - rspress-plugin-devkit@0.1.3-beta.0
-
-## 0.1.2
-
-### Patch Changes
-
-- Updated dependencies [932dbb7]
-  - rspress-plugin-devkit@0.1.2
-
-## 0.1.2-beta.0
-
-### Patch Changes
-
-- Updated dependencies [932dbb7]
-  - rspress-plugin-devkit@0.1.2-beta.0
-
-## 0.1.1
-
-### Patch Changes
-
-- 546dcf0: release beta
-- 5e28903: fixup publish config
-- Updated dependencies [546dcf0]
-- Updated dependencies [5e28903]
-  - rspress-plugin-devkit@0.1.1
-
-## 0.1.1-beta.0
-
-### Patch Changes
-
-- 546dcf0: release beta
-- Updated dependencies [546dcf0]
-  - rspress-plugin-devkit@0.1.1-beta.0

package/dist/components/Tree/Expand.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-export type ShapeType = {
-    width: number;
-    height: number;
-};
-export declare const getRealShape: (el: HTMLElement | null) => ShapeType;
-export type ShapeResult = [ShapeType, () => void];
-export type ExpandProps = {
-    isExpanded?: boolean;
-    delay?: number;
-    parentExpanded?: boolean[];
-};
-declare const Expand: React.FC<React.PropsWithChildren<ExpandProps>>;
-export default Expand;

package/dist/components/Tree/Expand.js

@@ -1,104 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useRef, useState } from 'react';
-import clsx from 'clsx';
-export const getRealShape = (el) => {
-    const defaultShape = { width: 0, height: 0 };
-    if (!el || typeof window === 'undefined')
-        return defaultShape;
-    const rect = el.getBoundingClientRect();
-    const { width, height } = window.getComputedStyle(el);
-    const getCSSStyleVal = (str, parentNum) => {
-        if (!str)
-            return 0;
-        const strVal = str.includes('px')
-            ? +str.split('px')[0]
-            : str.includes('%')
-                ? +str.split('%')[0] * parentNum * 0.01
-                : str;
-        return Number.isNaN(+strVal) ? 0 : +strVal;
-    };
-    return {
-        width: getCSSStyleVal(`${width}`, rect.width),
-        height: getCSSStyleVal(`${height}`, rect.height),
-    };
-};
-const useRealShape = (ref) => {
-    const [state, setState] = useState({
-        width: 0,
-        height: 0,
-    });
-    const update = () => {
-        const { width, height } = getRealShape(ref.current);
-        setState({ width, height });
-    };
-    useEffect(() => update(), [ref.current]);
-    return [state, update];
-};
-const defaultProps = {
-    isExpanded: false,
-    delay: 200,
-};
-const Expand = ({ isExpanded, delay, parentExpanded = [], children, }) => {
-    const [height, setHeight] = useState(isExpanded ? 'auto' : '0');
-    const [selfExpanded, setSelfExpanded] = useState(isExpanded);
-    const [visible, setVisible] = useState(isExpanded);
-    const contentRef = useRef(null);
-    const entryTimer = useRef();
-    const leaveTimer = useRef();
-    const resetTimer = useRef();
-    const [state, updateShape] = useRealShape(contentRef);
-    const [parentClosed, setParentClosed] = useState(false);
-    useEffect(() => setHeight(`${state.height}px`), [state.height]);
-    useEffect(() => {
-        // show element or reset height.
-        // force an update once manually, even if the element does not change.
-        // (the height of the element might be "auto")
-        if (isExpanded) {
-            setVisible(isExpanded);
-        }
-        else {
-            updateShape();
-            setHeight(`${state.height}px`);
-        }
-        // show expand animation
-        entryTimer.current = window.setTimeout(() => {
-            setSelfExpanded(isExpanded);
-            clearTimeout(entryTimer.current);
-        }, 30);
-        // Reset height after animation
-        if (isExpanded) {
-            resetTimer.current = window.setTimeout(() => {
-                setHeight('auto');
-                clearTimeout(resetTimer.current);
-            }, delay);
-        }
-        else {
-            leaveTimer.current = window.setTimeout(() => {
-                setVisible(isExpanded);
-                clearTimeout(leaveTimer.current);
-            }, delay / 2);
-        }
-        return () => {
-            clearTimeout(entryTimer.current);
-            clearTimeout(leaveTimer.current);
-            clearTimeout(resetTimer.current);
-        };
-    }, [isExpanded]);
-    useEffect(() => {
-        const parentClosed = parentExpanded.some((i) => i === false);
-        setParentClosed(parentClosed);
-    }, [parentExpanded]);
-    return (_jsx("div", { className: clsx('rspress-file-tree-expand-container', {
-            'rspress-file-tree-expand-container-expanded': isExpanded,
-        }), style: {
-            height: 0,
-            visibility: visible && !parentClosed ? 'visible' : 'hidden',
-            transition: `height ${delay}ms ease`,
-            ...(selfExpanded
-                ? { height, visibility: parentClosed ? 'hidden' : 'visible' }
-                : {}),
-        }, children: _jsx("div", { ref: contentRef, className: clsx('rspress-file-tree-expand-content'), children: children }) }));
-};
-Expand.defaultProps = defaultProps;
-Expand.displayName = 'GeistExpand';
-export default Expand;

package/dist/components/Tree/FileIcon.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-export interface TreeFileIconProps {
-    color?: string;
-    width?: number;
-    height?: number;
-}
-declare const TreeFileIcon: React.FC<TreeFileIconProps>;
-export default TreeFileIcon;

package/dist/components/Tree/FileIcon.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { buildClassName } from '../presets';
-const defaultProps = {
-    width: 22,
-    height: 22,
-};
-const TreeFileIcon = ({ color, width, height, }) => {
-    return (_jsxs("svg", { className: buildClassName('file-icon'), viewBox: "0 0 24 24", width: width, height: height, stroke: "currentColor", strokeWidth: "1", strokeLinecap: "round", strokeLinejoin: "round", fill: "none", shapeRendering: "geometricPrecision", children: [_jsx("path", { d: "M13 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V9z" }), _jsx("path", { d: "M13 2v7h7" })] }));
-};
-TreeFileIcon.defaultProps = defaultProps;
-TreeFileIcon.displayName = 'GeistTreeFileIcon';
-export default TreeFileIcon;

package/dist/components/Tree/FileTreeRender.d.ts

@@ -1,11 +0,0 @@
-import Tree from './Tree';
-import TreeFile from './TreeFile';
-import TreeFolder from './TreeFolder';
-import './index.less';
-export type TreeComponentType = typeof Tree & {
-    File: typeof TreeFile;
-    Folder: typeof TreeFolder;
-};
-export type { TreeProps, TreeFile } from './Tree';
-declare const _default: TreeComponentType;
-export default _default;

package/dist/components/Tree/FileTreeRender.js

@@ -1,7 +0,0 @@
-import Tree from './Tree';
-import TreeFile from './TreeFile';
-import TreeFolder from './TreeFolder';
-import './index.less';
-Tree.File = TreeFile;
-Tree.Folder = TreeFolder;
-export default Tree;

package/dist/components/Tree/Tree.d.ts

@@ -1,20 +0,0 @@
-import React from 'react';
-export declare const tuple: <T extends string[]>(...args: T) => T;
-declare const FileTreeValueType: ["directory", "file"];
-export type TreeFile = {
-    type: (typeof FileTreeValueType)[number];
-    name: string;
-    extra?: string;
-    files?: Array<TreeFile>;
-};
-interface Props {
-    tree?: TreeFile[];
-    initialExpand?: boolean;
-    onClick?: (path: string) => void;
-    className?: string;
-    initialExpandDepth?: number;
-}
-type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>;
-export type TreeProps = Props & NativeAttrs;
-declare const Tree: React.FC<React.PropsWithChildren<TreeProps>>;
-export default Tree;

package/dist/components/Tree/Tree.js

@@ -1,52 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import TreeFile from './TreeFile';
-import TreeFolder from './TreeFolder';
-import { TreeContext } from './TreeContext';
-import { sortChildren } from '../helpers';
-import { buildClassName } from '../presets';
-import { useDark } from 'rspress/runtime';
-export const tuple = (...args) => args;
-const FileTreeValueType = tuple('directory', 'file');
-const directoryType = FileTreeValueType[0];
-const defaultProps = {
-    initialExpand: false,
-    className: '',
-};
-const makeChildren = (value = []) => {
-    if (!value || !value.length)
-        return null;
-    return value
-        .sort((a, b) => {
-        if (a.type !== b.type)
-            return a.type !== directoryType ? 1 : -1;
-        return `${a.name}`.charCodeAt(0) - `${b.name}`.charCodeAt(0);
-    })
-        .map((item, index) => {
-        if (item.type === directoryType)
-            return (_jsx(TreeFolder, { name: item.name, extra: item.extra, parentExpanded: [], children: makeChildren(item.files) }, `folder-${item.name}-${index}`));
-        return (_jsx(TreeFile, { name: item.name, extra: item.extra, parentExpanded: [] }, `file-${item.name}-${index}`));
-    });
-};
-const Tree = ({ children, onClick, initialExpand, initialExpandDepth, tree, className, ...props }) => {
-    if (!tree)
-        return null;
-    const isImperative = Boolean(tree.length > 0);
-    const onFileClick = (path) => {
-        onClick && onClick(path);
-    };
-    const initialValue = useMemo(() => ({
-        onFileClick,
-        initialExpand,
-        initialExpandDepth,
-        isImperative,
-    }), [initialExpand]);
-    const customChildren = isImperative
-        ? makeChildren(tree)
-        : sortChildren(children, TreeFolder);
-    const dark = useDark();
-    return (_jsx(TreeContext.Provider, { value: initialValue, children: _jsx("div", { "data-dark": String(dark), className: buildClassName(), ...props, children: customChildren }) }));
-};
-Tree.defaultProps = defaultProps;
-Tree.displayName = 'GeistTree';
-export default Tree;

package/dist/components/Tree/TreeContext.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-export interface TreeConfig {
-    onFileClick?: (path: string) => void;
-    initialExpand: boolean;
-    initialExpandDepth?: number;
-    isImperative: boolean;
-}
-export declare const TreeContext: React.Context<TreeConfig>;
-export declare const useTreeContext: () => TreeConfig;

package/dist/components/Tree/TreeContext.js

@@ -1,7 +0,0 @@
-import React from 'react';
-const defaultContext = {
-    initialExpand: false,
-    isImperative: false,
-};
-export const TreeContext = React.createContext(defaultContext);
-export const useTreeContext = () => React.useContext(TreeContext);

package/dist/components/Tree/TreeFile.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-interface Props {
-    name: string;
-    extra?: string;
-    parentPath?: string;
-    level?: number;
-    className?: string;
-}
-type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>;
-export type TreeFileProps = Props & NativeAttrs & {
-    parentExpanded: boolean[];
-};
-declare const TreeFile: React.FC<React.PropsWithChildren<TreeFileProps>>;
-export default TreeFile;

package/dist/components/Tree/TreeFile.js

@@ -1,26 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import TreeFileIcon from './FileIcon';
-import { useTreeContext } from './TreeContext';
-import TreeIndents from './TreeIndents';
-import { makeChildPath, stopPropagation } from '../helpers';
-import { buildClassName } from '../presets';
-const defaultProps = {
-    level: 0,
-    className: '',
-    parentPath: '',
-};
-const TreeFile = ({ name, parentPath, level, extra, className, parentExpanded, ...props }) => {
-    const { onFileClick } = useTreeContext();
-    const currentPath = useMemo(() => makeChildPath(name, parentPath), []);
-    const clickHandler = (event) => {
-        stopPropagation(event);
-        onFileClick && onFileClick(currentPath);
-    };
-    return (_jsx("div", { className: buildClassName('file'), onClick: clickHandler, ...props, children: _jsxs("div", { className: buildClassName('file-names'), style: {
-                marginLeft: `calc(1.875rem * ${level})`,
-            }, children: [_jsx(TreeIndents, { count: level }), _jsx("span", { className: buildClassName('file-icon'), children: _jsx(TreeFileIcon, {}) }), _jsxs("span", { className: buildClassName('file-name'), children: [name, extra && (_jsx("span", { className: buildClassName('file-extra'), children: extra }))] })] }) }));
-};
-TreeFile.defaultProps = defaultProps;
-TreeFile.displayName = 'GeistTreeFile';
-export default TreeFile;

package/dist/components/Tree/TreeFolder.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-interface Props {
-    name: string;
-    extra?: string;
-    parentPath?: string;
-    level?: number;
-    className?: string;
-}
-type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>;
-export type TreeFolderProps = Props & NativeAttrs & {
-    parentExpanded: boolean[];
-};
-declare const TreeFolder: React.FC<React.PropsWithChildren<TreeFolderProps>>;
-export default TreeFolder;

package/dist/components/Tree/TreeFolder.js

@@ -1,37 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo, useState } from 'react';
-import TreeFile from './TreeFile';
-import Expand from './Expand';
-import TreeIndents from './TreeIndents';
-import { useTreeContext } from './TreeContext';
-import TreeFolderIcon from './TreeFolderIcon';
-import TreeStatusIcon from './TreeStatusIcon';
-import { sortChildren, makeChildPath, stopPropagation, setChildrenProps, } from '../helpers';
-import { buildClassName } from '../presets';
-const defaultProps = {
-    level: 0,
-    className: '',
-    parentPath: '',
-};
-const TreeFolder = ({ name, children, parentPath, level: parentLevel, extra, className, parentExpanded = [], ...props }) => {
-    const { initialExpand, isImperative, initialExpandDepth = 0, } = useTreeContext();
-    const [expanded, setExpanded] = useState(() => {
-        return parentLevel + 1 <= initialExpandDepth;
-    });
-    const currentPath = useMemo(() => makeChildPath(name, parentPath), []);
-    const clickHandler = () => setExpanded(!expanded);
-    const nextChildren = setChildrenProps(children, {
-        parentPath: currentPath,
-        level: parentLevel + 1,
-        parentExpanded: [...parentExpanded, expanded],
-    }, [TreeFolder, TreeFile]);
-    const sortedChildren = isImperative
-        ? nextChildren
-        : sortChildren(nextChildren, TreeFolder);
-    return (_jsxs("div", { className: buildClassName('folder'), onClick: clickHandler, ...props, children: [_jsxs("div", { className: buildClassName('folder-names'), style: {
-                    marginLeft: `calc(1.875rem * ${parentLevel})`,
-                }, children: [_jsx(TreeIndents, { count: parentLevel }), _jsx("span", { className: buildClassName('folder-status'), children: _jsx(TreeStatusIcon, { active: expanded }) }), _jsx("span", { className: buildClassName('folder-icon'), children: _jsx(TreeFolderIcon, {}) }), _jsxs("span", { className: buildClassName('folder-name'), children: [name, extra && (_jsx("span", { className: buildClassName('folder-extra'), children: extra }))] })] }), _jsx(Expand, { isExpanded: expanded, parentExpanded: parentExpanded, children: _jsx("div", { className: buildClassName('folder-content'), onClick: stopPropagation, children: sortedChildren }) })] }));
-};
-TreeFolder.defaultProps = defaultProps;
-TreeFolder.displayName = 'GeistTreeFolder';
-export default TreeFolder;

package/dist/components/Tree/TreeFolderIcon.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-export interface TreeFolderIconProps {
-    color?: string;
-    width?: number;
-    height?: number;
-}
-declare const TreeFolderIcon: React.FC<TreeFolderIconProps>;
-export default TreeFolderIcon;

package/dist/components/Tree/TreeFolderIcon.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { buildClassName } from '../presets';
-const defaultProps = {
-    width: 22,
-    height: 22,
-};
-const TreeFolderIcon = ({ color, width, height, }) => {
-    return (_jsx("svg", { className: buildClassName('folder-icon'), viewBox: "0 0 24 24", width: width, height: height, stroke: "currentColor", strokeWidth: "1", strokeLinecap: "round", strokeLinejoin: "round", fill: "none", shapeRendering: "geometricPrecision", children: _jsx("path", { d: "M2.707 7.454V5.62C2.707 4.725 3.469 4 4.409 4h4.843c.451 0 .884.17 1.204.474l.49.467c.126.12.296.186.473.186h8.399c.94 0 1.55.695 1.55 1.59v.737m-18.661 0h-.354a.344.344 0 00-.353.35l.508 11.587c.015.34.31.609.668.609h17.283c.358 0 .652-.269.667-.61L22 7.805a.344.344 0 00-.353-.35h-.278m-18.662 0h18.662" }) }));
-};
-TreeFolderIcon.defaultProps = defaultProps;
-TreeFolderIcon.displayName = 'GeistTreeFolderIcon';
-export default TreeFolderIcon;

package/dist/components/Tree/TreeIndents.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-interface Props {
-    count: number;
-}
-declare const TreeIndents: React.FC<Props>;
-export default TreeIndents;

package/dist/components/Tree/TreeIndents.js

@@ -1,10 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { buildClassName } from '../presets';
-const TreeIndents = ({ count }) => {
-    if (count === 0)
-        return null;
-    return (_jsx(_Fragment, { children: [...new Array(count)].map((_, index) => (_jsx("span", { className: buildClassName('indent'), style: {
-                left: `calc(-1.875rem * ${index + 1} + 0.75rem)`,
-            } }, `indent-${index}`))) }));
-};
-export default TreeIndents;

package/dist/components/Tree/TreeStatusIcon.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-export interface TreeStatusIconProps {
-    color?: string;
-    width?: number;
-    height?: number;
-    active?: boolean;
-}
-declare const TreeStatusIcon: React.FC<TreeStatusIconProps>;
-export default TreeStatusIcon;

package/dist/components/Tree/TreeStatusIcon.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { buildClassName } from '../presets';
-const defaultProps = {
-    width: 12,
-    height: 12,
-    active: false,
-};
-const TreeStatusIcon = ({ color, width, height, active, }) => {
-    return (_jsxs("svg", { className: buildClassName('folder-status-icon'), viewBox: "0 0 24 24", width: width, height: height, stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", fill: "none", shapeRendering: "geometricPrecision", children: [_jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2" }), !active && _jsx("path", { d: "M12 8v8" }), _jsx("path", { d: "M8 12h8" })] }));
-};
-TreeStatusIcon.defaultProps = defaultProps;
-TreeStatusIcon.displayName = 'GeistTreeStatusIcon';
-export default TreeStatusIcon;

package/dist/components/helpers.d.ts

@@ -1,5 +0,0 @@
-import React, { type ReactNode } from 'react';
-export declare const sortChildren: (children: ReactNode | undefined, folderComponentType: React.ElementType) => (string | number | React.ReactElement<any, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | React.ReactPortal)[];
-export declare const makeChildPath: (name: string, parentPath?: string) => string;
-export declare const stopPropagation: (event: React.MouseEvent) => void;
-export declare const setChildrenProps: (children: ReactNode | undefined, props: Record<string, unknown>, targetComponents?: Array<React.ElementType>) => ReactNode | undefined;

package/dist/components/helpers.js

@@ -1,35 +0,0 @@
-import React from 'react';
-export const sortChildren = (children, folderComponentType) => {
-    return React.Children.toArray(children).sort((a, b) => {
-        if (!React.isValidElement(a) || !React.isValidElement(b))
-            return 0;
-        if (a.type !== b.type)
-            return a.type !== folderComponentType ? 1 : -1;
-        return `${a.props.name}`.charCodeAt(0) - `${b.props.name}`.charCodeAt(0);
-    });
-};
-export const makeChildPath = (name, parentPath) => {
-    if (!parentPath)
-        return name;
-    return `${parentPath}/${name}`;
-};
-export const stopPropagation = (event) => {
-    event.stopPropagation();
-    event.nativeEvent.stopImmediatePropagation();
-};
-export const setChildrenProps = (children, props, targetComponents = []) => {
-    if (React.Children.count(children) === 0)
-        return [];
-    const allowAll = targetComponents.length === 0;
-    const clone = (child, props = {}) => React.cloneElement(child, props);
-    return React.Children.map(children, (item) => {
-        if (!React.isValidElement(item))
-            return item;
-        if (allowAll)
-            return clone(item, props);
-        const isAllowed = targetComponents.find((child) => child === item.type);
-        if (isAllowed)
-            return clone(item, props);
-        return item;
-    });
-};

package/dist/components/presets.d.ts

@@ -1,2 +0,0 @@
-export declare const presetClassName = "rp-file-tree";
-export declare function buildClassName(fragment?: string): string;

package/dist/components/presets.js

@@ -1,4 +0,0 @@
-export const presetClassName = 'rp-file-tree';
-export function buildClassName(fragment) {
-    return (fragment === null || fragment === void 0 ? void 0 : fragment.length) ? `${presetClassName}-${fragment}` : presetClassName;
-}

package/doc_build/static/search_index.aad48136.json

@@ -1 +0,0 @@
-[{"id":0,"title":"Remark x File Tree","content":"#\n\n","routePath":"/","lang":"","toc":[],"domain":"","frontmatter":{},"version":""}]

package/docs/index.md

@@ -1,26 +0,0 @@
-# Remark x File Tree
-
-```tree
-.
-├── rspress.config.ts
-├── src
-│   ├── components
-│   │   ├── FileTreeRender.tsx
-│   │   ├── Tree
-│   │   │   ├── Expand.tsx
-│   │   │   ├── FileIcon.tsx
-│   │   │   ├── Tree.tsx
-│   │   │   ├── TreeContext.tsx
-│   │   │   ├── TreeFile.tsx
-│   │   │   ├── TreeFolder.tsx
-│   │   │   ├── TreeFolderIcon.tsx
-│   │   │   ├── TreeIndents.tsx
-│   │   │   ├── TreeStatusIcon.tsx
-│   │   │   ├── index.less
-│   │   │   └── index.tsx
-│   │   ├── helpers.ts
-│   │   └── presets.ts
-│   ├── index.ts
-│   └── parser.ts
-└── tsconfig.json
-```

package/rspress.config.ts

@@ -1,13 +0,0 @@
-import * as path from 'path';
-import { defineConfig } from 'rspress/config';
-import fileTree from './src';
-
-export default defineConfig({
-  root: path.join(__dirname, 'docs'),
-  title: 'Rspress x FileTree Example',
-  plugins: [
-    fileTree({
-      initialExpandDepth: 1,
-    }),
-  ],
-});

package/src/index.ts

@@ -1,50 +0,0 @@
-import path from 'node:path';
-
-import {
-  PresetConfigMutator,
-  RemarkCodeBlockToGlobalComponentPluginFactory,
-} from 'rspress-plugin-devkit';
-
-import { parseInput } from './parser';
-
-import type { RspressPlugin } from '@rspress/shared';
-
-interface RspressPluginFileTreeOptions {
-  initialExpandDepth?: number;
-}
-
-export default function rspressPluginFileTree(
-  options: RspressPluginFileTreeOptions = {},
-): RspressPlugin {
-  const { initialExpandDepth = 0 } = options;
-
-  const remarkFileTree = new RemarkCodeBlockToGlobalComponentPluginFactory({
-    components: [
-      {
-        lang: 'tree',
-        componentPath: path.join(
-          __dirname,
-          './components/Tree/FileTreeRender.tsx',
-        ),
-        propsProvider(code) {
-          return {
-            tree: parseInput(code),
-            initialExpandDepth,
-          };
-        },
-      },
-    ],
-  });
-
-  return {
-    name: 'rspress-plugin-file-tree',
-    config(config) {
-      return new PresetConfigMutator(config).disableMdxRs().toConfig();
-    },
-    markdown: {
-      remarkPlugins: [remarkFileTree.remarkPlugin],
-      globalComponents: remarkFileTree.mdxComponents,
-    },
-    builderConfig: remarkFileTree.builderConfig,
-  };
-}

package/src/parser.ts

@@ -1,50 +0,0 @@
-type TreeItem = {
-  type: 'file' | 'directory';
-  name: string;
-  files?: TreeItem[];
-};
-
-function countLeadingSpaces(line: string): number {
-  const matches = line.match(/^(\s*\│\s*)*/);
-  if (!matches) return 0;
-  return matches[0].length;
-}
-
-export function parseInput(input: string): TreeItem[] {
-  const lines = input.split('\n').filter((line) => line.trim());
-  const tree: TreeItem[] = [];
-  const stack: { level: number; item: TreeItem }[] = [];
-
-  for (let i = 0; i < lines.length; i++) {
-    const line = lines[i];
-
-    if (line === '.') continue;
-
-    const level = countLeadingSpaces(line);
-
-    const name = line.trim().split(' ').slice(-1)[0];
-
-    const nextLine = lines[i + 1] || '';
-    const nextLineLevel = countLeadingSpaces(nextLine);
-    const type = nextLineLevel > level ? 'directory' : 'file';
-    const item: TreeItem =
-      type === 'directory' ? { type, name, files: [] } : { type, name };
-
-    while (stack.length > 0 && stack[stack.length - 1].level >= level) {
-      stack.pop();
-    }
-
-    if (stack.length === 0) {
-      tree.push(item);
-    } else {
-      const parentItem = stack[stack.length - 1].item;
-      parentItem.files?.push(item);
-    }
-
-    if (item.type === 'directory') {
-      stack.push({ level, item });
-    }
-  }
-
-  return tree;
-}

package/tsconfig.json

@@ -1,8 +0,0 @@
-{
-  "compilerOptions": {
-    "rootDir": "src",
-    "outDir": "dist"
-  },
-  "include": ["src"],
-  "extends": "../../tsconfig.base.json"
-}