rspress-plugin-graph-view 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025-present Rspress contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,95 @@
+# rspress-plugin-graph-view
+
+Interactive graph visualization for [Rspress](https://rspress.dev/) documentation sites. Automatically extracts internal markdown links and renders them as a navigable force-directed graph — like Obsidian's graph view for your docs.
+
+![Version](https://img.shields.io/npm/v/rspress-plugin-graph-view)
+![License](https://img.shields.io/npm/l/rspress-plugin-graph-view)
+
+## Features
+
+- **Automatic link detection** — uses MDAST parsing to extract all markdown link formats (inline, reference, autolinks) while ignoring links inside code blocks
+- **Click to navigate** — click any node to jump to that page
+- **Dark mode** — seamlessly adapts to light and dark themes
+- **Build caching** — incremental rebuilds with mtime-based cache invalidation
+- **Large graph optimization** — automatically disables expensive visual effects for graphs with 80+ nodes
+- **Build profiling** — optional diagnostics to measure graph build performance
+
+## Installation
+
+```bash
+bun add rspress-plugin-graph-view
+# or
+npm install rspress-plugin-graph-view
+# or
+pnpm add rspress-plugin-graph-view
+```
+
+## Usage
+
+Add the plugin to your `rspress.config.ts`:
+
+```ts
+import { defineConfig } from "@rspress/core";
+import graphView from "rspress-plugin-graph-view";
+
+export default defineConfig({
+  // ...your config
+  plugins: [graphView()],
+});
+```
+
+That's it. A floating action button will appear in the bottom-right corner of your docs site. Click it to open the graph view.
+
+### Options
+
+```ts
+graphView({
+  // Open the graph panel by default (default: false)
+  defaultOpen: true,
+
+  // Log build timing diagnostics (default: false)
+  profileBuild: true,
+})
+```
+
+You can also enable profiling temporarily with the `RSPRESS_GRAPH_VIEW_PROFILE=1` environment variable.
+
+### Peer Dependencies
+
+This plugin requires the following peer dependencies, which should already be installed if you're using Rspress:
+
+| Package | Version |
+| --- | --- |
+| `@rspress/core` | `^2.0.7` |
+| `react` | `>=19` |
+| `react-dom` | `>=19` |
+| `react-force-graph-2d` | `^1.29.1` |
+
+## How It Works
+
+1. **Build time**: The plugin collects all route metadata, reads each markdown file, parses the content into an MDAST syntax tree, extracts internal link references, and builds a graph data structure.
+2. **Runtime**: A virtual module (`virtual-graph-data`) injects the graph data into the client. `react-force-graph-2d` renders an interactive force-directed graph with custom canvas drawing.
+3. **Caching**: File mtime + size signatures enable incremental rebuilds — unchanged files skip parsing entirely.
+
+## Development
+
+```bash
+# Install dependencies
+bun install
+
+# Typecheck
+bun run build
+
+# Run tests
+bun test
+
+# Start docs dev server
+bun run docs:dev
+
+# Benchmark graph build performance
+bun run bench:graph --pages=1000 --links=6 --iterations=5
+```
+
+## License
+
+MIT

package/package.json

@@ -0,0 +1,67 @@
+{
+  "name": "rspress-plugin-graph-view",
+  "version": "1.0.0",
+  "type": "module",
+  "description": "Interactive graph visualization for Rspress documentation sites — visualize your knowledge base connections like Obsidian",
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "keywords": [
+    "rspress",
+    "plugin",
+    "graphview"
+  ],
+  "homepage": "https://github.com/Jacob-Valor/rspress-plugin-graph-view",
+  "bugs": {
+    "url": "https://github.com/Jacob-Valor/rspress-plugin-graph-view/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Jacob-Valor/rspress-plugin-graph-view.git"
+  },
+  "license": "MIT",
+  "author": "Jacob-Valor <jacob-programmer@tuta.io> (https://github.com/Jacob-Valor)",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./src/index.ts",
+      "default": "./src/index.ts"
+    },
+    "./runtime/*": {
+      "import": "./src/runtime/*",
+      "default": "./src/runtime/*"
+    }
+  },
+  "scripts": {
+    "bench:graph": "bun scripts/bench-graph-build.ts",
+    "build": "tsc --declarationMap false",
+    "dev": "tsc -w",
+    "docs:build": "rspress build",
+    "docs:dev": "rspress dev",
+    "test": "bun test",
+    "prepublishOnly": "bun run build && bun run test"
+  },
+  "devDependencies": {
+    "@types/bun": "latest",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "semantic-release": "^25.0.3",
+    "typescript": "^6.0.2"
+  },
+  "peerDependencies": {
+    "@rspress/core": "^2.0.7",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "react-force-graph-2d": "^1.29.1"
+  },
+  "peerDependenciesMeta": {
+    "typescript": {
+      "optional": true
+    }
+  },
+  "dependencies": {
+    "rspress-plugin-devkit": "^1.0.0"
+  }
+}