Skip to content

Commit

Permalink
feat: add diff graph (#427)
Browse files Browse the repository at this point in the history
* chore: update contributors [skip ci]

* feat: add diff graph

* fix: remove useless comment

---------

Co-authored-by: xflow-bot[bot] <93642955+xflow-bot[bot]@users.noreply.github.com>
  • Loading branch information
Indigo-w and xflow-bot[bot] authored Nov 16, 2023
1 parent 271489d commit 58fb989
Show file tree
Hide file tree
Showing 19 changed files with 720 additions and 1 deletion.
1 change: 1 addition & 0 deletions apps/basic/config/config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,4 +10,5 @@ export default defineConfig({
title: 'XFlow Basic',
favicons: ['/favicon.ico'],
mfsu: false,
esbuildMinifyIIFE: true,
});
1 change: 1 addition & 0 deletions apps/basic/config/routes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,5 @@ export const routes = [
{ path: '/basic', component: '@/pages/basic' },
{ path: '/dnd', component: '@/pages/dnd' },
{ path: '/dag', component: '@/pages/dag' },
{ path: '/diff', component: '@/pages/diff' },
];
1 change: 1 addition & 0 deletions apps/basic/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
},
"dependencies": {
"@antv/xflow": "workspace:*",
"@antv/xflow-diff": "workspace:*",
"highlight.js": "^10.7.3",
"umi": "^4.0.64"
},
Expand Down
216 changes: 216 additions & 0 deletions apps/basic/src/pages/diff/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,216 @@
/* eslint-disable */
import { DiffGraph } from '@antv/xflow-diff';

// 变更前数据
const originalData = {
nodes: [
{
id: '1',
shape: 'rect',
x: 100,
y: 100,
width: 100,
height: 40,
data: {
a: 'test',
},
attrs: {
body: {
stroke: '#8f8f8f',
strokeWidth: 1,
fill: '#fff',
rx: 6,
ry: 6,
},
},
label: 'svg',
},
{
id: '2',
shape: 'rect',
x: 50,
y: 200,
width: 100,
height: 40,
label: 'dog',
attrs: {
body: {
stroke: '#8f8f8f',
strokeWidth: 1,
fill: '#fff',
rx: 6,
ry: 6,
},
},
data: {
animal: {
name: 'dog',
age: 1,
},
},
},
{
id: '3',
shape: 'rect',
x: 180,
y: 200,
width: 100,
height: 40,
label: 'cat',
attrs: {
body: {
stroke: '#8f8f8f',
strokeWidth: 1,
fill: '#fff',
rx: 6,
ry: 6,
},
},
data: {
animal: {
name: 'cat',
age: 1,
},
},
},
],
edges: [
{
id: 'edge-1',
source: '1',
target: '2',
attrs: {
line: {
stroke: '#8f8f8f',
strokeWidth: 1,
},
},
},
{
id: 'edge-2',
source: '1',
target: '3',
data: {
a: 'test',
},
attrs: {
line: {
stroke: '#8f8f8f',
strokeWidth: 1,
},
},
},
],
};

// 变更后数据
const currentData = {
nodes: [
{
id: '1',
shape: 'rect',
x: 100,
y: 100,
width: 100,
height: 40,
data: {
a: 'test1',
},
attrs: {
body: {
stroke: '#8f8f8f',
strokeWidth: 1,
fill: '#fff',
rx: 6,
ry: 6,
},
},
label: 'svg',
},
{
id: '3',
shape: 'rect',
x: 180,
y: 200,
width: 100,
height: 40,
label: 'cat',
attrs: {
body: {
stroke: '#8f8f8f',
strokeWidth: 1,
fill: '#fff',
rx: 6,
ry: 6,
},
},
data: {
animal: {
name: 'cat',
age: 1,
},
},
},
{
id: '4',
shape: 'rect',
x: 250,
y: 300,
width: 100,
height: 40,
label: 'fish',
attrs: {
body: {
stroke: '#8f8f8f',
strokeWidth: 1,
fill: '#fff',
rx: 6,
ry: 6,
},
},
data: {
animal: {
name: 'fish',
age: 1,
},
},
},
],
edges: [
{
id: 'edge-3',
source: '3',
target: '4',
attrs: {
line: {
stroke: '#8f8f8f',
strokeWidth: 1,
},
},
},
{
id: 'edge-2',
source: '1',
target: '3',
data: {
a: 'test1',
},
attrs: {
line: {
stroke: '#8f8f8f',
strokeWidth: 1,
},
},
},
],
};

const Page = () => {
return (
<div style={{ height: 500 }}>
<DiffGraph originalData={originalData} currentData={currentData} />
</div>
);
};

export default Page;
3 changes: 3 additions & 0 deletions packages/diff/README.en-US.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
English (US) | [简体中文](README.zh-Hans.md)

# Diff
3 changes: 3 additions & 0 deletions packages/diff/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
[English (US)](README.md) | 简体中文

# Diff
1 change: 1 addition & 0 deletions packages/diff/jest.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
module.exports = require('@antv/testing/config/react');
51 changes: 51 additions & 0 deletions packages/diff/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
{
"name": "@antv/xflow-diff",
"version": "1.0.0",
"description": "",
"main": "dist/index.cjs.js",
"module": "dist/index.esm.js",
"types": "dist/typing/index.d.ts",
"private": true,
"files": [
"dist",
"src"
],
"keywords": [
"xflow",
"x6",
"antv"
],
"scripts": {
"setup": "tsup src/index.ts",
"build": "tsup src/index.ts",
"dev": "tsup src/index.ts --watch",
"lint:js": "eslint 'src/**/*.{js,jsx,ts,tsx}'",
"lint:css": "stylelint --allow-empty-input 'src/**/*.{css,less}'",
"lint:format": "prettier --check *.md *.json 'src/**/*.{js,jsx,ts,tsx,css,less,md,json}'",
"lint:typing": "tsc --noEmit",
"test": "jest --coverage"
},
"dependencies": {
"@antv/xflow": "workspace:^"
},
"devDependencies": {
"@antv/config-tsconfig": "workspace:^",
"@antv/config-tsup": "workspace:^",
"@antv/testing": "workspace:^",
"@types/react": "^18.0.28"
},
"peerDependencies": {
"react": "^18.0.0"
},
"bugs": {
"url": "https://github.com/antvis/XFlow/issues"
},
"repository": {
"type": "git",
"url": "https://github.com/antvis/XFlow.git",
"directory": "packages/diff"
},
"publishConfig": {
"access": "public"
}
}
7 changes: 7 additions & 0 deletions packages/diff/project.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"$schema": "https://cdn.jsdelivr.net/npm/nx@latest/schemas/project-schema.json",
"targets": {
"lint": {},
"ci": {}
}
}
Loading

0 comments on commit 58fb989

Please sign in to comment.