@lincle/react-web-base 0.0.1 → 0.4.0-next.1

package/LICENSE.md

@@ -0,0 +1,165 @@
+                   GNU LESSER GENERAL PUBLIC LICENSE
+                       Version 3, 29 June 2007
+
+ Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+
+  This version of the GNU Lesser General Public License incorporates
+the terms and conditions of version 3 of the GNU General Public
+License, supplemented by the additional permissions listed below.
+
+  0. Additional Definitions.
+
+  As used herein, "this License" refers to version 3 of the GNU Lesser
+General Public License, and the "GNU GPL" refers to version 3 of the GNU
+General Public License.
+
+  "The Library" refers to a covered work governed by this License,
+other than an Application or a Combined Work as defined below.
+
+  An "Application" is any work that makes use of an interface provided
+by the Library, but which is not otherwise based on the Library.
+Defining a subclass of a class defined by the Library is deemed a mode
+of using an interface provided by the Library.
+
+  A "Combined Work" is a work produced by combining or linking an
+Application with the Library.  The particular version of the Library
+with which the Combined Work was made is also called the "Linked
+Version".
+
+  The "Minimal Corresponding Source" for a Combined Work means the
+Corresponding Source for the Combined Work, excluding any source code
+for portions of the Combined Work that, considered in isolation, are
+based on the Application, and not on the Linked Version.
+
+  The "Corresponding Application Code" for a Combined Work means the
+object code and/or source code for the Application, including any data
+and utility programs needed for reproducing the Combined Work from the
+Application, but excluding the System Libraries of the Combined Work.
+
+  1. Exception to Section 3 of the GNU GPL.
+
+  You may convey a covered work under sections 3 and 4 of this License
+without being bound by section 3 of the GNU GPL.
+
+  2. Conveying Modified Versions.
+
+  If you modify a copy of the Library, and, in your modifications, a
+facility refers to a function or data to be supplied by an Application
+that uses the facility (other than as an argument passed when the
+facility is invoked), then you may convey a copy of the modified
+version:
+
+   a) under this License, provided that you make a good faith effort to
+   ensure that, in the event an Application does not supply the
+   function or data, the facility still operates, and performs
+   whatever part of its purpose remains meaningful, or
+
+   b) under the GNU GPL, with none of the additional permissions of
+   this License applicable to that copy.
+
+  3. Object Code Incorporating Material from Library Header Files.
+
+  The object code form of an Application may incorporate material from
+a header file that is part of the Library.  You may convey such object
+code under terms of your choice, provided that, if the incorporated
+material is not limited to numerical parameters, data structure
+layouts and accessors, or small macros, inline functions and templates
+(ten or fewer lines in length), you do both of the following:
+
+   a) Give prominent notice with each copy of the object code that the
+   Library is used in it and that the Library and its use are
+   covered by this License.
+
+   b) Accompany the object code with a copy of the GNU GPL and this license
+   document.
+
+  4. Combined Works.
+
+  You may convey a Combined Work under terms of your choice that,
+taken together, effectively do not restrict modification of the
+portions of the Library contained in the Combined Work and reverse
+engineering for debugging such modifications, if you also do each of
+the following:
+
+   a) Give prominent notice with each copy of the Combined Work that
+   the Library is used in it and that the Library and its use are
+   covered by this License.
+
+   b) Accompany the Combined Work with a copy of the GNU GPL and this license
+   document.
+
+   c) For a Combined Work that displays copyright notices during
+   execution, include the copyright notice for the Library among
+   these notices, as well as a reference directing the user to the
+   copies of the GNU GPL and this license document.
+
+   d) Do one of the following:
+
+       0) Convey the Minimal Corresponding Source under the terms of this
+       License, and the Corresponding Application Code in a form
+       suitable for, and under terms that permit, the user to
+       recombine or relink the Application with a modified version of
+       the Linked Version to produce a modified Combined Work, in the
+       manner specified by section 6 of the GNU GPL for conveying
+       Corresponding Source.
+
+       1) Use a suitable shared library mechanism for linking with the
+       Library.  A suitable mechanism is one that (a) uses at run time
+       a copy of the Library already present on the user's computer
+       system, and (b) will operate properly with a modified version
+       of the Library that is interface-compatible with the Linked
+       Version.
+
+   e) Provide Installation Information, but only if you would otherwise
+   be required to provide such information under section 6 of the
+   GNU GPL, and only to the extent that such information is
+   necessary to install and execute a modified version of the
+   Combined Work produced by recombining or relinking the
+   Application with a modified version of the Linked Version. (If
+   you use option 4d0, the Installation Information must accompany
+   the Minimal Corresponding Source and Corresponding Application
+   Code. If you use option 4d1, you must provide the Installation
+   Information in the manner specified by section 6 of the GNU GPL
+   for conveying Corresponding Source.)
+
+  5. Combined Libraries.
+
+  You may place library facilities that are a work based on the
+Library side by side in a single library together with other library
+facilities that are not Applications and are not covered by this
+License, and convey such a combined library under terms of your
+choice, if you do both of the following:
+
+   a) Accompany the combined library with a copy of the same work based
+   on the Library, uncombined with any other library facilities,
+   conveyed under the terms of this License.
+
+   b) Give prominent notice with the combined library that part of it
+   is a work based on the Library, and explaining where to find the
+   accompanying uncombined form of the same work.
+
+  6. Revised Versions of the GNU Lesser General Public License.
+
+  The Free Software Foundation may publish revised and/or new versions
+of the GNU Lesser General Public License from time to time. Such new
+versions will be similar in spirit to the present version, but may
+differ in detail to address new problems or concerns.
+
+  Each version is given a distinguishing version number. If the
+Library as you received it specifies that a certain numbered version
+of the GNU Lesser General Public License "or any later version"
+applies to it, you have the option of following the terms and
+conditions either of that published version or of any later version
+published by the Free Software Foundation. If the Library as you
+received it does not specify a version number of the GNU Lesser
+General Public License, you may choose any version of the GNU Lesser
+General Public License ever published by the Free Software Foundation.
+
+  If the Library as you received it specifies that a proxy can decide
+whether future versions of the GNU Lesser General Public License shall
+apply, that proxy's public statement of acceptance of any version is
+permanent authorization for you to choose that version for the
+Library.

package/README.md

@@ -15,8 +15,8 @@
 </div>
 
 <div align="center">
-	<a href="https://gitlab.com/lincle/lincle/commits/master"><img alt="Build Status" src="https://gitlab.com/lincle/lincle/badges/master/pipeline.svg" /></a>
-	<a href="https://lincle.gitlab.io/lincle/stats/react-web-base/coverage/lcov-report/"><img alt="Coverage Report" src="https://gitlab.com/lincle/lincle/badges/master/coverage.svg" /></a>
+	<a href="https://gitlab.com/digested/lincle/commits/master"><img alt="Build Status" src="https://gitlab.com/digested/lincle/badges/master/pipeline.svg" /></a>
+	<a href="https://lincle.gitlab.io/lincle/stats/react-web-base/coverage/lcov-report/"><img alt="Coverage Report" src="https://gitlab.com/digested/lincle/badges/master/coverage.svg" /></a>
 	<a href="https://lincle.gitlab.io/lincle/stats/react-web-base/webpack/"><img alt="Build Analysis" src="https://img.shields.io/badge/webpack-stats-blue.svg" /></a>
 </div>
 
@@ -45,8 +45,8 @@ import '@lincle/react-web-base/dist/main.min.css';
 The following example will generate this diagram:
 
 <div align="center">
-	<a href="https://gitlab.com/lincle/lincle/-/raw/master/static/simple.png">
-		<img src="https://gitlab.com/lincle/lincle/-/raw/master/static/simple.png" alt="resulting screenshot of simple example" style="max-width:100%;">
+	<a href="https://gitlab.com/digested/lincle/-/raw/master/static/simple.png">
+		<img src="https://gitlab.com/digested/lincle/-/raw/master/static/simple.png" alt="resulting screenshot of simple example" style="max-width:100%;">
 	</a>
 </div>
 

package/dist/{Edge → components/Edge}/index.d.ts

@@ -1,4 +1,4 @@
-import { type EdgeProps } from '..';
+import { type EdgeProps } from '../../shared';
 import { type FunctionComponent } from 'react';
 declare const Edge: FunctionComponent<EdgeProps>;
 export default Edge;

package/dist/{Edge → components/Edge}/index.js

@@ -4,14 +4,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+const shared_1 = require("../../shared");
 const Path_1 = __importDefault(require("../Path"));
-const react_shared_1 = require("@lincle/react-shared");
 const react_1 = require("react");
 const Edge = ({ children, className = '', dash, id: edgeId, line: givenLine, markerEnd, markerStart, path, sourceId, targetId }) => {
     var _a, _b, _c, _d;
-    const diagramId = (_a = (0, react_1.useContext)(react_shared_1.GraphContext)) === null || _a === void 0 ? void 0 : _a.diagramId;
-    const edgeSubscriber = (_b = (0, react_1.useContext)(react_shared_1.GraphContext)) === null || _b === void 0 ? void 0 : _b.edgeSubscriber;
-    const defaultLine = (_d = (_c = (0, react_1.useContext)(react_shared_1.GraphContext)) === null || _c === void 0 ? void 0 : _c.defaultSettings) === null || _d === void 0 ? void 0 : _d.line;
+    const diagramId = (_a = (0, react_1.useContext)(shared_1.GraphContext)) === null || _a === void 0 ? void 0 : _a.diagramId;
+    const edgeSubscriber = (_b = (0, react_1.useContext)(shared_1.GraphContext)) === null || _b === void 0 ? void 0 : _b.edgeSubscriber;
+    const defaultLine = (_d = (_c = (0, react_1.useContext)(shared_1.GraphContext)) === null || _c === void 0 ? void 0 : _c.defaultSettings) === null || _d === void 0 ? void 0 : _d.line;
     const line = givenLine !== null && givenLine !== void 0 ? givenLine : defaultLine;
     const [source, setSource] = (0, react_1.useState)();
     const [target, setTarget] = (0, react_1.useState)();

package/dist/{Edges → components/Edges}/index.d.ts

@@ -1,4 +1,4 @@
-import { type EdgesProps as EdgesPartialProps } from '..';
+import { type EdgesProps as EdgesPartialProps } from '../../shared';
 import { type CSSProperties, type FunctionComponent } from 'react';
 declare const Edges: FunctionComponent<EdgesProps>;
 export default Edges;

package/dist/{Edges → components/Edges}/index.js

@@ -1,11 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_shared_1 = require("@lincle/react-shared");
+const shared_1 = require("../../shared");
 const react_1 = require("react");
-const Edges = ({ className = '', children, dash, style }) => {
+const Edges = ({ children, className = '', dash, style }) => {
     var _a;
-    const id = (_a = (0, react_1.useContext)(react_shared_1.GraphContext)) === null || _a === void 0 ? void 0 : _a.diagramId;
+    const id = (_a = (0, react_1.useContext)(shared_1.GraphContext)) === null || _a === void 0 ? void 0 : _a.diagramId;
     const markerId = (0, react_1.useMemo)(() => {
         return id ?
             `${id}-` :

package/dist/{Graph → components/Graph}/index.d.ts

@@ -1,4 +1,4 @@
-import { type GraphProps } from '..';
+import { type GraphProps } from '../../shared';
 import { type FunctionComponent } from 'react';
 declare const Graph: FunctionComponent<GraphProps>;
 export default Graph;

package/dist/components/Graph/index.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const GraphContexts_1 = __importDefault(require("../GraphContexts"));
+const Graph = ({ children, edgeFrequency, grid, id, line, nodeFrequency, nodeHeight, nodeWidth, shape }) => {
+    if (!id) {
+        console.error('No ID provided to @lincle/base Graph!');
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsx)(GraphContexts_1.default, { edgeFrequency: edgeFrequency, grid: grid, id: id, line: line, nodeFrequency: nodeFrequency, nodeHeight: nodeHeight, nodeWidth: nodeWidth, shape: shape, children: children }));
+};
+Graph.displayName = 'LincleGraph';
+exports.default = Graph;

package/dist/{GraphContexts → components/GraphContexts}/index.d.ts

@@ -1,4 +1,4 @@
-import { type GraphContextsProps } from '..';
+import { type GraphContextsProps } from '../../shared';
 import { type FunctionComponent } from 'react';
 declare const GraphContexts: FunctionComponent<GraphContextsProps>;
 export default GraphContexts;

package/dist/{GraphContexts → components/GraphContexts}/index.js

@@ -4,19 +4,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+const shared_1 = require("../../shared");
 const Grid_1 = __importDefault(require("../Grid"));
-const react_shared_1 = require("@lincle/react-shared");
 const react_1 = require("react");
-const GraphContexts = ({ children, edgeFrequency = react_shared_1.defaultSettings.edgeFrequency, grid = react_shared_1.defaultSettings.grid, id, line = react_shared_1.defaultSettings.line, nodeFrequency = react_shared_1.defaultSettings.nodeFrequency, nodeHeight = react_shared_1.defaultSettings.height, nodeWidth = react_shared_1.defaultSettings.width, shape = react_shared_1.defaultSettings.shape }) => {
+const GraphContexts = ({ children, edgeFrequency = shared_1.defaultSettings.edgeFrequency, grid = shared_1.defaultSettings.grid, id, line = shared_1.defaultSettings.line, nodeFrequency = shared_1.defaultSettings.nodeFrequency, nodeHeight = shared_1.defaultSettings.height, nodeWidth = shared_1.defaultSettings.width, shape = shared_1.defaultSettings.shape }) => {
     const diagramId = (0, react_1.useMemo)(() => {
         return id;
     }, []);
     const permanent = (0, react_1.useMemo)(() => {
-        console.log(react_shared_1.EdgeSubscriber);
         return {
             diagramId,
-            edgeSubscriber: new react_shared_1.EdgeSubscriber(edgeFrequency),
-            nodePositions: new react_shared_1.NodePositions()
+            edgeSubscriber: new shared_1.EdgeSubscriber(edgeFrequency),
+            nodePositions: new shared_1.NodePositions()
         };
     }, []);
     const provides = (0, react_1.useMemo)(() => {
@@ -29,18 +28,18 @@ const GraphContexts = ({ children, edgeFrequency = react_shared_1.defaultSetting
                 width: nodeWidth
             } });
     }, [
-        permanent,
         edgeFrequency,
-        nodeHeight,
         line,
         nodeFrequency,
-        shape,
-        nodeWidth
+        nodeHeight,
+        nodeWidth,
+        permanent,
+        shape
     ]);
     const hiddenGrid = grid === false ?
         children :
-        ((0, jsx_runtime_1.jsxs)(react_shared_1.GridContext.Provider, { value: grid, children: [(0, jsx_runtime_1.jsx)(Grid_1.default, {}), children] }));
-    return ((0, jsx_runtime_1.jsx)(react_shared_1.GraphContext.Provider, { value: provides, children: hiddenGrid }));
+        ((0, jsx_runtime_1.jsxs)(shared_1.GridContext.Provider, { value: grid, children: [(0, jsx_runtime_1.jsx)(Grid_1.default, {}), children] }));
+    return ((0, jsx_runtime_1.jsx)(shared_1.GraphContext.Provider, { value: provides, children: hiddenGrid }));
 };
 GraphContexts.displayName = 'LincleGraphContexts';
 exports.default = GraphContexts;

package/dist/{Grid → components/Grid}/index.d.ts

@@ -1,4 +1,4 @@
-import { type GridProps } from '..';
+import { type GridProps } from '../../shared';
 import { type FunctionComponent } from 'react';
 declare const Grid: FunctionComponent<GridProps>;
 export default Grid;

package/dist/{Grid → components/Grid}/index.js

@@ -1,14 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_shared_1 = require("@lincle/react-shared");
+const shared_1 = require("../../shared");
 const react_1 = require("react");
 const SIZE = 0.4;
 const Circle = ((0, jsx_runtime_1.jsx)("circle", { cx: SIZE, cy: SIZE, fill: 'black', r: SIZE }));
 const Grid = ({ children, scale = 1, xOffset: givenXOffset = 0, yOffset: givenYOffset = 0 }) => {
     var _a;
-    const diagramId = (_a = (0, react_1.useContext)(react_shared_1.GraphContext)) === null || _a === void 0 ? void 0 : _a.diagramId;
-    const [givenGridX, givenGridY] = (0, react_1.useContext)(react_shared_1.GridContext) || react_shared_1.defaultSettings.grid;
+    const diagramId = (_a = (0, react_1.useContext)(shared_1.GraphContext)) === null || _a === void 0 ? void 0 : _a.diagramId;
+    const [givenGridX, givenGridY] = (0, react_1.useContext)(shared_1.GridContext) || shared_1.defaultSettings.grid;
     const id = `lincle-grid-${diagramId}`;
     const gridX = (0, react_1.useMemo)(() => {
         return givenGridX * scale;
@@ -25,14 +25,14 @@ const Grid = ({ children, scale = 1, xOffset: givenXOffset = 0, yOffset: givenYO
     const xOffset = (0, react_1.useMemo)(() => {
         return givenXOffset % gridX;
     }, [
-        gridX,
-        givenXOffset
+        givenXOffset,
+        gridX
     ]);
     const yOffset = (0, react_1.useMemo)(() => {
         return givenYOffset % gridY;
     }, [
-        gridY,
-        givenYOffset
+        givenYOffset,
+        gridY
     ]);
     return ((0, jsx_runtime_1.jsxs)("svg", { className: 'lincle-base-grid', children: [(0, jsx_runtime_1.jsx)("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)("rect", { fill: `url(#${id})`, height: '100%', width: '100%', x: '0', y: '0' })] }));
 };

package/dist/{Node → components/Node}/index.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
-import { type NodeProps } from '..';
+import { type NodeProps } from '../../shared';
 declare const _default: import("react").ForwardRefExoticComponent<Omit<NodeProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 export default _default;

package/dist/{Node → components/Node}/index.js

@@ -12,12 +12,12 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_shared_1 = require("@lincle/react-shared");
+const shared_1 = require("../../shared");
 const react_1 = require("react");
 const Node = (_a, ref) => {
     var _b, _c, _d, _e, _f, _g;
-    var { className = '', children, height: givenHeight, id: nodeId, shape: givenShape, style, width: givenWidth, x: givenX = 0, y: givenY = 0 } = _a, additionalProperties = __rest(_a, ["className", "children", "height", "id", "shape", "style", "width", "x", "y"]);
-    const graphContext = (0, react_1.useContext)(react_shared_1.GraphContext);
+    var { children, className = '', height: givenHeight, id: nodeId, shape: givenShape, style: { node: nodeStyle } = {}, width: givenWidth, x: givenX = 0, y: givenY = 0 } = _a, additionalProperties = __rest(_a, ["children", "className", "height", "id", "shape", "style", "width", "x", "y"]);
+    const graphContext = (0, react_1.useContext)(shared_1.GraphContext);
     const defaultHeight = (_b = graphContext === null || graphContext === void 0 ? void 0 : graphContext.defaultSettings) === null || _b === void 0 ? void 0 : _b.width;
     const defaultShape = (_c = graphContext === null || graphContext === void 0 ? void 0 : graphContext.defaultSettings) === null || _c === void 0 ? void 0 : _c.shape;
     const defaultWidth = (_d = graphContext === null || graphContext === void 0 ? void 0 : graphContext.defaultSettings) === null || _d === void 0 ? void 0 : _d.width;
@@ -30,8 +30,8 @@ const Node = (_a, ref) => {
         var _a;
         if (!(givenX || givenY)) {
             const getNumber = /(-?\d+(\.\d+)?)/ug;
-            const [translateX, translateY] = (style === null || style === void 0 ? void 0 : style.transform) ?
-                (_a = style.transform.match(getNumber)) !== null && _a !== void 0 ? _a : [
+            const [translateX, translateY] = (nodeStyle === null || nodeStyle === void 0 ? void 0 : nodeStyle.transform) ?
+                (_a = nodeStyle.transform.match(getNumber)) !== null && _a !== void 0 ? _a : [
                     undefined,
                     undefined
                 ] :
@@ -39,11 +39,11 @@ const Node = (_a, ref) => {
                     undefined,
                     undefined
                 ];
-            const left = (style === null || style === void 0 ? void 0 : style.left) ?
-                style.left :
+            const left = (nodeStyle === null || nodeStyle === void 0 ? void 0 : nodeStyle.left) ?
+                nodeStyle.left :
                 undefined;
-            const top = (style === null || style === void 0 ? void 0 : style.top) ?
-                style.top :
+            const top = (nodeStyle === null || nodeStyle === void 0 ? void 0 : nodeStyle.top) ?
+                nodeStyle.top :
                 undefined;
             return {
                 x: Number(translateX) || Number(left) || 0,
@@ -57,7 +57,7 @@ const Node = (_a, ref) => {
     }, [
         givenX,
         givenY,
-        style
+        nodeStyle
     ]);
     (0, react_1.useEffect)(() => {
         nodePositions === null || nodePositions === void 0 ? void 0 : nodePositions.register({
@@ -101,20 +101,20 @@ const Node = (_a, ref) => {
         });
     }, [
         edgeSubscriber,
-        nodeId,
         height,
+        nodeId,
+        shape,
         width,
         x,
-        y,
-        shape
+        y
     ]);
     const adjustedStyle = (0, react_1.useMemo)(() => {
-        return Object.assign(Object.assign({}, style), { height, transform: (style === null || style === void 0 ? void 0 : style.transform) ?
-                style.transform :
+        return Object.assign(Object.assign({}, nodeStyle), { height, transform: (nodeStyle === null || nodeStyle === void 0 ? void 0 : nodeStyle.transform) ?
+                nodeStyle.transform :
                 `translate(${x}px, ${y}px) translateZ(0)`, width });
     }, [
-        style,
         height,
+        nodeStyle,
         width,
         x,
         y

package/dist/{Nodes → components/Nodes}/index.d.ts

@@ -1,4 +1,4 @@
-import { type NodesProps } from '..';
+import { type NodesProps } from '../../shared';
 import { type FunctionComponent } from 'react';
 declare const Nodes: FunctionComponent<NodesProps>;
 export default Nodes;

package/dist/{Path → components/Path}/index.d.ts

@@ -1,4 +1,4 @@
-import { type PathProps } from '..';
+import { type PathProps } from '../../shared';
 import { type FunctionComponent } from 'react';
 declare const Path: FunctionComponent<PathProps>;
 export default Path;

package/dist/{Path → components/Path}/index.js

@@ -1,18 +1,18 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
-const generateOrigins_1 = __importDefault(require("./generateOrigins"));
+const shared_1 = require("../../shared");
 const react_1 = require("react");
-const Path = ({ children, diagramId, className = '', line, markerEnd, markerStart, source, target }) => {
+const Path = ({ children, className = '', diagramId, line, markerEnd, markerStart, source, style: { center: centerStyle, path: pathStyle } = {
+    center: {},
+    path: {}
+}, target }) => {
     const hasChildren = Boolean(children);
     const origins = (0, react_1.useMemo)(() => {
         if (source &&
             target &&
             line) {
-            return (0, generateOrigins_1.default)(source, target, line, hasChildren);
+            return (0, shared_1.generateOrigins)(source, target, line, hasChildren);
         }
         return undefined;
     }, [
@@ -24,9 +24,10 @@ const Path = ({ children, diagramId, className = '', line, markerEnd, markerStar
     const center = (0, react_1.useMemo)(() => {
         var _a, _b;
         return (origins === null || origins === void 0 ? void 0 : origins.center) ?
-            ((0, jsx_runtime_1.jsx)("g", { height: '1px', transform: `translate(${(_a = origins === null || origins === void 0 ? void 0 : origins.center) === null || _a === void 0 ? void 0 : _a.x},${(_b = origins === null || origins === void 0 ? void 0 : origins.center) === null || _b === void 0 ? void 0 : _b.y})`, width: '1px', children: children })) :
+            ((0, jsx_runtime_1.jsx)("g", { height: '1px', style: centerStyle, transform: `translate(${(_a = origins === null || origins === void 0 ? void 0 : origins.center) === null || _a === void 0 ? void 0 : _a.x},${(_b = origins === null || origins === void 0 ? void 0 : origins.center) === null || _b === void 0 ? void 0 : _b.y})`, width: '1px', children: children })) :
             undefined;
     }, [
+        centerStyle,
         children,
         origins === null || origins === void 0 ? void 0 : origins.center
     ]);
@@ -38,7 +39,7 @@ const Path = ({ children, diagramId, className = '', line, markerEnd, markerStar
                             markerStart :
                             `url(#diagram-${diagramId ?
                                 `${diagramId}-` :
-                                ''}marker-circle)` })] }), center] }));
+                                ''}marker-circle)`, style: pathStyle })] }), center] }));
 };
 Path.displayName = 'LinclePath';
 exports.default = Path;

package/dist/components/index.d.ts

@@ -0,0 +1,8 @@
+export { default as Edge } from './Edge';
+export { default as Edges } from './Edges';
+export { default as Graph } from './Graph';
+export { default as GraphContexts } from './GraphContexts';
+export { default as Grid } from './Grid';
+export { default as Node } from './Node';
+export { default as Nodes } from './Nodes';
+export { default as Path } from './Path';

package/dist/components/index.js

@@ -0,0 +1,22 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Path = exports.Nodes = exports.Node = exports.Grid = exports.GraphContexts = exports.Graph = exports.Edges = exports.Edge = void 0;
+var Edge_1 = require("./Edge");
+Object.defineProperty(exports, "Edge", { enumerable: true, get: function () { return __importDefault(Edge_1).default; } });
+var Edges_1 = require("./Edges");
+Object.defineProperty(exports, "Edges", { enumerable: true, get: function () { return __importDefault(Edges_1).default; } });
+var Graph_1 = require("./Graph");
+Object.defineProperty(exports, "Graph", { enumerable: true, get: function () { return __importDefault(Graph_1).default; } });
+var GraphContexts_1 = require("./GraphContexts");
+Object.defineProperty(exports, "GraphContexts", { enumerable: true, get: function () { return __importDefault(GraphContexts_1).default; } });
+var Grid_1 = require("./Grid");
+Object.defineProperty(exports, "Grid", { enumerable: true, get: function () { return __importDefault(Grid_1).default; } });
+var Node_1 = require("./Node");
+Object.defineProperty(exports, "Node", { enumerable: true, get: function () { return __importDefault(Node_1).default; } });
+var Nodes_1 = require("./Nodes");
+Object.defineProperty(exports, "Nodes", { enumerable: true, get: function () { return __importDefault(Nodes_1).default; } });
+var Path_1 = require("./Path");
+Object.defineProperty(exports, "Path", { enumerable: true, get: function () { return __importDefault(Path_1).default; } });

package/dist/index.d.ts

@@ -1,99 +1,2 @@
-import { type EdgeNodeProps } from '@lincle/react-shared';
-import { type CSSProperties, type FunctionComponent, type ReactElement, type ReactNode } from 'react';
-declare const Edge: FunctionComponent<EdgeProps>;
-declare const Edges: FunctionComponent<EdgesProps>;
-declare const Graph: FunctionComponent<GraphProps>;
-declare const GraphContexts: FunctionComponent<GraphContextsProps>;
-declare const Grid: FunctionComponent<GridProps>;
-declare const Node: FunctionComponent<NodeProps>;
-declare const Nodes: FunctionComponent<NodesProps>;
-declare const Path: FunctionComponent<PathProps>;
-export type Line = 'curve' | 'direct' | 'step';
-export type Shape = 'oval' | 'rectangle';
-export type EdgeProps = {
-    children?: ReactNode;
-    className?: string;
-    dash?: Boolean;
-    id: number | string;
-    line?: Line;
-    markerEnd?: string;
-    markerStart?: string;
-    path?: (source?: EdgeNodeProps, target?: EdgeNodeProps, children?: ReactNode) => ReactElement;
-    sourceId: number | string;
-    targetId: number | string;
-};
-export type EdgesProps = {
-    children: Array<ReactElement<EdgeProps>> | ReactElement<EdgeProps>;
-    dash?: Boolean;
-};
-export type PathProps = {
-    children?: ReactNode;
-    className?: string;
-    diagramId?: number | string;
-    id: number | string;
-    line?: Line;
-    markerEnd?: string;
-    markerStart?: string;
-    source?: EdgeNodeProps;
-    target?: EdgeNodeProps;
-};
-export type NodeProps = {
-    children?: ReactElement | ReactElement[];
-    className?: string;
-    height?: number;
-    id: number | string;
-    ref?: React.MutableRefObject<HTMLDivElement | null> | ((instance: HTMLDivElement | null) => void) | null;
-    shape?: Shape;
-    style?: CSSProperties;
-    width?: number;
-    x?: number;
-    y?: number;
-};
-export type NodesProps = {
-    children: Array<ReactElement<NodeProps>> | ReactElement<NodeProps>;
-};
-export type GridType = [
-    number,
-    number
-];
-export type GridContextProps = GridType;
-export type GridProps = {
-    children?: ReactNode;
-    scale?: number;
-    xOffset?: number;
-    yOffset?: number;
-};
-export type GraphProps = {
-    children?: ReactNode | ReactNode[];
-    edgeFrequency?: number;
-    grid?: GridType | false;
-    id: number | string;
-    line?: Line;
-    nodeFrequency?: number;
-    nodeHeight?: number;
-    nodeWidth?: number;
-    shape?: Shape;
-};
-export type Dimensions = {
-    height: number;
-    id: number | string;
-    shape: Shape;
-    width: number;
-    x: number;
-    y: number;
-};
-export type Size = {
-    bottom: number;
-    height: number;
-    left: number;
-    right: number;
-    top: number;
-    width: number;
-};
-export type NodesDimensions = {
-    [key: string]: Dimensions;
-};
-export type GraphContextsProps = Omit<GraphProps, 'children'> & {
-    children: ReactElement<GraphProps> | ReactNode | ReactNode[];
-};
-export { Edge, Edges, Graph, GraphContexts, Grid, Node, Nodes, Path };
+export * from './components';
+export * from './shared';