{"_id":"@aidps/canvas-flow","_rev":"9-dd44ad4e4a651ddc8bc610680a413d31","name":"@aidps/canvas-flow","dist-tags":{"latest":"1.2.0"},"versions":{"1.0.0":{"name":"@aidps/canvas-flow","version":"1.0.0","keywords":["x6","react","canvas","graph","flowchart","dag"],"author":"","license":"MIT","_id":"@aidps/canvas-flow@1.0.0","maintainers":[{"name":"yimo923923","email":"yimo923@foxmail.com"}],"dist":{"shasum":"23b333f1b75286bc4e1054720e89c5e867353709","tarball":"https://registry.npmjs.org/@aidps/canvas-flow/-/canvas-flow-1.0.0.tgz","fileCount":7,"integrity":"sha512-2Ppz68LluMITnWM4mIpncD0LNkYqMqBum+W5lFHg2IgOyaUS35nGdaBkfnVNHoV0kAtzBCc+Q9Opdlego5nM0g==","signatures":[{"sig":"MEQCIAQYpHnCPM48/YcPjBLl0jbiJhtLJ3gQzw1te1MolgucAiBVg+KuyKndCgZ7AurF3DRwgWUhoPOBaQupVqmt0KeO6g==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":10535467},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","gitHead":"2a4e6afab029ef62dc5c188cca4d644b5dcd7395","scripts":{"dev":"vite","build":"rollup -c","clean":"rm -rf dist","preview":"vite preview","dev:watch":"rollup -c -w","prepublishOnly":"npm run build"},"_npmUser":{"name":"yimo923923","email":"yimo923@foxmail.com"},"repository":{"url":"","type":"git"},"_npmVersion":"10.7.0","description":"基于 X6 2.x 的 React 画布组件库","directories":{},"_nodeVersion":"18.20.4","dependencies":{"react":"^18.2.0","tslib":"^2.8.1","moment":"^2.29.4","@antv/x6":"^2.5.6","react-dom":"^18.2.0","insert-css":"^2.0.0","@codemirror/view":"^6.38.6","@antv/x6-plugin-dnd":"^2.0.4","@antv/x6-react-shape":"^2.1.1","@codemirror/lang-json":"^6.0.1","@uiw/react-codemirror":"^4.19.9","@antv/x6-plugin-history":"^2.2.0","@antv/x6-plugin-minimap":"^2.0.7","@codemirror/lang-python":"^6.1.2","@antv/x6-plugin-keyboard":"^2.2.0","@antv/x6-plugin-snapline":"^2.1.6","@codemirror/autocomplete":"^6.9.1","@antv/x6-plugin-clipboard":"^2.1.4","@antv/x6-plugin-selection":"^2.1.5"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.8","rollup":"^4.9.0","typescript":"^5.3.3","@types/react":"^18.2.45","@types/react-dom":"^18.2.18","rollup-plugin-dts":"^6.1.0","@vitejs/plugin-react":"^4.2.1","@rollup/plugin-commonjs":"^25.0.7","@rollup/plugin-typescript":"^11.1.5","@rollup/plugin-node-resolve":"^15.2.3","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"antd":"^5.2.2","react":"^18.2.0","@antv/x6":"^2.5.6","react-dom":"^18.2.0","@ant-design/pro-components":"^2.3.57"},"_npmOperationalInternal":{"tmp":"tmp/canvas-flow_1.0.0_1764214157158_0.9978117067665253","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@aidps/canvas-flow","version":"1.0.1","keywords":["x6","react","canvas","graph","flowchart","dag"],"author":"","license":"MIT","_id":"@aidps/canvas-flow@1.0.1","maintainers":[{"name":"yimo923923","email":"yimo923@foxmail.com"}],"dist":{"shasum":"0ab101c41f0f242fa7c48481c7ce10c9f39659d3","tarball":"https://registry.npmjs.org/@aidps/canvas-flow/-/canvas-flow-1.0.1.tgz","fileCount":7,"integrity":"sha512-LSuc3MR5nHdC7vSxBCKY+Wc4sHV6W3/rpHvsuOTQ/SRkFN/oFQMiyjexl4zULMNsajSBKUptAcu3/R5b/1F0WA==","signatures":[{"sig":"MEUCIQC8FIGmhE5CMcmHLGjbdjyMAPfMV0vhTHrGqUXO20a/kQIgM6YWnPu/uKfLTMDj/kBAdXdrURp5Y90eSRCi8imkmeM=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":10616261},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.esm.js","require":"./dist/index.js"}},"gitHead":"2a4e6afab029ef62dc5c188cca4d644b5dcd7395","scripts":{"dev":"vite","build":"rollup -c","clean":"rm -rf dist","preview":"vite preview","dev:watch":"rollup -c -w","version:major":"npm version major --no-git-tag-version","version:minor":"npm version minor --no-git-tag-version","version:patch":"npm version patch --no-git-tag-version","prepublishOnly":"npm run build","publish:script":"./publish.sh"},"_npmUser":{"name":"yimo923923","email":"yimo923@foxmail.com"},"_npmVersion":"10.7.0","description":"基于 X6 2.x 的 React 画布组件库","directories":{},"_nodeVersion":"18.20.4","dependencies":{"react":"^18.2.0","tslib":"^2.8.1","moment":"^2.29.4","@antv/x6":"^2.5.6","react-dom":"^18.2.0","insert-css":"^2.0.0","@codemirror/view":"^6.38.6","@antv/x6-plugin-dnd":"^2.0.4","@antv/x6-react-shape":"^2.1.1","@codemirror/lang-json":"^6.0.1","@uiw/react-codemirror":"^4.19.9","@antv/x6-plugin-history":"^2.2.0","@antv/x6-plugin-minimap":"^2.0.7","@codemirror/lang-python":"^6.1.2","@antv/x6-plugin-keyboard":"^2.2.0","@antv/x6-plugin-snapline":"^2.1.6","@codemirror/autocomplete":"^6.9.1","@antv/x6-plugin-clipboard":"^2.1.4","@antv/x6-plugin-selection":"^2.1.5"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.8","rollup":"^4.9.0","typescript":"^5.3.3","@types/react":"^18.2.45","@types/react-dom":"^18.2.18","rollup-plugin-dts":"^6.1.0","@rollup/plugin-url":"^8.0.2","@vitejs/plugin-react":"^4.2.1","@rollup/plugin-commonjs":"^25.0.7","@rollup/plugin-typescript":"^11.1.5","@rollup/plugin-node-resolve":"^15.2.3","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"antd":"^5.2.2","react":"^18.2.0","@antv/x6":"^2.5.6","react-dom":"^18.2.0","@ant-design/pro-components":"^2.3.57"},"_npmOperationalInternal":{"tmp":"tmp/canvas-flow_1.0.1_1764252414214_0.5696298777755764","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@aidps/canvas-flow","version":"1.0.2","keywords":["x6","react","canvas","graph","flowchart","dag"],"author":"","license":"MIT","_id":"@aidps/canvas-flow@1.0.2","maintainers":[{"name":"yimo923923","email":"yimo923@foxmail.com"}],"dist":{"shasum":"daad39bd9374ee6187f3819ee1131c0e3014f3a1","tarball":"https://registry.npmjs.org/@aidps/canvas-flow/-/canvas-flow-1.0.2.tgz","fileCount":7,"integrity":"sha512-JudaKreH1lSpuuCjn3PQ1iUxaadJ2JxTLJSAxb6VoY+Q0D9MXCsjXRmDoAYBoKY92sUCmLx75fgDYQwWRx8AeQ==","signatures":[{"sig":"MEUCIQCZbsubC137eVbbrgk/NxGSjsmgoZHYbM3EGHX0ajC4nQIgJV+6pe3IwgidLdilfqkRZKKfz+JCBMY3LINjf9rxabE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":8983854},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.esm.js","require":"./dist/index.js"}},"gitHead":"85e9f94bd9c008a092d7f00d1196d632360f7798","scripts":{"dev":"vite","build":"rollup -c","clean":"rm -rf dist","preview":"vite preview","clean:all":"npm run clean && npm run clean:demo","dev:watch":"rollup -c -w","build:demo":"npm run build && vite build --config vite.demo.config.ts","clean:demo":"rm -rf dist-demo","preview:demo":"vite preview --config vite.demo.config.ts --outDir dist-demo","version:major":"npm version major --no-git-tag-version","version:minor":"npm version minor --no-git-tag-version","version:patch":"npm version patch --no-git-tag-version","prepublishOnly":"npm run build","publish:script":"./publish.sh"},"_npmUser":{"name":"yimo923923","email":"yimo923@foxmail.com"},"_npmVersion":"10.7.0","description":"基于 X6 2.x 的 React 画布组件库","directories":{},"_nodeVersion":"18.20.4","dependencies":{"tslib":"^2.8.1","moment":"^2.29.4","insert-css":"^2.0.0","@codemirror/view":"^6.38.6","react-router-dom":"^7.9.6","@codemirror/lang-json":"^6.0.1","@uiw/react-codemirror":"^4.19.9","@codemirror/lang-python":"^6.1.2","@types/react-router-dom":"^5.3.3","@codemirror/autocomplete":"^6.9.1"},"_hasShrinkwrap":false,"devDependencies":{"antd":"^5.2.2","vite":"^5.0.8","rollup":"^4.9.0","@antv/x6":"^2.5.6","typescript":"^5.3.3","@types/react":"^18.2.45","@types/react-dom":"^18.2.18","@ant-design/icons":"^5.2.6","rollup-plugin-dts":"^6.1.0","@rollup/plugin-url":"^8.0.2","@antv/x6-plugin-dnd":"^2.0.4","@rollup/plugin-json":"^6.1.0","@antv/x6-react-shape":"^2.1.1","@vitejs/plugin-react":"^4.2.1","@antv/x6-plugin-history":"^2.2.0","@antv/x6-plugin-minimap":"^2.0.7","@rollup/plugin-commonjs":"^25.0.7","@antv/x6-plugin-keyboard":"^2.2.0","@antv/x6-plugin-snapline":"^2.1.6","@antv/x6-plugin-clipboard":"^2.1.4","@antv/x6-plugin-selection":"^2.1.5","@rollup/plugin-typescript":"^11.1.5","@ant-design/pro-components":"^2.3.57","@rollup/plugin-node-resolve":"^15.2.3","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"antd":"^5.2.2","react":"^18.2.0","@antv/x6":"^2.5.6","react-dom":"^18.2.0","@ant-design/icons":"^5.2.6","@antv/x6-react-shape":"^2.1.1","@ant-design/pro-components":"^2.3.57"},"peerDependenciesMeta":{"@antv/x6-plugin-dnd":{"optional":true},"@antv/x6-plugin-history":{"optional":true},"@antv/x6-plugin-minimap":{"optional":true},"@antv/x6-plugin-keyboard":{"optional":true},"@antv/x6-plugin-snapline":{"optional":true},"@antv/x6-plugin-clipboard":{"optional":true},"@antv/x6-plugin-selection":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/canvas-flow_1.0.2_1768387562554_0.3552730396107573","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"name":"@aidps/canvas-flow","version":"1.0.4","keywords":["x6","react","canvas","graph","flowchart","dag"],"author":"","license":"MIT","_id":"@aidps/canvas-flow@1.0.4","maintainers":[{"name":"yimo923923","email":"yimo923@foxmail.com"}],"dist":{"shasum":"daac621c50771de65b8542ad413247f923723d04","tarball":"https://registry.npmjs.org/@aidps/canvas-flow/-/canvas-flow-1.0.4.tgz","fileCount":7,"integrity":"sha512-P/YEbSOsXflFyUUku08yGCHlHVK05sm8OMRy5zubcYUhSCERvJ/Eb4UKGOtzdBlkfbsez8tUH96s3XE9DemfkA==","signatures":[{"sig":"MEMCIBiMRz6K0yP7Ko23eJe+jrve5pFTnCQvQHoBYzgHkSTyAh9dHGVfGCC9bhytSWgoQ6nwylgg8JVJWb1Fhuq8gfeG","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":9033557},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.esm.js","require":"./dist/index.js"}},"gitHead":"1cca9cd8d6429f0fc339a0bea05f1d296cef49d2","scripts":{"dev":"vite","build":"rollup -c","clean":"rm -rf dist","preview":"vite preview","clean:all":"npm run clean && npm run clean:demo","dev:watch":"rollup -c -w","build:demo":"npm run build && vite build --config vite.demo.config.ts","clean:demo":"rm -rf dist-demo","preview:demo":"vite preview --config vite.demo.config.ts --outDir dist-demo","version:major":"npm version major --no-git-tag-version","version:minor":"npm version minor --no-git-tag-version","version:patch":"npm version patch --no-git-tag-version","prepublishOnly":"npm run build","publish:script":"./publish.sh"},"_npmUser":{"name":"yimo923923","email":"yimo923@foxmail.com"},"_npmVersion":"10.7.0","description":"基于 X6 2.x 的 React 画布组件库","directories":{},"_nodeVersion":"18.20.4","dependencies":{"tslib":"^2.8.1","moment":"^2.29.4","insert-css":"^2.0.0","@codemirror/view":"^6.38.6","react-router-dom":"^7.9.6","@codemirror/lang-json":"^6.0.1","@uiw/react-codemirror":"^4.19.9","@codemirror/lang-python":"^6.1.2","@types/react-router-dom":"^5.3.3","@codemirror/autocomplete":"^6.9.1"},"_hasShrinkwrap":false,"devDependencies":{"antd":"^5.2.2","vite":"^5.0.8","rollup":"^4.9.0","@antv/x6":"^2.5.6","typescript":"^5.3.3","@types/react":"^18.2.45","@types/react-dom":"^18.2.18","@ant-design/icons":"^5.2.6","rollup-plugin-dts":"^6.1.0","@rollup/plugin-url":"^8.0.2","@antv/x6-plugin-dnd":"^2.0.4","@rollup/plugin-json":"^6.1.0","@antv/x6-react-shape":"^2.1.1","@vitejs/plugin-react":"^4.2.1","@antv/x6-plugin-history":"^2.2.0","@antv/x6-plugin-minimap":"^2.0.7","@rollup/plugin-commonjs":"^25.0.7","@antv/x6-plugin-keyboard":"^2.2.0","@antv/x6-plugin-snapline":"^2.1.6","@antv/x6-plugin-clipboard":"^2.1.4","@antv/x6-plugin-selection":"^2.1.5","@rollup/plugin-typescript":"^11.1.5","@ant-design/pro-components":"^2.3.57","@rollup/plugin-node-resolve":"^15.2.3","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"antd":"^5.2.2","react":"^18.2.0","@antv/x6":"^2.5.6","react-dom":"^18.2.0","@ant-design/icons":"^5.2.6","@antv/x6-react-shape":"^2.1.1","@ant-design/pro-components":"^2.3.57"},"peerDependenciesMeta":{"@antv/x6-plugin-dnd":{"optional":true},"@antv/x6-plugin-history":{"optional":true},"@antv/x6-plugin-minimap":{"optional":true},"@antv/x6-plugin-keyboard":{"optional":true},"@antv/x6-plugin-snapline":{"optional":true},"@antv/x6-plugin-clipboard":{"optional":true},"@antv/x6-plugin-selection":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/canvas-flow_1.0.4_1769666907537_0.3482447390468495","host":"s3://npm-registry-packages-npm-production"}},"1.0.5":{"name":"@aidps/canvas-flow","version":"1.0.5","keywords":["x6","react","canvas","graph","flowchart","dag"],"author":"","license":"MIT","_id":"@aidps/canvas-flow@1.0.5","maintainers":[{"name":"yimo923923","email":"yimo923@foxmail.com"}],"dist":{"shasum":"91394f6138520ac591818cf78cf1b70f4ebf8f90","tarball":"https://registry.npmjs.org/@aidps/canvas-flow/-/canvas-flow-1.0.5.tgz","fileCount":7,"integrity":"sha512-Q2RcqjBZewwnzUb5xXVCAQH51ma4P8GEONF37qTfErFa96nk1nZTdDpMgsKwRrajcYxaKNMR80J7s7SbVeWsZA==","signatures":[{"sig":"MEQCID+XI5s1laXAfw3/QT/YiGQnKRdT+tRis+j3kifr3+8XAiAxyeRsJg9NNwV6v8gMksoKaRxRlJj/dz9vmH6Hngvf+A==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":9188170},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.esm.js","require":"./dist/index.js"}},"gitHead":"7e10219ee8e2a002c9106b60feb7b3b47033b7d3","scripts":{"dev":"vite","build":"rollup -c","clean":"rm -rf dist","preview":"vite preview","clean:all":"npm run clean && npm run clean:demo","dev:watch":"rollup -c -w","build:demo":"npm run build && vite build --config vite.demo.config.ts","clean:demo":"rm -rf dist-demo","preview:demo":"vite preview --config vite.demo.config.ts --outDir dist-demo","version:major":"npm version major --no-git-tag-version","version:minor":"npm version minor --no-git-tag-version","version:patch":"npm version patch --no-git-tag-version","prepublishOnly":"npm run build","publish:script":"./publish.sh"},"_npmUser":{"name":"yimo923923","email":"yimo923@foxmail.com"},"_npmVersion":"10.7.0","description":"基于 X6 2.x 的 React 画布组件库","directories":{},"_nodeVersion":"18.20.4","dependencies":{"tslib":"^2.8.1","moment":"^2.29.4","insert-css":"^2.0.0","@codemirror/view":"^6.38.6","react-router-dom":"^7.9.6","@codemirror/lang-json":"^6.0.1","@uiw/react-codemirror":"^4.19.9","@codemirror/lang-python":"^6.1.2","@types/react-router-dom":"^5.3.3","@codemirror/autocomplete":"^6.9.1"},"_hasShrinkwrap":false,"devDependencies":{"antd":"^5.2.2","vite":"^5.0.8","rollup":"^4.9.0","@antv/x6":"^2.5.6","typescript":"^5.3.3","@types/react":"^18.2.45","@types/react-dom":"^18.2.18","@ant-design/icons":"^5.2.6","rollup-plugin-dts":"^6.1.0","@rollup/plugin-url":"^8.0.2","@antv/x6-plugin-dnd":"^2.0.4","@rollup/plugin-json":"^6.1.0","@antv/x6-react-shape":"^2.1.1","@vitejs/plugin-react":"^4.2.1","@antv/x6-plugin-history":"^2.2.0","@antv/x6-plugin-minimap":"^2.0.7","@rollup/plugin-commonjs":"^25.0.7","@antv/x6-plugin-keyboard":"^2.2.0","@antv/x6-plugin-snapline":"^2.1.6","@antv/x6-plugin-clipboard":"^2.1.4","@antv/x6-plugin-selection":"^2.1.5","@rollup/plugin-typescript":"^11.1.5","@ant-design/pro-components":"^2.3.57","@rollup/plugin-node-resolve":"^15.2.3","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"antd":"^5.2.2","react":"^18.2.0","@antv/x6":"^2.5.6","react-dom":"^18.2.0","@ant-design/icons":"^5.2.6","@antv/x6-react-shape":"^2.1.1","@ant-design/pro-components":"^2.3.57"},"peerDependenciesMeta":{"@antv/x6-plugin-dnd":{"optional":true},"@antv/x6-plugin-history":{"optional":true},"@antv/x6-plugin-minimap":{"optional":true},"@antv/x6-plugin-keyboard":{"optional":true},"@antv/x6-plugin-snapline":{"optional":true},"@antv/x6-plugin-clipboard":{"optional":true},"@antv/x6-plugin-selection":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/canvas-flow_1.0.5_1769686683172_0.5168688210020607","host":"s3://npm-registry-packages-npm-production"}},"1.0.6":{"name":"@aidps/canvas-flow","version":"1.0.6","keywords":["x6","react","canvas","graph","flowchart","dag"],"author":"","license":"MIT","_id":"@aidps/canvas-flow@1.0.6","maintainers":[{"name":"yimo923923","email":"yimo923@foxmail.com"}],"dist":{"shasum":"93b51d27234c097468f342d6780577ce1dbd674e","tarball":"https://registry.npmjs.org/@aidps/canvas-flow/-/canvas-flow-1.0.6.tgz","fileCount":7,"integrity":"sha512-jTLHCI44eHMxf2iXtKUOqsLX8Gi/Ocwet5K2kpf/2XEREhyiq5fZGO48cTGMVzu7FopkrOgKnpJu0MidxNFKzw==","signatures":[{"sig":"MEYCIQCKOdi8PPP6Q64HiLDul3dmH4s3+m5nc45OUHEwGCWcOwIhAJzuddjCl4lW6YPNlj8L/ufGNoCh2e1qfhIn5kzzPhww","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":9191092},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.esm.js","require":"./dist/index.js"}},"gitHead":"7e10219ee8e2a002c9106b60feb7b3b47033b7d3","scripts":{"dev":"vite","build":"rollup -c","clean":"rm -rf dist","preview":"vite preview","clean:all":"npm run clean && npm run clean:demo","dev:watch":"rollup -c -w","build:demo":"npm run build && vite build --config vite.demo.config.ts","clean:demo":"rm -rf dist-demo","preview:demo":"vite preview --config vite.demo.config.ts --outDir dist-demo","version:major":"npm version major --no-git-tag-version","version:minor":"npm version minor --no-git-tag-version","version:patch":"npm version patch --no-git-tag-version","prepublishOnly":"npm run build","publish:script":"./publish.sh"},"_npmUser":{"name":"yimo923923","email":"yimo923@foxmail.com"},"_npmVersion":"10.7.0","description":"基于 X6 2.x 的 React 画布组件库","directories":{},"_nodeVersion":"18.20.4","dependencies":{"tslib":"^2.8.1","moment":"^2.29.4","insert-css":"^2.0.0","@codemirror/view":"^6.38.6","react-router-dom":"^7.9.6","@codemirror/lang-json":"^6.0.1","@uiw/react-codemirror":"^4.19.9","@codemirror/lang-python":"^6.1.2","@types/react-router-dom":"^5.3.3","@codemirror/autocomplete":"^6.9.1"},"_hasShrinkwrap":false,"devDependencies":{"antd":"^5.2.2","vite":"^5.0.8","rollup":"^4.9.0","@antv/x6":"^2.5.6","typescript":"^5.3.3","@types/react":"^18.2.45","@types/react-dom":"^18.2.18","@ant-design/icons":"^5.2.6","rollup-plugin-dts":"^6.1.0","@rollup/plugin-url":"^8.0.2","@antv/x6-plugin-dnd":"^2.0.4","@rollup/plugin-json":"^6.1.0","@antv/x6-react-shape":"^2.1.1","@vitejs/plugin-react":"^4.2.1","@antv/x6-plugin-history":"^2.2.0","@antv/x6-plugin-minimap":"^2.0.7","@rollup/plugin-commonjs":"^25.0.7","@antv/x6-plugin-keyboard":"^2.2.0","@antv/x6-plugin-snapline":"^2.1.6","@antv/x6-plugin-clipboard":"^2.1.4","@antv/x6-plugin-selection":"^2.1.5","@rollup/plugin-typescript":"^11.1.5","@ant-design/pro-components":"^2.3.57","@rollup/plugin-node-resolve":"^15.2.3","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"antd":"^5.2.2","react":"^18.2.0","@antv/x6":"^2.5.6","react-dom":"^18.2.0","@ant-design/icons":"^5.2.6","@antv/x6-react-shape":"^2.1.1","@ant-design/pro-components":"^2.3.57"},"peerDependenciesMeta":{"@antv/x6-plugin-dnd":{"optional":true},"@antv/x6-plugin-history":{"optional":true},"@antv/x6-plugin-minimap":{"optional":true},"@antv/x6-plugin-keyboard":{"optional":true},"@antv/x6-plugin-snapline":{"optional":true},"@antv/x6-plugin-clipboard":{"optional":true},"@antv/x6-plugin-selection":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/canvas-flow_1.0.6_1769739234681_0.0693440590004828","host":"s3://npm-registry-packages-npm-production"}},"1.1.0":{"name":"@aidps/canvas-flow","version":"1.1.0","keywords":["x6","react","canvas","graph","flowchart","dag"],"author":"","license":"MIT","_id":"@aidps/canvas-flow@1.1.0","maintainers":[{"name":"yimo923923","email":"yimo923@foxmail.com"}],"dist":{"shasum":"553d1dae942ec1e51811d55760a50fb13390d59c","tarball":"https://registry.npmjs.org/@aidps/canvas-flow/-/canvas-flow-1.1.0.tgz","fileCount":7,"integrity":"sha512-dDBpySIPUbGAJcE6aCTSxZmAUzAnkb6J93S161xs/wI0stVLWMxxBxnDkiYIrbu6gtMWTTTQJj58AYjoIY2EkQ==","signatures":[{"sig":"MEUCIQC3HvajkPu+ieTeOxaPtNp+skFf8DWTYL4RXydPYxk2AgIgK45cRdWf1sVNLpI9y0l2oK6WwPdXQcWc46B4vlzq5I4=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":9222898},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.esm.js","require":"./dist/index.js"}},"gitHead":"7e10219ee8e2a002c9106b60feb7b3b47033b7d3","scripts":{"dev":"vite","build":"rollup -c","clean":"rm -rf dist","preview":"vite preview","clean:all":"npm run clean && npm run clean:demo","dev:watch":"rollup -c -w","build:demo":"npm run build && vite build --config vite.demo.config.ts","clean:demo":"rm -rf dist-demo","preview:demo":"vite preview --config vite.demo.config.ts --outDir dist-demo","version:major":"npm version major --no-git-tag-version","version:minor":"npm version minor --no-git-tag-version","version:patch":"npm version patch --no-git-tag-version","prepublishOnly":"npm run build","publish:script":"./publish.sh"},"_npmUser":{"name":"yimo923923","email":"yimo923@foxmail.com"},"_npmVersion":"10.7.0","description":"基于 X6 2.x 的 React 画布组件库","directories":{},"_nodeVersion":"18.20.4","dependencies":{"tslib":"^2.8.1","moment":"^2.29.4","insert-css":"^2.0.0","@codemirror/view":"^6.38.6","react-router-dom":"^7.9.6","@codemirror/lang-json":"^6.0.1","@uiw/react-codemirror":"^4.19.9","@codemirror/lang-python":"^6.1.2","@types/react-router-dom":"^5.3.3","@codemirror/autocomplete":"^6.9.1"},"_hasShrinkwrap":false,"devDependencies":{"antd":"^5.2.2","vite":"^5.0.8","rollup":"^4.9.0","@antv/x6":"^2.5.6","typescript":"^5.3.3","@types/react":"^18.2.45","@types/react-dom":"^18.2.18","@ant-design/icons":"^5.2.6","rollup-plugin-dts":"^6.1.0","@rollup/plugin-url":"^8.0.2","@antv/x6-plugin-dnd":"^2.0.4","@rollup/plugin-json":"^6.1.0","@antv/x6-react-shape":"^2.1.1","@vitejs/plugin-react":"^4.2.1","@antv/x6-plugin-history":"^2.2.0","@antv/x6-plugin-minimap":"^2.0.7","@rollup/plugin-commonjs":"^25.0.7","@antv/x6-plugin-keyboard":"^2.2.0","@antv/x6-plugin-snapline":"^2.1.6","@antv/x6-plugin-clipboard":"^2.1.4","@antv/x6-plugin-selection":"^2.1.5","@rollup/plugin-typescript":"^11.1.5","@ant-design/pro-components":"^2.3.57","@rollup/plugin-node-resolve":"^15.2.3","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"antd":"^5.2.2","react":"^18.2.0","@antv/x6":"^2.5.6","react-dom":"^18.2.0","@ant-design/icons":"^5.2.6","@antv/x6-react-shape":"^2.1.1","@ant-design/pro-components":"^2.3.57"},"peerDependenciesMeta":{"@antv/x6-plugin-dnd":{"optional":true},"@antv/x6-plugin-history":{"optional":true},"@antv/x6-plugin-minimap":{"optional":true},"@antv/x6-plugin-keyboard":{"optional":true},"@antv/x6-plugin-snapline":{"optional":true},"@antv/x6-plugin-clipboard":{"optional":true},"@antv/x6-plugin-selection":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/canvas-flow_1.1.0_1769758367820_0.08379765772870584","host":"s3://npm-registry-packages-npm-production"}},"1.1.1":{"name":"@aidps/canvas-flow","version":"1.1.1","keywords":["x6","react","canvas","graph","flowchart","dag"],"author":"","license":"MIT","_id":"@aidps/canvas-flow@1.1.1","maintainers":[{"name":"yimo923923","email":"yimo923@foxmail.com"}],"dist":{"shasum":"b3d23653845d390b5c6104a465f347a1061fa32a","tarball":"https://registry.npmjs.org/@aidps/canvas-flow/-/canvas-flow-1.1.1.tgz","fileCount":7,"integrity":"sha512-S3HI9+HVEt7Xcjvo897rHHx1L7NuWEVfxL0aRSYAznp1j1pUvLkEx7I9iy/wYWgUXFq+0wHwHIFN2ilwnBf2Sg==","signatures":[{"sig":"MEUCIGDx9ECkk8OyAiSjlVhcsn57mDX7U8cnI5h4GlB9gF6IAiEApbjaJ+MwSauyi7m9AK6jNgBL35PUViJSUtKihpA5inc=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":9297655},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.esm.js","require":"./dist/index.js"}},"gitHead":"7e10219ee8e2a002c9106b60feb7b3b47033b7d3","scripts":{"dev":"vite","build":"rollup -c","clean":"rm -rf dist","preview":"vite preview","clean:all":"npm run clean && npm run clean:demo","dev:watch":"rollup -c -w","build:demo":"npm run build && vite build --config vite.demo.config.ts","clean:demo":"rm -rf dist-demo","preview:demo":"vite preview --config vite.demo.config.ts --outDir dist-demo","version:major":"npm version major --no-git-tag-version","version:minor":"npm version minor --no-git-tag-version","version:patch":"npm version patch --no-git-tag-version","prepublishOnly":"npm run build","publish:script":"./publish.sh"},"_npmUser":{"name":"yimo923923","email":"yimo923@foxmail.com"},"_npmVersion":"10.7.0","description":"基于 X6 2.x 的 React 画布组件库","directories":{},"_nodeVersion":"18.20.4","dependencies":{"tslib":"^2.8.1","moment":"^2.29.4","insert-css":"^2.0.0","@codemirror/view":"^6.38.6","react-router-dom":"^7.9.6","@codemirror/lang-json":"^6.0.1","@uiw/react-codemirror":"^4.19.9","@codemirror/lang-python":"^6.1.2","@types/react-router-dom":"^5.3.3","@codemirror/autocomplete":"^6.9.1"},"_hasShrinkwrap":false,"devDependencies":{"antd":"^5.2.2","vite":"^5.0.8","rollup":"^4.9.0","@antv/x6":"^2.5.6","typescript":"^5.3.3","@types/react":"^18.2.45","@types/react-dom":"^18.2.18","@ant-design/icons":"^5.2.6","rollup-plugin-dts":"^6.1.0","@rollup/plugin-url":"^8.0.2","@antv/x6-plugin-dnd":"^2.0.4","@rollup/plugin-json":"^6.1.0","@antv/x6-react-shape":"^2.1.1","@vitejs/plugin-react":"^4.2.1","@antv/x6-plugin-history":"^2.2.0","@antv/x6-plugin-minimap":"^2.0.7","@rollup/plugin-commonjs":"^25.0.7","@antv/x6-plugin-keyboard":"^2.2.0","@antv/x6-plugin-snapline":"^2.1.6","@antv/x6-plugin-clipboard":"^2.1.4","@antv/x6-plugin-selection":"^2.1.5","@rollup/plugin-typescript":"^11.1.5","@ant-design/pro-components":"^2.3.57","@rollup/plugin-node-resolve":"^15.2.3","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"antd":"^5.2.2","react":"^18.2.0","@antv/x6":"^2.5.6","react-dom":"^18.2.0","@ant-design/icons":"^5.2.6","@antv/x6-react-shape":"^2.1.1","@ant-design/pro-components":"^2.3.57"},"peerDependenciesMeta":{"@antv/x6-plugin-dnd":{"optional":true},"@antv/x6-plugin-history":{"optional":true},"@antv/x6-plugin-minimap":{"optional":true},"@antv/x6-plugin-keyboard":{"optional":true},"@antv/x6-plugin-snapline":{"optional":true},"@antv/x6-plugin-clipboard":{"optional":true},"@antv/x6-plugin-selection":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/canvas-flow_1.1.1_1769762841806_0.6832669627453489","host":"s3://npm-registry-packages-npm-production"}},"1.2.0":{"name":"@aidps/canvas-flow","version":"1.2.0","description":"基于 X6 2.x 的 React 画布组件库","main":"dist/index.js","module":"dist/index.esm.js","types":"dist/index.d.ts","exports":{".":{"import":"./dist/index.esm.js","require":"./dist/index.js","types":"./dist/index.d.ts"}},"scripts":{"build":"rollup -c","build:demo":"npm run build && vite build --config vite.demo.config.ts","dev":"vite","dev:watch":"rollup -c -w","preview":"vite preview","preview:demo":"vite preview --config vite.demo.config.ts --outDir dist-demo","clean":"rm -rf dist","clean:demo":"rm -rf dist-demo","clean:all":"npm run clean && npm run clean:demo","prepublishOnly":"npm run build","publish:script":"./publish.sh","version:patch":"npm version patch --no-git-tag-version","version:minor":"npm version minor --no-git-tag-version","version:major":"npm version major --no-git-tag-version"},"keywords":["x6","react","canvas","graph","flowchart","dag"],"author":"","license":"MIT","peerDependencies":{"@ant-design/icons":"^5.2.6","@ant-design/pro-components":"^2.3.57","@antv/x6":"^2.5.6","@antv/x6-react-shape":"^2.1.1","antd":"^5.2.2","react":"^18.2.0","react-dom":"^18.2.0"},"peerDependenciesMeta":{"@antv/x6-plugin-clipboard":{"optional":true},"@antv/x6-plugin-dnd":{"optional":true},"@antv/x6-plugin-history":{"optional":true},"@antv/x6-plugin-keyboard":{"optional":true},"@antv/x6-plugin-minimap":{"optional":true},"@antv/x6-plugin-selection":{"optional":true},"@antv/x6-plugin-snapline":{"optional":true}},"devDependencies":{"@ant-design/icons":"^5.2.6","@ant-design/pro-components":"^2.3.57","@antv/x6":"^2.5.6","@antv/x6-plugin-clipboard":"^2.1.4","@antv/x6-plugin-dnd":"^2.0.4","@antv/x6-plugin-history":"^2.2.0","@antv/x6-plugin-keyboard":"^2.2.0","@antv/x6-plugin-minimap":"^2.0.7","@antv/x6-plugin-selection":"^2.1.5","@antv/x6-plugin-snapline":"^2.1.6","@antv/x6-react-shape":"^2.1.1","@rollup/plugin-commonjs":"^25.0.7","@rollup/plugin-json":"^6.1.0","@rollup/plugin-node-resolve":"^15.2.3","@rollup/plugin-typescript":"^11.1.5","@rollup/plugin-url":"^8.0.2","@types/react":"^18.2.45","@types/react-dom":"^18.2.18","@vitejs/plugin-react":"^4.2.1","antd":"^5.2.2","rollup":"^4.9.0","rollup-plugin-dts":"^6.1.0","rollup-plugin-peer-deps-external":"^2.2.4","typescript":"^5.3.3","vite":"^5.0.8"},"dependencies":{"@codemirror/autocomplete":"^6.9.1","@codemirror/lang-json":"^6.0.1","@codemirror/lang-python":"^6.1.2","@codemirror/view":"^6.38.6","@types/react-router-dom":"^5.3.3","@uiw/react-codemirror":"^4.19.9","insert-css":"^2.0.0","moment":"^2.29.4","react-router-dom":"^7.9.6","tslib":"^2.8.1"},"_id":"@aidps/canvas-flow@1.2.0","gitHead":"7e10219ee8e2a002c9106b60feb7b3b47033b7d3","_nodeVersion":"18.20.4","_npmVersion":"10.7.0","dist":{"integrity":"sha512-3+IRPogYDhMiQqQInQQX7FNTy8rORpWGyWuD4L5KvbL7jSLn3/lxwalGHCTRQ5pe4wyGkT/cQ5GSChDoCLLDhg==","shasum":"35ed9ae74be08e569588f1d1739b56be5aaa4da4","tarball":"https://registry.npmjs.org/@aidps/canvas-flow/-/canvas-flow-1.2.0.tgz","fileCount":7,"unpackedSize":9299157,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIGXg4fOFiblAuKWBOKjTCt+Trpu6w16BW+DwEb8ZRazjAiBM3VullaSoEWa8VczhCsyMAgH/1RXVXNcnkTeb2Mh9lA=="}]},"_npmUser":{"name":"yimo923923","email":"yimo923@foxmail.com"},"directories":{},"maintainers":[{"name":"yimo923923","email":"yimo923@foxmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/canvas-flow_1.2.0_1769771623772_0.43551115186236844"},"_hasShrinkwrap":false}},"time":{"created":"2025-11-27T03:29:17.070Z","modified":"2026-01-30T11:13:44.127Z","1.0.0":"2025-11-27T03:29:17.379Z","1.0.1":"2025-11-27T14:06:54.417Z","1.0.2":"2026-01-14T10:46:02.770Z","1.0.4":"2026-01-29T06:08:27.818Z","1.0.5":"2026-01-29T11:38:03.390Z","1.0.6":"2026-01-30T02:13:54.915Z","1.1.0":"2026-01-30T07:32:48.102Z","1.1.1":"2026-01-30T08:47:22.001Z","1.2.0":"2026-01-30T11:13:43.995Z"},"license":"MIT","keywords":["x6","react","canvas","graph","flowchart","dag"],"description":"基于 X6 2.x 的 React 画布组件库","maintainers":[{"name":"yimo923923","email":"yimo923@foxmail.com"}],"readme":"# @aidps/canvas-flow\n\n基于 X6 2.x 的 React 画布组件库，提供高度封装的画布组件、插件系统、菜单功能和函数封装能力。\n\n## 特性\n\n- 🌱 **易于使用**：提供更符合 React 习惯的组件化 API\n- 🚀 **统一状态管理**：服务和画布数据统一管理\n- 🧲 **多画布支持**：每个画布组件拥有独立的状态和实例\n- 💯 **开箱即用**：内置大量画布组件和插件\n- 🔒 **只读模式**：支持函数封装模式下的自动只读\n- 📦 **函数封装**：支持将画布封装为可复用的函数\n\n## 安装\n\n```bash\nnpm install @aidps/canvas-flow\n# 或\npnpm add @aidps/canvas-flow\n# 或\nyarn add @aidps/canvas-flow\n```\n\n## 快速开始\n\n### 基础用法\n\n```tsx\nimport React from 'react';\nimport { XFlow, XFlowGraph, SelectionPlugin, SnaplinePlugin } from '@aidps/canvas-flow';\n\nconst App = () => {\n return (\n \n \n \n \n \n );\n};\n```\n\n### 完整示例\n\n```tsx\nimport React from 'react';\nimport {\n XFlow,\n XFlowGraph,\n SelectionPlugin,\n SnaplinePlugin,\n KeyboardPlugin,\n ClipboardPlugin,\n HistoryPlugin,\n useXFlow,\n} from '@aidps/canvas-flow';\n\nconst MyComponent = () => {\n const { graph } = useXFlow();\n\n const handleAddNode = () => {\n if (graph) {\n graph.addNode({\n shape: 'rect',\n x: 100,\n y: 100,\n width: 80,\n height: 40,\n label: 'Node',\n });\n }\n };\n\n return (\n
\n \n
\n );\n};\n\nconst App = () => {\n return (\n
\n {\n console.log('画布已就绪', graph);\n }}\n >\n \n \n \n \n \n \n \n \n
\n );\n};\n```\n\n## API 文档\n\n### 核心组件\n\n#### XFlow\n\n根组件，提供画布上下文。所有画布相关组件必须包裹在 `XFlow` 内部。\n\n**Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `children` | `React.ReactNode` | - | 子组件 |\n| `onReady` | `(graph: Graph) => void` | - | 画布就绪回调，返回 Graph 实例 |\n| `enableMenus` | `boolean` | `false` | 是否启用菜单功能（节点和边的右键菜单） |\n| `showConfigPanel` | `boolean` | `true` | 是否显示配置面板 |\n| `showOperatorMenu` | `boolean` | `true` | 是否显示算子菜单 |\n| `showMinimap` | `boolean` | `true` | 是否显示小地图 |\n\n**示例：**\n\n```tsx\n {\n console.log('画布已就绪', graph);\n }}\n>\n \n\n```\n\n#### XFlowGraph\n\n画布组件，封装 X6 Graph。自动支持函数封装模式的只读控制。\n\n**Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `config` | `Partial` | - | 画布配置，参考 X6 GraphOptions |\n| `onReady` | `(graph: Graph) => void` | - | 画布就绪回调 |\n| `onDestroy` | `() => void` | - | 画布销毁回调 |\n| `className` | `string` | - | 容器类名 |\n| `style` | `React.CSSProperties` | - | 容器样式 |\n| `enableMenus` | `boolean` | `false` | 是否启用菜单功能 |\n\n**配置项（config）：**\n\n```typescript\ninterface GraphConfig {\n grid?: boolean | GridOptions; // 网格\n autoResize?: boolean; // 自动调整大小\n panning?: PanningOptions; // 平移配置\n background?: BackgroundOptions; // 背景配置\n mousewheel?: MouseWheelOptions; // 鼠标滚轮配置\n scaling?: ScalingOptions; // 缩放配置\n connecting?: ConnectingOptions; // 连线配置\n translating?: TranslatingOptions; // 平移限制\n interacting?: InteractingOptions; // 交互配置\n}\n```\n\n**示例：**\n\n```tsx\n\n```\n\n**只读模式：**\n\n当使用 `CanvasFunctionProvider` 包裹并进入函数封装模式时，`XFlowGraph` 会自动进入只读模式：\n- 禁止节点移动\n- 禁止连线操作\n- 禁止边的编辑\n- 禁止端点移动\n- 仍可点击节点查看配置\n- 仍可平移和缩放画布\n\n### 插件组件\n\n#### SelectionPlugin\n\n框选插件，支持框选多个节点。\n\n**Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `rubberband` | `boolean` | `false` | 是否启用框选 |\n| `showNodeSelectionBox` | `boolean` | `false` | 是否显示节点选择框 |\n| `modifiers` | `string[]` | - | 触发框选的修饰键，如 `['ctrl', 'meta']` |\n| `strict` | `boolean` | `false` | 是否严格模式（节点必须完全在框内） |\n\n**示例：**\n\n```tsx\n\n```\n\n#### SnaplinePlugin\n\n对齐线插件，拖拽节点时显示对齐线。\n\n**Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `sharp` | `boolean` | `false` | 是否启用锐利对齐线 |\n| `resizing` | `boolean` | `false` | 是否在调整大小时显示对齐线 |\n| `filter` | `string \\| Function` | - | 过滤节点 |\n\n**示例：**\n\n```tsx\n\n```\n\n#### KeyboardPlugin\n\n键盘快捷键插件。\n\n**功能：**\n- `Ctrl/Cmd + Z`: 撤销\n- `Ctrl/Cmd + Shift + Z`: 重做\n- `Ctrl/Cmd + A`: 全选\n- `Backspace`: 删除选中元素\n- `Ctrl/Cmd + 1`: 放大\n- `Ctrl/Cmd + 2`: 缩小\n\n**示例：**\n\n```tsx\n\n```\n\n#### ClipboardPlugin\n\n剪贴板插件，支持复制粘贴。\n\n**示例：**\n\n```tsx\n\n```\n\n#### HistoryPlugin\n\n历史记录插件，支持撤销/重做。\n\n**示例：**\n\n```tsx\n\n```\n\n#### MinimapPlugin\n\n小地图插件。\n\n**Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `width` | `number` | `200` | 小地图宽度 |\n| `height` | `number` | `150` | 小地图高度 |\n| `padding` | `number` | `10` | 内边距 |\n| `simple` | `boolean` | `false` | 是否使用简单模式 |\n| `style` | `React.CSSProperties` | - | 容器样式 |\n\n**示例：**\n\n```tsx\n\n```\n\n### 菜单组件\n\n#### OperatorMenu\n\n算子菜单组件，提供树状结构的算子菜单，支持拖拽功能。\n\n**Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `data` | `OperatorMenuItem[]` | - | 菜单数据 |\n| `draggable` | `boolean \\| { icon: boolean }` | `false` | 是否可拖拽 |\n| `onDragStart` | `(e: DragEvent, node: OperatorMenuItem) => void` | - | 拖拽开始回调 |\n| `showIcon` | `boolean` | `true` | 是否显示图标 |\n| `showLine` | `boolean` | `true` | 是否显示连接线 |\n| `enableSearch` | `boolean` | `true` | 是否启用搜索 |\n| `searchPlaceholder` | `string` | `\"搜索算子\"` | 搜索框占位符 |\n| `loading` | `boolean` | `false` | 加载状态 |\n| `emptyText` | `string` | `\"暂无算子数据\"` | 空数据提示 |\n| `onNodeClick` | `(e: React.MouseEvent, node: OperatorMenuItem) => void` | - | 节点点击回调 |\n| `defaultExpandedKeys` | `React.Key[]` | - | 默认展开的节点 |\n\n**示例：**\n\n```tsx\nimport { OperatorMenu, OperatorMenuItem } from '@aidps/canvas-flow';\n\nconst menuData: OperatorMenuItem[] = [\n {\n id: '1',\n pid: null,\n label: '数据源',\n children: [\n {\n id: '1-1',\n pid: '1',\n label: 'CSV读取',\n shape: 'csv',\n },\n ],\n },\n];\n\nfunction App() {\n const handleDragStart = (e: React.DragEvent, node: OperatorMenuItem) => {\n // 处理拖拽逻辑\n };\n\n return (\n \n );\n}\n```\n\n#### NodeMenu / EdgeMenu\n\n节点/边配置弹窗组件（Modal）。默认在节点/边点击时打开（需启用 `enableMenus`）。\n\n#### 右键上下文菜单\n\n启用 `enableMenus` 后，画布会提供内置的右键上下文菜单：\n- 节点右键：删除节点、克隆一份、居中到该节点、复制节点 JSON\n- 边右键：删除边\n- 画布空白右键：在此处新增节点、从缓存粘贴节点、撤销/重做、居中、放大/缩小\n\n示例：\n\n```tsx\nimport { XFlow, XFlowGraph } from '@aidps/canvas-flow';\n\nexport default () => (\n \n \n \n);\n```\n\n**NodeMenu Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `open` | `boolean` | - | 是否打开 |\n| `onClose` | `() => void` | - | 关闭回调 |\n| `node` | `Node \\| null` | - | 节点实例 |\n| `title` | `string` | - | 菜单标题 |\n| `children` | `React.ReactNode` | - | 菜单内容 |\n\n**EdgeMenu Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `open` | `boolean` | - | 是否打开 |\n| `onClose` | `() => void` | - | 关闭回调 |\n| `edge` | `Edge \\| null` | - | 边实例 |\n| `children` | `React.ReactNode` | - | 菜单内容 |\n\n**示例：**\n\n```tsx\nimport { NodeMenu, EdgeMenu, useMenu } from '@aidps/canvas-flow';\n\nconst CustomNodeMenu = () => {\n const { nodeMenuOpen, selectedNode, closeNodeMenu } = useMenu();\n\n return (\n \n \n \n \n );\n};\n```\n\n### 画布函数封装\n\n#### CanvasFunctionProvider\n\n函数封装上下文提供者，用于管理函数封装状态。\n\n**示例：**\n\n```tsx\nimport { CanvasFunctionProvider, FunctionModeToolbar } from '@aidps/canvas-flow';\n\nfunction App() {\n return (\n \n \n \n \n \n \n );\n}\n```\n\n#### FunctionModeToolbar\n\n函数封装模式工具栏，用于切换参数选择模式。\n\n**Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `size` | `'small' \\| 'middle' \\| 'large'` | `'middle'` | 按钮尺寸 |\n| `style` | `React.CSSProperties` | - | 自定义样式 |\n| `className` | `string` | - | 自定义类名 |\n| `entryType` | `'node' \\| 'function' \\| 'both'` | `'both'` | 入口按钮显示控制 |\n\n**示例：**\n\n```tsx\n\n\n\n```\n\n#### OutputPortsPanel\n\n输出链接桩面板，显示所有节点的输出链接桩。\n\n**Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `title` | `string` | `\"选择输出链接桩\"` | 面板标题 |\n| `embedded` | `boolean` | `false` | 是否以嵌入模式显示 |\n| `style` | `React.CSSProperties` | - | 自定义样式 |\n| `className` | `string` | - | 自定义类名 |\n\n**示例：**\n\n```tsx\n\n```\n\n#### FunctionSummaryModal\n\n函数封装汇总弹窗，显示所有已选择的输入参数和输出链接桩。\n\n**Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `title` | `string` | `\"画布函数封装\"` | 弹窗标题 |\n| `width` | `number \\| string` | `800` | 弹窗宽度 |\n| `onClose` | `() => void` | - | 关闭回调 |\n| `onConfirm` | `(data: { inputs: SelectedParam[]; outputs: SelectedOutput[] }) => void` | - | 确认回调 |\n\n**示例：**\n\n```tsx\n {\n console.log('函数封装数据:', data);\n }}\n/>\n```\n\n### 其他组件\n\n#### CanvasPreview\n\n画布预览组件，用于只读预览画布内容。\n\n**Props:**\n\n| 属性 | 类型 | 默认值 | 说明 |\n|------|------|--------|------|\n| `data` | `GraphData` | - | 画布数据 |\n| `width` | `number \\| string` | - | 预览宽度 |\n| `height` | `number \\| string` | - | 预览高度 |\n| `padding` | `number` | `10` | 内边距 |\n| `style` | `React.CSSProperties` | - | 自定义样式 |\n\n**示例：**\n\n```tsx\n\n```\n\n## Hooks 文档\n\n### useXFlow\n\n获取画布上下文，包括 Graph 实例和选中节点。\n\n**返回值：**\n\n```typescript\ninterface XFlowContextValue {\n graph: Graph | null; // 画布实例\n setGraph: (graph: Graph | null) => void;\n selectedNode: Node | null; // 当前选中的节点\n setSelectedNode: (node: Node | null) => void;\n showConfigPanel: boolean; // 是否显示配置面板\n setShowConfigPanel: (show: boolean) => void;\n showOperatorMenu: boolean; // 是否显示算子菜单\n setShowOperatorMenu: (show: boolean) => void;\n showMinimap: boolean; // 是否显示小地图\n setShowMinimap: (show: boolean) => void;\n}\n```\n\n**示例：**\n\n```tsx\nimport { useXFlow } from '@aidps/canvas-flow';\n\nconst MyComponent = () => {\n const { graph, selectedNode } = useXFlow();\n\n const handleAddNode = () => {\n if (graph) {\n graph.addNode({\n shape: 'rect',\n x: 100,\n y: 100,\n width: 80,\n height: 40,\n });\n }\n };\n\n return (\n
\n

当前选中节点: {selectedNode?.id}

\n \n
\n );\n};\n```\n\n### useGraph\n\n获取画布实例的快捷 Hook。\n\n**返回值：**\n\n```typescript\nGraph | null\n```\n\n**示例：**\n\n```tsx\nimport { useGraph } from '@aidps/canvas-flow';\n\nconst MyComponent = () => {\n const graph = useGraph();\n\n const handleCenter = () => {\n if (graph) {\n graph.centerContent();\n }\n };\n\n return ;\n};\n```\n\n### useNode\n\n获取当前选中节点的快捷 Hook。\n\n**返回值：**\n\n```typescript\n{\n node: Node | null; // 节点实例\n nodeData: { // 节点数据\n node: Node;\n data: any;\n shape: string;\n id: string;\n position: { x: number; y: number };\n size: { width: number; height: number };\n } | null;\n graph: Graph | null; // 画布实例\n hasNode: boolean; // 是否有选中节点\n}\n```\n\n**示例：**\n\n```tsx\nimport { useNode } from '@aidps/canvas-flow';\n\nconst NodeInfo = () => {\n const { node, nodeData, hasNode } = useNode();\n\n if (!hasNode) {\n return
请选择一个节点
;\n }\n\n return (\n
\n

节点ID: {nodeData?.id}

\n

节点标签: {nodeData?.data?.label}

\n

位置: ({nodeData?.position.x}, {nodeData?.position.y})

\n
\n );\n};\n```\n\n### useMenu\n\n获取菜单上下文，用于控制节点和边的右键菜单。\n\n**返回值：**\n\n```typescript\ninterface MenuContextValue {\n // 节点菜单\n nodeMenuOpen: boolean; // 节点菜单是否打开\n selectedNode: Node | null; // 当前选中的节点\n openNodeMenu: (node: Node) => void; // 打开节点菜单\n closeNodeMenu: () => void; // 关闭节点菜单\n \n // 边菜单\n edgeMenuOpen: boolean; // 边菜单是否打开\n selectedEdge: Edge | null; // 当前选中的边\n openEdgeMenu: (edge: Edge) => void; // 打开边菜单\n closeEdgeMenu: () => void; // 关闭边菜单\n \n // 通用\n closeAllMenus: () => void; // 关闭所有菜单\n}\n```\n\n**注意：** 必须在 `XFlow` 组件设置 `enableMenus={true}` 时才能使用。\n\n**示例：**\n\n```tsx\nimport { useMenu } from '@aidps/canvas-flow';\n\nconst CustomNodeMenu = () => {\n const { \n nodeMenuOpen, \n selectedNode, \n openNodeMenu, \n closeNodeMenu \n } = useMenu();\n\n return (\n \n \n \n );\n};\n```\n\n### useCanvasFunction\n\n获取画布函数封装上下文，用于管理函数封装状态。\n\n**返回值：**\n\n```typescript\ninterface CanvasFunctionContextValue {\n // 模式控制\n isSelectionMode: boolean; // 是否处于参数选择模式\n setSelectionMode: (mode: boolean) => void; // 开启/关闭参数选择模式\n toggleSelectionMode: () => void; // 切换参数选择模式\n \n // 面板视图\n panelView: 'node-config' | 'output-ports'; // 当前面板视图\n setPanelView: (view: PanelViewType) => void; // 设置面板视图\n \n // 输入参数\n selectedParams: SelectedParam[]; // 已选择的输入参数列表\n addParam: (param: SelectedParam) => void; // 添加输入参数\n removeParam: (nodeId: string, fieldName: string) => void; // 移除输入参数\n clearParams: () => void; // 清空所有输入参数\n isParamSelected: (nodeId: string, fieldName: string) => boolean; // 检查参数是否已选择\n \n // 输出链接桩\n selectedOutputs: SelectedOutput[]; // 已选择的输出链接桩列表\n addOutput: (output: SelectedOutput) => void; // 添加输出链接桩\n removeOutput: (nodeId: string, portId: string) => void; // 移除输出链接桩\n clearOutputs: () => void; // 清空所有输出链接桩\n isOutputSelected: (nodeId: string, portId: string) => boolean; // 检查输出是否已选择\n \n // 通用\n clearAll: () => void; // 清空所有选择\n showSummaryModal: boolean; // 是否显示汇总弹窗\n setShowSummaryModal: (show: boolean) => void; // 设置汇总弹窗显示状态\n getFunctionData: () => { // 获取函数封装数据\n inputs: SelectedParam[];\n outputs: SelectedOutput[];\n };\n}\n```\n\n**示例：**\n\n```tsx\nimport { useCanvasFunction } from '@aidps/canvas-flow';\n\nconst MyComponent = () => {\n const {\n isSelectionMode,\n toggleSelectionMode,\n selectedParams,\n selectedOutputs,\n getFunctionData,\n } = useCanvasFunction();\n\n const handleExport = () => {\n const data = getFunctionData();\n console.log('函数封装数据:', data);\n // 导出或保存数据\n };\n\n return (\n
\n \n

已选择 {selectedParams.length} 个输入参数

\n

已选择 {selectedOutputs.length} 个输出链接桩

\n \n
\n );\n};\n```\n\n### useCanvasFunctionSafe\n\n安全获取画布函数封装上下文，不会抛出错误（当 `CanvasFunctionProvider` 不存在时返回 `null`）。\n\n**返回值：**\n\n```typescript\nCanvasFunctionContextValue | null\n```\n\n**示例：**\n\n```tsx\nimport { useCanvasFunctionSafe } from '@aidps/canvas-flow';\n\nconst MyComponent = () => {\n const canvasFunction = useCanvasFunctionSafe();\n\n // 安全使用，不会抛出错误\n if (canvasFunction) {\n return (\n
\n

选择模式: {canvasFunction.isSelectionMode ? '开启' : '关闭'}

\n
\n );\n }\n\n return
函数封装功能未启用
;\n};\n```\n\n## 工具函数\n\n## 封装模式\n\n### 模式概览\n- 节点封装：对选中的子图进行封装，支持“参数 + 输入 + 输出”三类配置，适合把一段流程封成可复用模块。\n- 函数封装：对选中的子图进行封装，但仅支持“参数 + 输出”，适合把内部参数作为函数入参，输出作为函数返回。\n\n### 操作流程\n- 进入封装模式：在工具栏点击“节点封装”或“函数封装”，第一步为“节点选择”\n- 框选节点：在“节点选择”步骤直接拖拽框选（无需按修饰键）\n- 配置步骤：点击“下一步”进入参数/输入/输出配置\n - 参数：选择并可重命名需要透出的节点参数\n - 输入：选择子图边界的输入端口（仅节点封装）\n - 输出：选择子图边界的输出端口\n- 返回修改：随时点击“上一步”返回节点选择增删参与封装节点，系统自动校验并清理失效项\n- 完成预览：点击“查看选择”或“完成”查看当前汇总\n\n### 相关组件\n- FunctionModeToolbar：封装模式工具栏，提供“节点封装/函数封装”入口与上一步/下一步、查看选择、清空、完成等操作\n- EncapsulationTabsPanel：封装步骤中显示“参数/输入/输出”三类面板\n- EncapsulationSelection：封装模式下的框选配置，根据步骤自动启用/禁用\n- FunctionEncapsulationBridge：桥接 X6 事件与封装状态，负责子图快照、边界端口计算与选择校验\n\n### 使用示例\n```tsx\nimport { CanvasFunctionProvider, FunctionModeToolbar, XFlow, XFlowGraph } from '@aidps/canvas-flow';\n\nexport default () => (\n \n \n \n \n \n \n);\n```\n\n### 行为与交互说明\n- 框选：在“节点选择”步骤中启用 rubberband 框选，直接拖拽即可框选\n- 只读：在参数/输入/输出步骤中画布进入只读，避免误操作导致选择丢失\n- 校验：当子图结构或选择变化时，系统会自动清理不在子图或边界的已选项\n- 汇总：支持查看当前选择的参数、输入、输出的列表\n\n### 常用配置（内部）\n封装模式入口支持如下配置：\n```ts\ntype EnterEncapsulationModeOptions = {\n focus?: 'nodes' | 'params' | 'inputs' | 'outputs';\n preserveOutputs?: boolean;\n enabledTabs?: Array<'params' | 'inputs' | 'outputs'>;\n selection?: {\n enabled?: boolean;\n rubberband?: boolean;\n modifiers?: null | Array<'alt'|'ctrl'|'meta'|'shift'>; // 设为 null 代表无需按键即可框选\n eventTypes?: string[]; // 默认 ['leftMouseDown']\n };\n panningWhenSelecting?: 'disable' | { modifiers: string[] };\n};\n```\n\n提示：\n- “节点选择”步骤默认 `selection.modifiers = null`，可直接拖拽框选\n- 参数/输入/输出步骤禁用框选并进入只读交互，避免误点击\n\n### 节点工厂工具\n\n#### createNodeConfig\n\n创建节点配置。\n\n```typescript\ncreateNodeConfig(\n graph: Graph,\n nodeData: OperatorMenuItem,\n point: { x: number; y: number },\n count: number\n): Node.Metadata\n```\n\n#### createNodeForDrag\n\n创建用于拖拽的节点。\n\n```typescript\ncreateNodeForDrag(\n graph: Graph,\n nodeData: OperatorMenuItem,\n point: { x: number; y: number },\n count: number\n): Node\n```\n\n#### getPortsFromInfo\n\n从节点信息中提取端口配置。\n\n```typescript\ngetPortsFromInfo(\n info: any,\n isGroup?: boolean\n): PortInfo[]\n```\n\n### 端口类型工具\n\n#### isPortTypeCompatible\n\n检查两个端口类型是否兼容。\n\n```typescript\nisPortTypeCompatible(sourceType: PortType, targetType: PortType): boolean\n```\n\n#### getPortType\n\n获取端口类型。\n\n```typescript\ngetPortType(port: Port): PortType\n```\n\n#### getPortLabel\n\n获取端口标签。\n\n```typescript\ngetPortLabel(port: Port): string\n```\n\n## 类型定义\n\n### 核心类型\n\n```typescript\n// 画布配置\ntype GraphConfig = Partial;\n\n// 算子菜单项\ninterface OperatorMenuItem {\n id: string;\n pid: string | null;\n label: string;\n shape?: string;\n children?: OperatorMenuItem[];\n [key: string]: any;\n}\n\n// 选中的参数\ninterface SelectedParam {\n nodeId: string;\n nodeName: string;\n fieldName: string;\n fieldLabel: string;\n fieldType: string;\n currentValue?: any;\n nodeShape?: string;\n}\n\n// 选中的输出链接桩\ninterface SelectedOutput {\n nodeId: string;\n nodeName: string;\n portId: string;\n portLabel: string;\n portType?: string;\n nodeShape?: string;\n}\n```\n\n## 完整示例：函数封装\n\n```tsx\nimport React from 'react';\nimport {\n XFlow,\n XFlowGraph,\n CanvasFunctionProvider,\n FunctionModeToolbar,\n FunctionSummaryModal,\n useCanvasFunction,\n} from '@aidps/canvas-flow';\n\nconst FunctionEncapsulationDemo = () => {\n return (\n \n \n {/* 工具栏 - 切换函数封装模式 */}\n \n \n {/* 画布 - 自动支持只读模式 */}\n \n \n {/* 汇总弹窗 */}\n {\n console.log('函数封装数据:', data);\n // 处理函数封装数据\n }}\n />\n \n \n );\n};\n```\n\n## 开发\n\n```bash\n# 安装依赖\npnpm install\n\n# 启动开发服务器（可视化查看组件效果）\npnpm dev\n\n# 开发模式（监听文件变化，用于库开发）\npnpm dev:watch\n\n# 构建组件库\npnpm build\n\n# 构建预览界面\npnpm build:demo\n\n# 预览构建结果（组件库）\npnpm preview\n\n# 预览构建后的预览界面\npnpm preview:demo\n\n# 清理构建产物\npnpm clean # 清理库构建产物\npnpm clean:demo # 清理预览界面构建产物\npnpm clean:all # 清理所有构建产物\n```\n\n### 开发服务器\n\n运行 `pnpm dev` 会启动 Vite 开发服务器，自动打开浏览器显示组件示例页面。\n\n开发页面包含：\n- 工具栏（添加节点、清空、居中、缩放等）\n- 画布区域（可拖拽、缩放、框选）\n- 信息面板（显示节点数、边数、缩放比例）\n- 所有插件功能（框选、对齐线、快捷键、剪贴板、撤销重做）\n- 函数封装功能演示\n\n## 打包和发布\n\n### 构建\n\n#### 构建组件库\n\n```bash\n# 构建生产版本\npnpm build\n```\n\n构建产物：\n- `dist/index.js` - CommonJS 格式\n- `dist/index.esm.js` - ES Module 格式\n- `dist/index.d.ts` - TypeScript 类型声明\n\n#### 构建预览界面\n\n构建开发示例页面（预览界面），用于独立部署和展示：\n\n```bash\n# 构建预览界面（会自动先构建组件库）\npnpm build:demo\n```\n\n构建产物：\n- `dist-demo/index.html` - 预览界面入口\n- `dist-demo/assets/` - 静态资源（JS、CSS 等）\n\n预览构建后的界面：\n\n```bash\npnpm preview:demo\n```\n\n#### 清理构建产物\n\n```bash\n# 清理库构建产物\npnpm clean\n\n# 清理预览界面构建产物\npnpm clean:demo\n\n# 清理所有构建产物\npnpm clean:all\n\n### 发布到 npm\n\n```bash\n# 登录 npm（首次发布需要）\nnpm login\n\n# 发布（会自动执行 prepublishOnly 脚本进行构建）\nnpm publish\n\n# 发布到私有仓库\nnpm publish --registry=https://your-registry.com\n```\n\n### 版本管理\n\n```bash\n# 更新版本号\nnpm version patch # 1.0.0 -> 1.0.1\nnpm version minor # 1.0.0 -> 1.1.0\nnpm version major # 1.0.0 -> 2.0.0\n\n# 然后发布\nnpm publish\n```\n\n## License\n\nMIT\n","readmeFilename":"README.md"}