@byai/topology - npm Package Compare versions

Comparing version 1.8.1 to 1.9.0

CHANGELOG.md

@@ -5,2 +5,20 @@ # Changelog
 
+## [1.9.0](https://github.com/byai/topology/compare/v1.8.1...v1.9.0) (2023-12-05)
+
+
+### Features
+
+* add allowNodeInsertOnEdge ([7d8a1f6](https://github.com/byai/topology/commit/7d8a1f6d731be086181ba0d7d20929aa9f11bde6))
+* add anchorPlacement ([1032c28](https://github.com/byai/topology/commit/1032c28f66e044171b3d3160c68a0600d4158849))
+* add insert-node-in-line ([26ffd62](https://github.com/byai/topology/commit/26ffd626e9926e4060c450f8de4ed9d8c8f0831f))
+* auto Scroll when selectBox on edge of graph ([9f4ad44](https://github.com/byai/topology/commit/9f4ad449c1a95d9bdfa981b288e334655de79754))
+* delete log ([c65304b](https://github.com/byai/topology/commit/c65304b57603bfd1b6c6c509cd270c0a6bd63e3b))
+* extract generateLinesByInsertNodeInLine functions ([b78bd7f](https://github.com/byai/topology/commit/b78bd7f1a12b159d34874030f545d0f04b655bb7))
+* update onChange ([0e2dbf5](https://github.com/byai/topology/commit/0e2dbf5b20f0b5ca580d01ce5f757ea91ada6a23))
+
+
+### Bug Fixes
+
+* querySelectorAll topology-svg path ([7bb02d7](https://github.com/byai/topology/commit/7bb02d78776645b5fd59bd43df01b566d70edf58))
+
 ### [1.8.1](https://github.com/byai/topology/compare/v1.8.0...v1.8.1) (2023-11-09)
@@ -7,0 +25,0 @@

dist/lib/components/line/index.js

@@ -109,3 +109,3 @@ var __extends = (this && this.__extends) || (function () {
         return (React.createElement(React.Fragment, null,
-            React.createElement("path", { onClick: this.handleClick, strokeWidth: config.line.triggerWidth, stroke: "transparent", fill: "none", style: { pointerEvents: 'all', transition: transition }, d: computeLinePath(start, getTriangleStart(), lineOffsetY), onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }),
+            React.createElement("path", { onClick: this.handleClick, "data-json": dataJson, strokeWidth: config.line.triggerWidth, stroke: "transparent", fill: "none", style: { pointerEvents: 'all', transition: transition }, d: computeLinePath(start, getTriangleStart(), lineOffsetY), onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }),
             React.createElement("path", { onClick: this.handleClick, strokeWidth: highLight || selected || hover ? config.line.strokeLargeWidth : config.line.strokeWidth, stroke: lColor, fill: "none", style: { pointerEvents: 'all', transition: transition }, d: computeLinePath(start, getTriangleStart(), lineOffsetY), onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }),
@@ -112,0 +112,0 @@ React.createElement("path", { className: readOnly ? '' : 'byai-topology-line-end-triangle', fill: lColor, stroke: "none", "data-type": LineEditType.EDIT_END, "data-json": dataJson, style: { pointerEvents: 'all', transition: transition }, d: computeTrianglePath(getTriangleStart(), config.line.triangleWidth), onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave })));

dist/lib/components/selection/index.d.ts

@@ -12,2 +12,6 @@ import React, { PureComponent } from 'react';
     onClick?: React.MouseEventHandler<HTMLDivElement>;
+    scrollDistance?: {
+        scrollTopDistance: number;
+        scrollLeftDistance: number;
+    };
 }
@@ -14,0 +18,0 @@ export interface ISelectionState {

dist/lib/components/selection/index.js

@@ -26,3 +26,3 @@ var __extends = (this && this.__extends) || (function () {
         _this.computeSize = function () {
-            var _a = _this.props, xPos = _a.xPos, yPos = _a.yPos, wrapper = _a.wrapper;
+            var _a = _this.props, xPos = _a.xPos, yPos = _a.yPos, wrapper = _a.wrapper, _b = _a.scrollDistance, scrollDistance = _b === void 0 ? {} : _b;
             if (!xPos || !yPos || !wrapper) {
@@ -33,8 +33,9 @@ return;
             var yPosList = yPos.split(',').map(function (d) { return +d; });
-            var _b = computeCanvasPo({ x: xPosList[0], y: yPosList[0] }, wrapper), initX = _b.x, initY = _b.y;
-            var _c = computeCanvasPo({ x: xPosList[1], y: yPosList[1] }, wrapper), x = _c.x, y = _c.y;
-            var minX = Math.min(initX, x);
-            var minY = Math.min(initY, y);
-            var width = Math.abs(x - initX);
-            var height = Math.abs(y - initY);
+            var _c = computeCanvasPo({ x: xPosList[0], y: yPosList[0] }, wrapper), initX = _c.x, initY = _c.y;
+            var _d = computeCanvasPo({ x: xPosList[1], y: yPosList[1] }, wrapper), x = _d.x, y = _d.y;
+            var _e = scrollDistance.scrollLeftDistance, scrollLeftDistance = _e === void 0 ? 0 : _e, _f = scrollDistance.scrollTopDistance, scrollTopDistance = _f === void 0 ? 0 : _f;
+            var minX = Math.min(initX, x) - scrollLeftDistance;
+            var minY = Math.min(initY, y) - scrollTopDistance;
+            var width = Math.abs(x - initX) + Math.abs(scrollLeftDistance);
+            var height = Math.abs(y - initY) + Math.abs(scrollTopDistance);
             _this.setState({
@@ -41,0 +42,0 @@ minX: minX,

dist/lib/components/topology/index.d.ts

@@ -22,2 +22,3 @@ import React, { HTMLAttributes } from 'react';
     downloadImg?: (scopeType?: 'global' | 'selected', download?: boolean, name?: string) => void;
+    allowNodeInsertOnEdge?: boolean;
     canConnectMultiLines?: boolean;
@@ -46,2 +47,3 @@ overlap?: boolean;
     startPointAnchorId?: string;
+    anchorPlacement?: string;
     lineTextMap?: {
@@ -86,2 +88,6 @@ [x: string]: string;
         y: number;
+        initScrollLeft?: number;
+        initScrollTop?: number;
+        scrollLeft?: number;
+        scrollTop?: number;
         status?: 'drag' | 'static' | 'none';
@@ -192,2 +198,13 @@ } | undefined;
     handleLineDraw: (startId: string) => void;
+    /**
+     * 遍历所有线条，生成[{ data: {origin, po}, point: [] }] 结构
+     */
+    getCurvePointsAndLineOriginMap: () => any[];
+    /**
+     * 拖动节点到边中间，自动连线
+     * @param dragId 当前拖动的节点
+     * @param targetPos 节点释放的位置
+     * @returns
+     */
+    generateLinesByInsertNodeInLine: (dragId: any, targetPos: any) => any[];
     handleNodeDraw: (nodeInfoList: [string, IPosition][], childPosMap?: {
@@ -194,0 +211,0 @@ [key: string]: {

dist/lib/utils/index.d.ts

@@ -32,2 +32,6 @@ import { IPosition, ITopologyNode } from '../declare';
 };
+export declare const computeAnchorPoWithNodeBottom: (parentNode: ITopologyNode) => {
+    x: number;
+    y: number;
+};
 export declare const computeMaxAndMin: (nodes: ITopologyNode[]) => {
@@ -34,0 +38,0 @@ minX: number;

dist/lib/utils/index.js

@@ -165,2 +165,15 @@ var __assign = (this && this.__assign) || function () {
 };
+// 锚点始终位于节点底部
+export var computeAnchorPoWithNodeBottom = function (parentNode) {
+    var parentSize = getNodeSize(parentNode.id);
+    var parentPosition = parentNode.position || { x: 0, y: 0 };
+    var po = {
+        x: parentPosition.x + parentSize.width / 2,
+        y: parentPosition.y + parentSize.height,
+    };
+    if (Number.isNaN(po.x) || Number.isNaN(po.y)) {
+        return null;
+    }
+    return po;
+};
 export var computeMaxAndMin = function (nodes) {
@@ -167,0 +180,0 @@ // @ts-ignore

dist/lib/utils/tree.d.ts

 import { ITopologyNode, ITopologyData } from '../declare';
 /** 只含有单个root节点 */
 export declare const onlyOneRoot: (data: ITopologyData) => boolean;
+/**
+ * 判断是否是孤立节点
+ * @param lines
+ * @param id
+ * @returns
+ */
+export declare const isolatedNode: (data: any, id: any) => boolean;
 /** 单个父节点 */
@@ -5,0 +12,0 @@ export declare const onlyOneParent: (data: ITopologyData) => boolean;

dist/lib/utils/tree.js

@@ -35,2 +35,18 @@ var __assign = (this && this.__assign) || function () {
 };
+/**
+ * 判断是否是孤立节点
+ * @param lines
+ * @param id
+ * @returns
+ */
+export var isolatedNode = function (data, id) {
+    var lines = data.lines;
+    var lineHash = lines.reduce(function (pre, cur) {
+        var _a;
+        var start = cur.start, end = cur.end;
+        var parent = start.split('-')[0];
+        return __assign(__assign({}, pre), (_a = {}, _a[parent] = true, _a[end] = true, _a));
+    }, {});
+    return !lineHash[id];
+};
 /** 单个父节点 */
@@ -37,0 +53,0 @@ export var onlyOneParent = function (data) {

package.json

 {
   "name": "@byai/topology",
-  "version": "1.8.1",
+  "version": "1.9.0",
   "description": "拓扑图组件",
@@ -98,2 +98,3 @@ "bugs": {
   "dependencies": {
+    "bezier-intersect": "^0.0.3",
     "classnames": "^2.2.6",
@@ -100,0 +101,0 @@ "d3-path": "^2.0.0",

README.md

@@ -90,2 +90,8 @@ # Topology
         <tr>
+            <td>anchorPlacement</td>
+            <td>string</td>
+            <td></td>
+            <td>锚点位置，若值为 bottom，则位于锚点的父节点底部</td>
+        </tr>
+        <tr>
             <td>lineTextMap</td>
@@ -139,2 +145,8 @@ <td>object</td>
         <tr>
+            <td>allowNodeInsertOnEdge</td>
+            <td>boolean</td>
+            <td></td>
+            <td>是否开启拖拽节点到线中间进行节点插入</td>
+        </tr>
+        <tr>
             <td>canConnectMultiLines</td>
@@ -141,0 +153,0 @@ <td>bool</td>

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

462494

increased by4.21%

Lines of code

5695

increased by3.3%

Number of lines in readme file

351

increased by3.54%

Worsened metrics

Dependency count

13

increased by8.33%

Dependency changes

• + Addedbezier-intersect@^0.0.3

• + Addedbezier-intersect@0.0.3(transitive)