@3plate/graph-react 0.1.10 → 0.1.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{index.mjs → index.cjs} +59 -21
- package/dist/index.js +21 -59
- package/package.json +12 -4
- /package/dist/{index.d.mts → index.d.cts} +0 -0
|
@@ -1,14 +1,51 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// src/index.ts
|
|
31
|
+
var index_exports = {};
|
|
32
|
+
__export(index_exports, {
|
|
33
|
+
Graph: () => Graph,
|
|
34
|
+
Playground: () => Playground
|
|
35
|
+
});
|
|
36
|
+
module.exports = __toCommonJS(index_exports);
|
|
37
|
+
|
|
1
38
|
// src/Graph.tsx
|
|
2
|
-
|
|
3
|
-
|
|
39
|
+
var import_react = __toESM(require("react"), 1);
|
|
40
|
+
var import_graph_core = require("@3plate/graph-core");
|
|
4
41
|
function Graph(props) {
|
|
5
|
-
const rootRef = useRef(null);
|
|
6
|
-
const apiRef = useRef(null);
|
|
7
|
-
const rootIdRef = useRef(`graph-${Math.random().toString(36).slice(2, 11)}`);
|
|
8
|
-
useEffect(() => {
|
|
42
|
+
const rootRef = (0, import_react.useRef)(null);
|
|
43
|
+
const apiRef = (0, import_react.useRef)(null);
|
|
44
|
+
const rootIdRef = (0, import_react.useRef)(`graph-${Math.random().toString(36).slice(2, 11)}`);
|
|
45
|
+
(0, import_react.useEffect)(() => {
|
|
9
46
|
if (!rootRef.current || apiRef.current) return;
|
|
10
47
|
rootRef.current.id = rootIdRef.current;
|
|
11
|
-
graph({
|
|
48
|
+
(0, import_graph_core.graph)({
|
|
12
49
|
root: rootIdRef.current,
|
|
13
50
|
nodes: props.nodes,
|
|
14
51
|
edges: props.edges,
|
|
@@ -32,25 +69,25 @@ function Graph(props) {
|
|
|
32
69
|
}
|
|
33
70
|
};
|
|
34
71
|
}, []);
|
|
35
|
-
useEffect(() => {
|
|
72
|
+
(0, import_react.useEffect)(() => {
|
|
36
73
|
if (!apiRef.current) return;
|
|
37
74
|
apiRef.current.applyProps(props);
|
|
38
75
|
}, [props.nodes, props.edges, props.history, props.options]);
|
|
39
|
-
return /* @__PURE__ */
|
|
76
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { ref: rootRef, style: { width: "100%", height: "100%" } });
|
|
40
77
|
}
|
|
41
78
|
|
|
42
79
|
// src/Playground.tsx
|
|
43
|
-
|
|
44
|
-
|
|
80
|
+
var import_react2 = __toESM(require("react"), 1);
|
|
81
|
+
var import_graph_core2 = require("@3plate/graph-core");
|
|
45
82
|
function Playground(props) {
|
|
46
|
-
const rootRef =
|
|
47
|
-
const playgroundRef =
|
|
48
|
-
const rootIdRef =
|
|
49
|
-
const prevExamplesRef =
|
|
50
|
-
|
|
83
|
+
const rootRef = (0, import_react2.useRef)(null);
|
|
84
|
+
const playgroundRef = (0, import_react2.useRef)(null);
|
|
85
|
+
const rootIdRef = (0, import_react2.useRef)(`playground-${Math.random().toString(36).slice(2, 11)}`);
|
|
86
|
+
const prevExamplesRef = (0, import_react2.useRef)({});
|
|
87
|
+
(0, import_react2.useEffect)(() => {
|
|
51
88
|
if (!rootRef.current || playgroundRef.current) return;
|
|
52
89
|
rootRef.current.id = rootIdRef.current;
|
|
53
|
-
const playground = new
|
|
90
|
+
const playground = new import_graph_core2.Playground({
|
|
54
91
|
root: rootIdRef.current,
|
|
55
92
|
examples: props.examples,
|
|
56
93
|
defaultExample: props.defaultExample
|
|
@@ -62,7 +99,7 @@ function Playground(props) {
|
|
|
62
99
|
playgroundRef.current = null;
|
|
63
100
|
};
|
|
64
101
|
}, []);
|
|
65
|
-
|
|
102
|
+
(0, import_react2.useEffect)(() => {
|
|
66
103
|
if (!playgroundRef.current) return;
|
|
67
104
|
const playground = playgroundRef.current;
|
|
68
105
|
const prev = prevExamplesRef.current;
|
|
@@ -81,7 +118,7 @@ function Playground(props) {
|
|
|
81
118
|
}
|
|
82
119
|
prevExamplesRef.current = { ...current };
|
|
83
120
|
}, [props.examples]);
|
|
84
|
-
return /* @__PURE__ */
|
|
121
|
+
return /* @__PURE__ */ import_react2.default.createElement("div", { ref: rootRef, style: { width: "100%", height: "100%" } });
|
|
85
122
|
}
|
|
86
123
|
function shallowEqualExample(a, b) {
|
|
87
124
|
if (a === b) return true;
|
|
@@ -119,7 +156,8 @@ function shallowEqualSource(a, b) {
|
|
|
119
156
|
}
|
|
120
157
|
return false;
|
|
121
158
|
}
|
|
122
|
-
export
|
|
159
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
160
|
+
0 && (module.exports = {
|
|
123
161
|
Graph,
|
|
124
162
|
Playground
|
|
125
|
-
};
|
|
163
|
+
});
|
package/dist/index.js
CHANGED
|
@@ -1,51 +1,14 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __create = Object.create;
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
-
var __export = (target, all) => {
|
|
9
|
-
for (var name in all)
|
|
10
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
-
};
|
|
12
|
-
var __copyProps = (to, from, except, desc) => {
|
|
13
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
-
for (let key of __getOwnPropNames(from))
|
|
15
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
-
}
|
|
18
|
-
return to;
|
|
19
|
-
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
-
mod
|
|
27
|
-
));
|
|
28
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
-
|
|
30
|
-
// src/index.ts
|
|
31
|
-
var index_exports = {};
|
|
32
|
-
__export(index_exports, {
|
|
33
|
-
Graph: () => Graph,
|
|
34
|
-
Playground: () => Playground
|
|
35
|
-
});
|
|
36
|
-
module.exports = __toCommonJS(index_exports);
|
|
37
|
-
|
|
38
1
|
// src/Graph.tsx
|
|
39
|
-
|
|
40
|
-
|
|
2
|
+
import React, { useEffect, useRef } from "react";
|
|
3
|
+
import { graph } from "@3plate/graph-core";
|
|
41
4
|
function Graph(props) {
|
|
42
|
-
const rootRef =
|
|
43
|
-
const apiRef =
|
|
44
|
-
const rootIdRef =
|
|
45
|
-
|
|
5
|
+
const rootRef = useRef(null);
|
|
6
|
+
const apiRef = useRef(null);
|
|
7
|
+
const rootIdRef = useRef(`graph-${Math.random().toString(36).slice(2, 11)}`);
|
|
8
|
+
useEffect(() => {
|
|
46
9
|
if (!rootRef.current || apiRef.current) return;
|
|
47
10
|
rootRef.current.id = rootIdRef.current;
|
|
48
|
-
|
|
11
|
+
graph({
|
|
49
12
|
root: rootIdRef.current,
|
|
50
13
|
nodes: props.nodes,
|
|
51
14
|
edges: props.edges,
|
|
@@ -69,25 +32,25 @@ function Graph(props) {
|
|
|
69
32
|
}
|
|
70
33
|
};
|
|
71
34
|
}, []);
|
|
72
|
-
|
|
35
|
+
useEffect(() => {
|
|
73
36
|
if (!apiRef.current) return;
|
|
74
37
|
apiRef.current.applyProps(props);
|
|
75
38
|
}, [props.nodes, props.edges, props.history, props.options]);
|
|
76
|
-
return /* @__PURE__ */
|
|
39
|
+
return /* @__PURE__ */ React.createElement("div", { ref: rootRef, style: { width: "100%", height: "100%" } });
|
|
77
40
|
}
|
|
78
41
|
|
|
79
42
|
// src/Playground.tsx
|
|
80
|
-
|
|
81
|
-
|
|
43
|
+
import React2, { useEffect as useEffect2, useRef as useRef2 } from "react";
|
|
44
|
+
import { Playground as PlaygroundClass } from "@3plate/graph-core";
|
|
82
45
|
function Playground(props) {
|
|
83
|
-
const rootRef = (
|
|
84
|
-
const playgroundRef = (
|
|
85
|
-
const rootIdRef = (
|
|
86
|
-
const prevExamplesRef = (
|
|
87
|
-
(
|
|
46
|
+
const rootRef = useRef2(null);
|
|
47
|
+
const playgroundRef = useRef2(null);
|
|
48
|
+
const rootIdRef = useRef2(`playground-${Math.random().toString(36).slice(2, 11)}`);
|
|
49
|
+
const prevExamplesRef = useRef2({});
|
|
50
|
+
useEffect2(() => {
|
|
88
51
|
if (!rootRef.current || playgroundRef.current) return;
|
|
89
52
|
rootRef.current.id = rootIdRef.current;
|
|
90
|
-
const playground = new
|
|
53
|
+
const playground = new PlaygroundClass({
|
|
91
54
|
root: rootIdRef.current,
|
|
92
55
|
examples: props.examples,
|
|
93
56
|
defaultExample: props.defaultExample
|
|
@@ -99,7 +62,7 @@ function Playground(props) {
|
|
|
99
62
|
playgroundRef.current = null;
|
|
100
63
|
};
|
|
101
64
|
}, []);
|
|
102
|
-
(
|
|
65
|
+
useEffect2(() => {
|
|
103
66
|
if (!playgroundRef.current) return;
|
|
104
67
|
const playground = playgroundRef.current;
|
|
105
68
|
const prev = prevExamplesRef.current;
|
|
@@ -118,7 +81,7 @@ function Playground(props) {
|
|
|
118
81
|
}
|
|
119
82
|
prevExamplesRef.current = { ...current };
|
|
120
83
|
}, [props.examples]);
|
|
121
|
-
return /* @__PURE__ */
|
|
84
|
+
return /* @__PURE__ */ React2.createElement("div", { ref: rootRef, style: { width: "100%", height: "100%" } });
|
|
122
85
|
}
|
|
123
86
|
function shallowEqualExample(a, b) {
|
|
124
87
|
if (a === b) return true;
|
|
@@ -156,8 +119,7 @@ function shallowEqualSource(a, b) {
|
|
|
156
119
|
}
|
|
157
120
|
return false;
|
|
158
121
|
}
|
|
159
|
-
|
|
160
|
-
0 && (module.exports = {
|
|
122
|
+
export {
|
|
161
123
|
Graph,
|
|
162
124
|
Playground
|
|
163
|
-
}
|
|
125
|
+
};
|
package/package.json
CHANGED
|
@@ -1,15 +1,23 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@3plate/graph-react",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.12",
|
|
4
|
+
"type": "module",
|
|
4
5
|
"license": "GPL-3.0",
|
|
5
6
|
"repository": {
|
|
6
7
|
"type": "git",
|
|
7
8
|
"url": "https://github.com/3plt/graph",
|
|
8
9
|
"directory": "packages/react"
|
|
9
10
|
},
|
|
10
|
-
"main": "./dist/index.
|
|
11
|
-
"module": "./dist/index.
|
|
11
|
+
"main": "./dist/index.cjs",
|
|
12
|
+
"module": "./dist/index.js",
|
|
12
13
|
"types": "./dist/index.d.ts",
|
|
14
|
+
"exports": {
|
|
15
|
+
".": {
|
|
16
|
+
"types": "./dist/index.d.ts",
|
|
17
|
+
"import": "./dist/index.js",
|
|
18
|
+
"require": "./dist/index.cjs"
|
|
19
|
+
}
|
|
20
|
+
},
|
|
13
21
|
"files": [
|
|
14
22
|
"dist"
|
|
15
23
|
],
|
|
@@ -21,7 +29,7 @@
|
|
|
21
29
|
"react-dom": "^18.0.0 || ^19.0.0"
|
|
22
30
|
},
|
|
23
31
|
"dependencies": {
|
|
24
|
-
"@3plate/graph-core": "0.1.
|
|
32
|
+
"@3plate/graph-core": "0.1.12"
|
|
25
33
|
},
|
|
26
34
|
"devDependencies": {
|
|
27
35
|
"@testing-library/jest-dom": "^6.6.3",
|
|
File without changes
|