@lincle/react-native-base 0.4.0-next.16 → 0.4.0-next.18
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/cjs/components/Edge/index.js +57 -0
- package/dist/cjs/components/Edge/index.js.map +1 -0
- package/dist/cjs/components/Edges/Marker.js +28 -0
- package/dist/cjs/components/Edges/Marker.js.map +1 -0
- package/dist/cjs/components/Edges/Paths/Path/Path.js +74 -0
- package/dist/cjs/components/Edges/Paths/Path/Path.js.map +1 -0
- package/dist/cjs/components/Edges/Paths/Path/index.js +64 -0
- package/dist/cjs/components/Edges/Paths/Path/index.js.map +1 -0
- package/dist/cjs/components/Edges/Paths/index.js +27 -0
- package/dist/cjs/components/Edges/Paths/index.js.map +1 -0
- package/dist/cjs/components/Edges/index.js +51 -0
- package/dist/cjs/components/Edges/index.js.map +1 -0
- package/dist/cjs/components/Graph/Grid/index.js +51 -0
- package/dist/cjs/components/Graph/Grid/index.js.map +1 -0
- package/dist/cjs/components/Graph/index.js +17 -0
- package/dist/cjs/components/Graph/index.js.map +1 -0
- package/dist/cjs/components/Node/index.js +118 -0
- package/dist/cjs/components/Node/index.js.map +1 -0
- package/dist/cjs/components/Nodes/index.js +7 -0
- package/dist/cjs/components/Nodes/index.js.map +1 -0
- package/dist/cjs/components/index.js +6 -0
- package/dist/cjs/components/index.js.map +1 -0
- package/dist/cjs/index.js +3 -0
- package/dist/cjs/index.js.map +1 -0
- package/dist/cjs/shared.js +2 -0
- package/dist/cjs/shared.js.map +1 -0
- package/dist/esm/components/Edge/index.js +57 -0
- package/dist/esm/components/Edge/index.js.map +1 -0
- package/dist/esm/components/Edges/Marker.js +28 -0
- package/dist/esm/components/Edges/Marker.js.map +1 -0
- package/dist/esm/components/Edges/Paths/Path/Path.js +74 -0
- package/dist/esm/components/Edges/Paths/Path/Path.js.map +1 -0
- package/dist/esm/components/Edges/Paths/Path/index.js +64 -0
- package/dist/esm/components/Edges/Paths/Path/index.js.map +1 -0
- package/dist/esm/components/Edges/Paths/index.js +27 -0
- package/dist/esm/components/Edges/Paths/index.js.map +1 -0
- package/dist/esm/components/Edges/index.js +51 -0
- package/dist/esm/components/Edges/index.js.map +1 -0
- package/dist/esm/components/Graph/Grid/index.js +51 -0
- package/dist/esm/components/Graph/Grid/index.js.map +1 -0
- package/dist/esm/components/Graph/index.js +17 -0
- package/dist/esm/components/Graph/index.js.map +1 -0
- package/dist/esm/components/Node/index.js +118 -0
- package/dist/esm/components/Node/index.js.map +1 -0
- package/dist/esm/components/Nodes/index.js +7 -0
- package/dist/esm/components/Nodes/index.js.map +1 -0
- package/dist/esm/components/index.js +6 -0
- package/dist/esm/components/index.js.map +1 -0
- package/dist/esm/index.js +3 -0
- package/dist/esm/index.js.map +1 -0
- package/dist/esm/shared.js +2 -0
- package/dist/esm/shared.js.map +1 -0
- package/package.json +29 -24
- package/dist/components/Edge/index.js +0 -61
- package/dist/components/Edges/Marker.js +0 -29
- package/dist/components/Edges/Paths/Path/Path.js +0 -57
- package/dist/components/Edges/Paths/Path/index.js +0 -59
- package/dist/components/Edges/Paths/index.js +0 -33
- package/dist/components/Edges/index.js +0 -86
- package/dist/components/Graph/Grid/index.js +0 -84
- package/dist/components/Graph/index.js +0 -23
- package/dist/components/Node/index.js +0 -128
- package/dist/components/Nodes/index.js +0 -9
- package/dist/components/index.js +0 -21
- package/dist/index.js +0 -18
- package/dist/shared.js +0 -18
- /package/dist/{components → esm/components}/Edge/index.d.ts +0 -0
- /package/dist/{components → esm/components}/Edges/Marker.d.ts +0 -0
- /package/dist/{components → esm/components}/Edges/Paths/Path/Path.d.ts +0 -0
- /package/dist/{components → esm/components}/Edges/Paths/Path/index.d.ts +0 -0
- /package/dist/{components → esm/components}/Edges/Paths/index.d.ts +0 -0
- /package/dist/{components → esm/components}/Edges/index.d.ts +0 -0
- /package/dist/{components → esm/components}/Graph/Grid/index.d.ts +0 -0
- /package/dist/{components → esm/components}/Graph/index.d.ts +0 -0
- /package/dist/{components → esm/components}/Node/index.d.ts +0 -0
- /package/dist/{components → esm/components}/Nodes/index.d.ts +0 -0
- /package/dist/{components → esm/components}/index.d.ts +0 -0
- /package/dist/{index.d.ts → esm/index.d.ts} +0 -0
- /package/dist/{shared.d.ts → esm/shared.d.ts} +0 -0
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Edge = void 0;
|
|
4
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
-
const shared_1 = require("../../shared");
|
|
6
|
-
const react_1 = require("react");
|
|
7
|
-
const react_native_1 = require("react-native");
|
|
8
|
-
const Edge = ({ children, dash, id: edgeId, line, markerEnd, markerStart, sourceId, targetId }) => {
|
|
9
|
-
var _a, _b;
|
|
10
|
-
const updateEdge = (0, shared_1.useUpdateEdge)();
|
|
11
|
-
const removeEdge = (0, shared_1.useRemoveEdge)();
|
|
12
|
-
const edge = (0, shared_1.useEdge)(edgeId);
|
|
13
|
-
(0, react_1.useEffect)(() => {
|
|
14
|
-
return () => {
|
|
15
|
-
if (removeEdge) {
|
|
16
|
-
removeEdge(edgeId);
|
|
17
|
-
}
|
|
18
|
-
};
|
|
19
|
-
}, []);
|
|
20
|
-
(0, react_1.useEffect)(() => {
|
|
21
|
-
if (updateEdge) {
|
|
22
|
-
updateEdge(edgeId, {
|
|
23
|
-
dash,
|
|
24
|
-
line,
|
|
25
|
-
markerEnd,
|
|
26
|
-
markerStart,
|
|
27
|
-
sourceId,
|
|
28
|
-
targetId
|
|
29
|
-
});
|
|
30
|
-
}
|
|
31
|
-
return () => {
|
|
32
|
-
if (removeEdge) {
|
|
33
|
-
removeEdge(edgeId);
|
|
34
|
-
}
|
|
35
|
-
};
|
|
36
|
-
}, [
|
|
37
|
-
dash,
|
|
38
|
-
edgeId,
|
|
39
|
-
line,
|
|
40
|
-
markerEnd,
|
|
41
|
-
markerStart,
|
|
42
|
-
removeEdge,
|
|
43
|
-
sourceId,
|
|
44
|
-
targetId,
|
|
45
|
-
updateEdge
|
|
46
|
-
]);
|
|
47
|
-
const style = (0, react_1.useMemo)(() => {
|
|
48
|
-
var _a, _b;
|
|
49
|
-
return {
|
|
50
|
-
left: (_a = edge === null || edge === void 0 ? void 0 : edge.center) === null || _a === void 0 ? void 0 : _a.x,
|
|
51
|
-
position: 'absolute',
|
|
52
|
-
top: (_b = edge === null || edge === void 0 ? void 0 : edge.center) === null || _b === void 0 ? void 0 : _b.y
|
|
53
|
-
};
|
|
54
|
-
}, [
|
|
55
|
-
(_a = edge === null || edge === void 0 ? void 0 : edge.center) === null || _a === void 0 ? void 0 : _a.x,
|
|
56
|
-
(_b = edge === null || edge === void 0 ? void 0 : edge.center) === null || _b === void 0 ? void 0 : _b.y
|
|
57
|
-
]);
|
|
58
|
-
return ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: style, children: children }));
|
|
59
|
-
};
|
|
60
|
-
exports.Edge = Edge;
|
|
61
|
-
Edge.displayName = 'LincleEdge';
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
-
const shared_1 = require("../../shared");
|
|
5
|
-
const react_1 = require("react");
|
|
6
|
-
const react_native_svg_1 = require("react-native-svg");
|
|
7
|
-
const Marker = () => {
|
|
8
|
-
const id = (0, shared_1.useDiagramId)();
|
|
9
|
-
const markerId = (0, react_1.useMemo)(() => {
|
|
10
|
-
return id ?
|
|
11
|
-
`${id}-` :
|
|
12
|
-
'';
|
|
13
|
-
}, [
|
|
14
|
-
id
|
|
15
|
-
]);
|
|
16
|
-
const arrowId = (0, react_1.useMemo)(() => {
|
|
17
|
-
return `diagram-${markerId}marker-arrow`;
|
|
18
|
-
}, [
|
|
19
|
-
markerId
|
|
20
|
-
]);
|
|
21
|
-
const circleId = (0, react_1.useMemo)(() => {
|
|
22
|
-
return `diagram-${markerId}marker-circle`;
|
|
23
|
-
}, [
|
|
24
|
-
markerId
|
|
25
|
-
]);
|
|
26
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_native_svg_1.Marker, { id: arrowId, markerHeight: '10', markerUnits: 'strokeWidth', markerWidth: '10', orient: 'auto', refX: '9', refY: '5', children: (0, jsx_runtime_1.jsx)(react_native_svg_1.Path, { d: 'M 0 0 L 10 5 L 0 10 z', fill: 'black' }) }), (0, jsx_runtime_1.jsx)(react_native_svg_1.Marker, { id: circleId, markerHeight: '10', markerUnits: 'strokeWidth', markerWidth: '10', orient: 'auto', refX: '5', refY: '5', children: (0, jsx_runtime_1.jsx)(react_native_svg_1.Circle, { cx: '5', cy: '5', fill: 'black', r: '3' }) })] }));
|
|
27
|
-
};
|
|
28
|
-
Marker.displayName = 'LincleMarker';
|
|
29
|
-
exports.default = Marker;
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
-
const shared_1 = require("../../../../shared");
|
|
5
|
-
const react_1 = require("react");
|
|
6
|
-
const react_native_svg_1 = require("react-native-svg");
|
|
7
|
-
const Path = ({ center = true, edgeId, line, markerEnd: givenMarkerEnd, markerStart: givenMarkerStart, source, target }) => {
|
|
8
|
-
const diagramId = (0, shared_1.useDiagramId)();
|
|
9
|
-
const updateEdge = (0, shared_1.useUpdateEdge)();
|
|
10
|
-
const origins = (0, react_1.useMemo)(() => {
|
|
11
|
-
if (source &&
|
|
12
|
-
target &&
|
|
13
|
-
line) {
|
|
14
|
-
const generatedOrigins = (0, shared_1.generateOrigins)(source, target, line, center);
|
|
15
|
-
return generatedOrigins;
|
|
16
|
-
}
|
|
17
|
-
return undefined;
|
|
18
|
-
}, [
|
|
19
|
-
center,
|
|
20
|
-
line,
|
|
21
|
-
source,
|
|
22
|
-
target
|
|
23
|
-
]);
|
|
24
|
-
(0, react_1.useEffect)(() => {
|
|
25
|
-
if ((origins === null || origins === void 0 ? void 0 : origins.center) &&
|
|
26
|
-
updateEdge) {
|
|
27
|
-
updateEdge(edgeId, {
|
|
28
|
-
center: origins.center
|
|
29
|
-
});
|
|
30
|
-
}
|
|
31
|
-
}, [
|
|
32
|
-
edgeId,
|
|
33
|
-
origins === null || origins === void 0 ? void 0 : origins.center,
|
|
34
|
-
updateEdge
|
|
35
|
-
]);
|
|
36
|
-
const markerEnd = (0, react_1.useMemo)(() => {
|
|
37
|
-
const id = diagramId ?
|
|
38
|
-
`${diagramId}-` :
|
|
39
|
-
'';
|
|
40
|
-
return givenMarkerEnd !== null && givenMarkerEnd !== void 0 ? givenMarkerEnd : `url(#diagram-${id}marker-arrow)`;
|
|
41
|
-
}, [
|
|
42
|
-
diagramId,
|
|
43
|
-
givenMarkerEnd
|
|
44
|
-
]);
|
|
45
|
-
const markerStart = (0, react_1.useMemo)(() => {
|
|
46
|
-
const id = diagramId ?
|
|
47
|
-
`${diagramId}-` :
|
|
48
|
-
'';
|
|
49
|
-
return givenMarkerStart !== null && givenMarkerStart !== void 0 ? givenMarkerStart : `url(#diagram-${id}marker-circle)`;
|
|
50
|
-
}, [
|
|
51
|
-
diagramId,
|
|
52
|
-
givenMarkerStart
|
|
53
|
-
]);
|
|
54
|
-
return ((0, jsx_runtime_1.jsxs)(react_native_svg_1.G, { children: [(0, jsx_runtime_1.jsx)(react_native_svg_1.Path, { d: origins === null || origins === void 0 ? void 0 : origins.path, fill: 'transparent', id: diagramId + '1', opacity: 0, pointerEvents: 'box-none', stroke: 'black', strokeWidth: 30 }), (0, jsx_runtime_1.jsx)(react_native_svg_1.Path, { d: origins === null || origins === void 0 ? void 0 : origins.path, fill: 'transparent', id: diagramId + '2', markerEnd: markerEnd, markerStart: markerStart, pointerEvents: 'box-none', stroke: 'black' })] }));
|
|
55
|
-
};
|
|
56
|
-
Path.displayName = 'LinclePath';
|
|
57
|
-
exports.default = Path;
|
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Path = void 0;
|
|
7
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
-
const shared_1 = require("../../../../shared");
|
|
9
|
-
const Path_1 = __importDefault(require("./Path"));
|
|
10
|
-
const react_1 = require("react");
|
|
11
|
-
const RegisterEdge = ({ id: edgeId, line: givenLine, markerEnd, markerStart, path, sourceId, targetId }) => {
|
|
12
|
-
const defaultLine = (0, shared_1.useDefaultLine)();
|
|
13
|
-
const edgeSubscriber = (0, shared_1.useEdgeSubscriber)();
|
|
14
|
-
const line = givenLine !== null && givenLine !== void 0 ? givenLine : defaultLine;
|
|
15
|
-
const [source, setSource] = (0, react_1.useState)();
|
|
16
|
-
const [target, setTarget] = (0, react_1.useState)();
|
|
17
|
-
(0, react_1.useEffect)(() => {
|
|
18
|
-
setSource(edgeSubscriber === null || edgeSubscriber === void 0 ? void 0 : edgeSubscriber.register(edgeId, sourceId, setSource));
|
|
19
|
-
setTarget(edgeSubscriber === null || edgeSubscriber === void 0 ? void 0 : edgeSubscriber.register(edgeId, targetId, setTarget));
|
|
20
|
-
return () => {
|
|
21
|
-
edgeSubscriber === null || edgeSubscriber === void 0 ? void 0 : edgeSubscriber.unregister(edgeId, sourceId);
|
|
22
|
-
edgeSubscriber === null || edgeSubscriber === void 0 ? void 0 : edgeSubscriber.unregister(edgeId, targetId);
|
|
23
|
-
};
|
|
24
|
-
}, []);
|
|
25
|
-
const pathSource = (0, react_1.useMemo)(() => {
|
|
26
|
-
return source ? Object.assign(Object.assign({}, source), { x: source.x, y: source.y }) :
|
|
27
|
-
undefined;
|
|
28
|
-
}, [
|
|
29
|
-
source === null || source === void 0 ? void 0 : source.x,
|
|
30
|
-
source === null || source === void 0 ? void 0 : source.y
|
|
31
|
-
]);
|
|
32
|
-
const pathTarget = (0, react_1.useMemo)(() => {
|
|
33
|
-
return target ? Object.assign(Object.assign({}, target), { x: target.x, y: target.y }) :
|
|
34
|
-
undefined;
|
|
35
|
-
}, [
|
|
36
|
-
target === null || target === void 0 ? void 0 : target.x,
|
|
37
|
-
target === null || target === void 0 ? void 0 : target.y
|
|
38
|
-
]);
|
|
39
|
-
const customPath = (0, react_1.useMemo)(() => {
|
|
40
|
-
return path ?
|
|
41
|
-
path(pathSource, pathTarget) :
|
|
42
|
-
undefined;
|
|
43
|
-
}, [
|
|
44
|
-
path,
|
|
45
|
-
pathSource,
|
|
46
|
-
pathTarget
|
|
47
|
-
]);
|
|
48
|
-
if (source &&
|
|
49
|
-
target) {
|
|
50
|
-
return customPath !== null && customPath !== void 0 ? customPath : (0, jsx_runtime_1.jsx)(Path_1.default, { center: true, edgeId: edgeId, line: line, markerEnd: markerEnd, markerStart: markerStart, source: pathSource, target: pathTarget });
|
|
51
|
-
}
|
|
52
|
-
else {
|
|
53
|
-
return null;
|
|
54
|
-
}
|
|
55
|
-
};
|
|
56
|
-
RegisterEdge.displayName = 'LincleRegisterEdge';
|
|
57
|
-
exports.default = RegisterEdge;
|
|
58
|
-
var Path_2 = require("./Path");
|
|
59
|
-
Object.defineProperty(exports, "Path", { enumerable: true, get: function () { return __importDefault(Path_2).default; } });
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Path = void 0;
|
|
7
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
-
const shared_1 = require("../../../shared");
|
|
9
|
-
const Path_1 = __importDefault(require("./Path"));
|
|
10
|
-
const react_1 = require("react");
|
|
11
|
-
const Paths = () => {
|
|
12
|
-
const edges = (0, shared_1.useEdges)();
|
|
13
|
-
const paths = (0, react_1.useMemo)(() => {
|
|
14
|
-
const edgesMap = Object.keys(edges).map((edgeId) => {
|
|
15
|
-
const { line, sourceId, targetId } = edges[edgeId];
|
|
16
|
-
if (sourceId &&
|
|
17
|
-
targetId) {
|
|
18
|
-
return ((0, jsx_runtime_1.jsx)(Path_1.default, { id: edgeId, line: line, sourceId: sourceId, targetId: targetId }, edgeId));
|
|
19
|
-
}
|
|
20
|
-
else {
|
|
21
|
-
return null;
|
|
22
|
-
}
|
|
23
|
-
});
|
|
24
|
-
return edgesMap;
|
|
25
|
-
}, [
|
|
26
|
-
edges
|
|
27
|
-
]);
|
|
28
|
-
return paths;
|
|
29
|
-
};
|
|
30
|
-
Paths.displayName = 'LinclePaths';
|
|
31
|
-
exports.default = Paths;
|
|
32
|
-
var Path_2 = require("./Path");
|
|
33
|
-
Object.defineProperty(exports, "Path", { enumerable: true, get: function () { return Path_2.Path; } });
|
|
@@ -1,86 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || (function () {
|
|
19
|
-
var ownKeys = function(o) {
|
|
20
|
-
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
21
|
-
var ar = [];
|
|
22
|
-
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
23
|
-
return ar;
|
|
24
|
-
};
|
|
25
|
-
return ownKeys(o);
|
|
26
|
-
};
|
|
27
|
-
return function (mod) {
|
|
28
|
-
if (mod && mod.__esModule) return mod;
|
|
29
|
-
var result = {};
|
|
30
|
-
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
31
|
-
__setModuleDefault(result, mod);
|
|
32
|
-
return result;
|
|
33
|
-
};
|
|
34
|
-
})();
|
|
35
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
36
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
37
|
-
};
|
|
38
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
39
|
-
exports.Path = exports.Marker = exports.Edges = void 0;
|
|
40
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
41
|
-
const Marker_1 = __importDefault(require("./Marker"));
|
|
42
|
-
const Paths_1 = __importDefault(require("./Paths"));
|
|
43
|
-
const react_1 = require("react");
|
|
44
|
-
const react_native_1 = require("react-native");
|
|
45
|
-
const react_native_svg_1 = __importStar(require("react-native-svg"));
|
|
46
|
-
const styles = react_native_1.StyleSheet.create({
|
|
47
|
-
bridges: {
|
|
48
|
-
bottom: 0,
|
|
49
|
-
left: 0,
|
|
50
|
-
overflow: 'visible',
|
|
51
|
-
pointerEvents: 'box-none',
|
|
52
|
-
position: 'absolute',
|
|
53
|
-
right: 0,
|
|
54
|
-
top: 0
|
|
55
|
-
},
|
|
56
|
-
edges: {
|
|
57
|
-
backfaceVisibility: 'hidden',
|
|
58
|
-
overflow: 'visible',
|
|
59
|
-
pointerEvents: 'box-none'
|
|
60
|
-
}
|
|
61
|
-
});
|
|
62
|
-
const Edges = ({ children, scale = 1, translate = {
|
|
63
|
-
x: 0,
|
|
64
|
-
y: 0
|
|
65
|
-
} }) => {
|
|
66
|
-
const { style, transform } = (0, react_1.useMemo)(() => {
|
|
67
|
-
const tx = translate.x;
|
|
68
|
-
const ty = translate.y;
|
|
69
|
-
const tz = scale;
|
|
70
|
-
return {
|
|
71
|
-
style: Object.assign(Object.assign({}, styles.bridges), { pointerEvents: 'box-none', transform: `translateX(${tx}px) translateY(${ty}px) scale(${tz})`, transformOrigin: 'top left' }),
|
|
72
|
-
transform: `translate(${tx}, ${ty}) scale(${tz})`
|
|
73
|
-
};
|
|
74
|
-
}, [
|
|
75
|
-
translate.x,
|
|
76
|
-
translate.y,
|
|
77
|
-
scale
|
|
78
|
-
]);
|
|
79
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_native_svg_1.default, { style: styles.edges, children: (0, jsx_runtime_1.jsxs)(react_native_svg_1.G, { transform: transform, children: [(0, jsx_runtime_1.jsx)(react_native_svg_1.Defs, { children: (0, jsx_runtime_1.jsx)(Marker_1.default, {}) }), (0, jsx_runtime_1.jsx)(Paths_1.default, {})] }) }), (0, jsx_runtime_1.jsx)(react_native_1.View, { style: style, children: children })] }));
|
|
80
|
-
};
|
|
81
|
-
exports.Edges = Edges;
|
|
82
|
-
Edges.displayName = 'LincleEdges';
|
|
83
|
-
var Marker_2 = require("./Marker");
|
|
84
|
-
Object.defineProperty(exports, "Marker", { enumerable: true, get: function () { return __importDefault(Marker_2).default; } });
|
|
85
|
-
var Paths_2 = require("./Paths");
|
|
86
|
-
Object.defineProperty(exports, "Path", { enumerable: true, get: function () { return Paths_2.Path; } });
|
|
@@ -1,84 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || (function () {
|
|
19
|
-
var ownKeys = function(o) {
|
|
20
|
-
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
21
|
-
var ar = [];
|
|
22
|
-
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
23
|
-
return ar;
|
|
24
|
-
};
|
|
25
|
-
return ownKeys(o);
|
|
26
|
-
};
|
|
27
|
-
return function (mod) {
|
|
28
|
-
if (mod && mod.__esModule) return mod;
|
|
29
|
-
var result = {};
|
|
30
|
-
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
31
|
-
__setModuleDefault(result, mod);
|
|
32
|
-
return result;
|
|
33
|
-
};
|
|
34
|
-
})();
|
|
35
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
37
|
-
const shared_1 = require("../../../shared");
|
|
38
|
-
const react_1 = require("react");
|
|
39
|
-
const react_native_1 = require("react-native");
|
|
40
|
-
const react_native_svg_1 = __importStar(require("react-native-svg"));
|
|
41
|
-
const styles = react_native_1.StyleSheet.create({
|
|
42
|
-
grid: {
|
|
43
|
-
height: '100%',
|
|
44
|
-
position: 'absolute',
|
|
45
|
-
width: '100%'
|
|
46
|
-
}
|
|
47
|
-
});
|
|
48
|
-
const SIZE = 0.4;
|
|
49
|
-
const Circle = (0, jsx_runtime_1.jsx)(react_native_svg_1.Circle, { cx: SIZE, cy: SIZE, fill: 'black', r: SIZE });
|
|
50
|
-
const Grid = ({ children, scale = 1, xOffset: givenXOffset = 0, yOffset: givenYOffset = 0 }) => {
|
|
51
|
-
const diagramId = (0, shared_1.useDiagramId)();
|
|
52
|
-
const [givenGridX, givenGridY] = (0, shared_1.useGrid)() || [
|
|
53
|
-
1,
|
|
54
|
-
1
|
|
55
|
-
];
|
|
56
|
-
const id = `lincle-grid-${diagramId}`;
|
|
57
|
-
const gridX = (0, react_1.useMemo)(() => {
|
|
58
|
-
return givenGridX * scale;
|
|
59
|
-
}, [
|
|
60
|
-
givenGridX,
|
|
61
|
-
scale
|
|
62
|
-
]);
|
|
63
|
-
const gridY = (0, react_1.useMemo)(() => {
|
|
64
|
-
return givenGridY * scale;
|
|
65
|
-
}, [
|
|
66
|
-
givenGridY,
|
|
67
|
-
scale
|
|
68
|
-
]);
|
|
69
|
-
const xOffset = (0, react_1.useMemo)(() => {
|
|
70
|
-
return givenXOffset % gridX;
|
|
71
|
-
}, [
|
|
72
|
-
givenXOffset,
|
|
73
|
-
gridX
|
|
74
|
-
]);
|
|
75
|
-
const yOffset = (0, react_1.useMemo)(() => {
|
|
76
|
-
return givenYOffset % gridY;
|
|
77
|
-
}, [
|
|
78
|
-
givenYOffset,
|
|
79
|
-
gridY
|
|
80
|
-
]);
|
|
81
|
-
return ((0, jsx_runtime_1.jsxs)(react_native_svg_1.default, { style: styles.grid, children: [(0, jsx_runtime_1.jsx)(react_native_svg_1.Pattern, { height: gridY, id: id, patternUnits: 'userSpaceOnUse', width: gridX, x: xOffset, y: yOffset, children: children !== null && children !== void 0 ? children : Circle }), (0, jsx_runtime_1.jsx)(react_native_svg_1.Rect, { fill: `url(#${id})`, height: '100%', width: '100%', x: '0', y: '0' })] }));
|
|
82
|
-
};
|
|
83
|
-
Grid.displayName = 'LincleGrid';
|
|
84
|
-
exports.default = Grid;
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Grid = exports.Graph = void 0;
|
|
7
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
-
const shared_1 = require("../../shared");
|
|
9
|
-
const Grid_1 = __importDefault(require("./Grid"));
|
|
10
|
-
const Graph = ({ children, edgeFrequency, grid, id, line, nodeFrequency, nodeHeight, nodeWidth, shape, showGrid }) => {
|
|
11
|
-
if (!id) {
|
|
12
|
-
console.error('No ID provided to @lincle/base Graph!');
|
|
13
|
-
return null;
|
|
14
|
-
}
|
|
15
|
-
const gird = showGrid === false ?
|
|
16
|
-
null :
|
|
17
|
-
(0, jsx_runtime_1.jsx)(Grid_1.default, {});
|
|
18
|
-
return ((0, jsx_runtime_1.jsxs)(shared_1.Providers, { edgeFrequency: edgeFrequency, grid: grid, id: id, line: line, nodeFrequency: nodeFrequency, nodeHeight: nodeHeight, nodeWidth: nodeWidth, shape: shape, children: [gird, children] }));
|
|
19
|
-
};
|
|
20
|
-
exports.Graph = Graph;
|
|
21
|
-
Graph.displayName = 'LincleGraph';
|
|
22
|
-
var Grid_2 = require("./Grid");
|
|
23
|
-
Object.defineProperty(exports, "Grid", { enumerable: true, get: function () { return __importDefault(Grid_2).default; } });
|
|
@@ -1,128 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
-
var t = {};
|
|
4
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
-
t[p] = s[p];
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
-
t[p[i]] = s[p[i]];
|
|
10
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
};
|
|
13
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
|
-
exports.Node = void 0;
|
|
15
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
16
|
-
const shared_1 = require("../../shared");
|
|
17
|
-
const react_1 = require("react");
|
|
18
|
-
const react_native_1 = require("react-native");
|
|
19
|
-
const Node = (_a, ref) => {
|
|
20
|
-
var _b, _c, _d;
|
|
21
|
-
var { children, height: givenHeight, id: nodeId, shape: givenShape, style: { node: nodeStyle } = {}, track = true, width: givenWidth, x: givenX = 0, y: givenY = 0 } = _a, additionalProperties = __rest(_a, ["children", "height", "id", "shape", "style", "track", "width", "x", "y"]);
|
|
22
|
-
const defaultHeight = (0, shared_1.useDefaultNodeHeight)();
|
|
23
|
-
const defaultShape = (0, shared_1.useDefaultShape)();
|
|
24
|
-
const defaultWidth = (0, shared_1.useDefaultNodeWidth)();
|
|
25
|
-
const edgeSubscriber = (0, shared_1.useEdgeSubscriber)();
|
|
26
|
-
const nodePositions = (0, shared_1.useNodePositions)();
|
|
27
|
-
const height = (_b = givenHeight !== null && givenHeight !== void 0 ? givenHeight : defaultHeight) !== null && _b !== void 0 ? _b : 0;
|
|
28
|
-
const shape = (_c = givenShape !== null && givenShape !== void 0 ? givenShape : defaultShape) !== null && _c !== void 0 ? _c : 'oval';
|
|
29
|
-
const width = (_d = givenWidth !== null && givenWidth !== void 0 ? givenWidth : defaultWidth) !== null && _d !== void 0 ? _d : 0;
|
|
30
|
-
const { x, y } = (0, react_1.useMemo)(() => {
|
|
31
|
-
var _a, _b, _c;
|
|
32
|
-
if (!(givenX || givenY)) {
|
|
33
|
-
const getNumber = /(-?\d+(\.\d+)?)/gu;
|
|
34
|
-
const transform = nodeStyle === null || nodeStyle === void 0 ? void 0 : nodeStyle.transform;
|
|
35
|
-
const [translateX, translateY] = transform ?
|
|
36
|
-
(_a = transform.match(getNumber)) !== null && _a !== void 0 ? _a : [
|
|
37
|
-
undefined,
|
|
38
|
-
undefined
|
|
39
|
-
] :
|
|
40
|
-
[
|
|
41
|
-
undefined,
|
|
42
|
-
undefined
|
|
43
|
-
];
|
|
44
|
-
const left = (_b = nodeStyle === null || nodeStyle === void 0 ? void 0 : nodeStyle.left) !== null && _b !== void 0 ? _b : undefined;
|
|
45
|
-
const top = (_c = nodeStyle === null || nodeStyle === void 0 ? void 0 : nodeStyle.top) !== null && _c !== void 0 ? _c : undefined;
|
|
46
|
-
return {
|
|
47
|
-
x: Number(translateX) || Number(left) || 0,
|
|
48
|
-
y: Number(translateY) || Number(top) || 0
|
|
49
|
-
};
|
|
50
|
-
}
|
|
51
|
-
return {
|
|
52
|
-
x: givenX,
|
|
53
|
-
y: givenY
|
|
54
|
-
};
|
|
55
|
-
}, [
|
|
56
|
-
givenX,
|
|
57
|
-
givenY,
|
|
58
|
-
nodeStyle
|
|
59
|
-
]);
|
|
60
|
-
(0, react_1.useEffect)(() => {
|
|
61
|
-
nodePositions === null || nodePositions === void 0 ? void 0 : nodePositions.register({
|
|
62
|
-
height,
|
|
63
|
-
id: nodeId,
|
|
64
|
-
shape,
|
|
65
|
-
width,
|
|
66
|
-
x,
|
|
67
|
-
y
|
|
68
|
-
});
|
|
69
|
-
return () => {
|
|
70
|
-
nodePositions === null || nodePositions === void 0 ? void 0 : nodePositions.unregister(nodeId);
|
|
71
|
-
};
|
|
72
|
-
}, []);
|
|
73
|
-
(0, react_1.useEffect)(() => {
|
|
74
|
-
nodePositions === null || nodePositions === void 0 ? void 0 : nodePositions.update({
|
|
75
|
-
height,
|
|
76
|
-
id: nodeId,
|
|
77
|
-
shape,
|
|
78
|
-
width,
|
|
79
|
-
x,
|
|
80
|
-
y
|
|
81
|
-
});
|
|
82
|
-
}, [
|
|
83
|
-
height,
|
|
84
|
-
nodeId,
|
|
85
|
-
nodePositions,
|
|
86
|
-
shape,
|
|
87
|
-
width,
|
|
88
|
-
x,
|
|
89
|
-
y
|
|
90
|
-
]);
|
|
91
|
-
(0, react_1.useEffect)(() => {
|
|
92
|
-
edgeSubscriber === null || edgeSubscriber === void 0 ? void 0 : edgeSubscriber.update({
|
|
93
|
-
height,
|
|
94
|
-
id: nodeId,
|
|
95
|
-
shape,
|
|
96
|
-
width,
|
|
97
|
-
x,
|
|
98
|
-
y
|
|
99
|
-
});
|
|
100
|
-
}, [
|
|
101
|
-
edgeSubscriber,
|
|
102
|
-
height,
|
|
103
|
-
nodeId,
|
|
104
|
-
shape,
|
|
105
|
-
width,
|
|
106
|
-
x,
|
|
107
|
-
y
|
|
108
|
-
]);
|
|
109
|
-
const adjustedStyle = (0, react_1.useMemo)(() => {
|
|
110
|
-
var _a;
|
|
111
|
-
return Object.assign(Object.assign({}, nodeStyle), { height, position: track ?
|
|
112
|
-
'absolute' :
|
|
113
|
-
'relative', transform: track ?
|
|
114
|
-
((_a = nodeStyle === null || nodeStyle === void 0 ? void 0 : nodeStyle.transform) !== null && _a !== void 0 ? _a : `translate(${x}px, ${y}px)`) :
|
|
115
|
-
'translate(0px, 0px)', transformOrigin: '0 0', width });
|
|
116
|
-
}, [
|
|
117
|
-
height,
|
|
118
|
-
nodeStyle,
|
|
119
|
-
track,
|
|
120
|
-
width,
|
|
121
|
-
x,
|
|
122
|
-
y
|
|
123
|
-
]);
|
|
124
|
-
return ((0, jsx_runtime_1.jsx)(react_native_1.View, Object.assign({ "data-testid": `node-${nodeId}`, ref: ref, role: 'none', style: adjustedStyle }, additionalProperties, { children: children })));
|
|
125
|
-
};
|
|
126
|
-
Node.displayName = 'LincleNode';
|
|
127
|
-
const refNode = (0, react_1.forwardRef)(Node);
|
|
128
|
-
exports.Node = refNode;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Nodes = void 0;
|
|
4
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
-
const Nodes = ({ children }) => {
|
|
6
|
-
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children }));
|
|
7
|
-
};
|
|
8
|
-
exports.Nodes = Nodes;
|
|
9
|
-
Nodes.displayName = 'LincleNodes';
|
package/dist/components/index.js
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
-
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
-
};
|
|
16
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
__exportStar(require("./Edge"), exports);
|
|
18
|
-
__exportStar(require("./Edges"), exports);
|
|
19
|
-
__exportStar(require("./Graph"), exports);
|
|
20
|
-
__exportStar(require("./Node"), exports);
|
|
21
|
-
__exportStar(require("./Nodes"), exports);
|
package/dist/index.js
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
-
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
-
};
|
|
16
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
__exportStar(require("./components"), exports);
|
|
18
|
-
__exportStar(require("./shared"), exports);
|
package/dist/shared.js
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useUpdateEdge = exports.useRemoveEdge = exports.useNodePositions = exports.useGrid = exports.useEdgeSubscriber = exports.useEdges = exports.useEdge = exports.useDiagramId = exports.useDefaultShape = exports.useDefaultNodeWidth = exports.useDefaultNodeHeight = exports.useDefaultLine = exports.Providers = exports.generateOrigins = void 0;
|
|
4
|
-
var react_shared_1 = require("@lincle/react-shared");
|
|
5
|
-
Object.defineProperty(exports, "generateOrigins", { enumerable: true, get: function () { return react_shared_1.generateOrigins; } });
|
|
6
|
-
Object.defineProperty(exports, "Providers", { enumerable: true, get: function () { return react_shared_1.Providers; } });
|
|
7
|
-
Object.defineProperty(exports, "useDefaultLine", { enumerable: true, get: function () { return react_shared_1.useDefaultLine; } });
|
|
8
|
-
Object.defineProperty(exports, "useDefaultNodeHeight", { enumerable: true, get: function () { return react_shared_1.useDefaultNodeHeight; } });
|
|
9
|
-
Object.defineProperty(exports, "useDefaultNodeWidth", { enumerable: true, get: function () { return react_shared_1.useDefaultNodeWidth; } });
|
|
10
|
-
Object.defineProperty(exports, "useDefaultShape", { enumerable: true, get: function () { return react_shared_1.useDefaultShape; } });
|
|
11
|
-
Object.defineProperty(exports, "useDiagramId", { enumerable: true, get: function () { return react_shared_1.useDiagramId; } });
|
|
12
|
-
Object.defineProperty(exports, "useEdge", { enumerable: true, get: function () { return react_shared_1.useEdge; } });
|
|
13
|
-
Object.defineProperty(exports, "useEdges", { enumerable: true, get: function () { return react_shared_1.useEdges; } });
|
|
14
|
-
Object.defineProperty(exports, "useEdgeSubscriber", { enumerable: true, get: function () { return react_shared_1.useEdgeSubscriber; } });
|
|
15
|
-
Object.defineProperty(exports, "useGrid", { enumerable: true, get: function () { return react_shared_1.useGrid; } });
|
|
16
|
-
Object.defineProperty(exports, "useNodePositions", { enumerable: true, get: function () { return react_shared_1.useNodePositions; } });
|
|
17
|
-
Object.defineProperty(exports, "useRemoveEdge", { enumerable: true, get: function () { return react_shared_1.useRemoveEdge; } });
|
|
18
|
-
Object.defineProperty(exports, "useUpdateEdge", { enumerable: true, get: function () { return react_shared_1.useUpdateEdge; } });
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|