@eccenca/gui-elements
Version:
GUI elements based on other libraries, usable in React application, written in Typescript.
150 lines • 7.54 kB
JavaScript
var __read = (this && this.__read) || function (o, n) {
var m = typeof Symbol === "function" && o[Symbol.iterator];
if (!m) return o;
var i = m.call(o), r, ar = [], e;
try {
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
}
catch (error) { e = { error: error }; }
finally {
try {
if (r && !r.done && (m = i["return"])) m.call(i);
}
finally { if (e) throw e.error; }
}
return ar;
};
import { getEdgeCenter, Position } from "react-flow-renderer";
import { getSmoothStepPath } from "./getSmoothStepPath.js";
var posCorrectionEdge = function (_a) {
var sourceX = _a.sourceX, sourceY = _a.sourceY, sourcePosition = _a.sourcePosition, targetX = _a.targetX, targetY = _a.targetY, targetPosition = _a.targetPosition, _b = _a.correctionLength, correctionLength = _b === void 0 ? 7 : _b, _c = _a.correctionRadius, correctionRadius = _c === void 0 ? 7 : _c;
var newSourceX = sourceX;
var newSourceY = sourceY;
var newTargetX = targetX;
var newTargetY = targetY;
var startCommandCorrection = "M ".concat(sourceX, ",").concat(sourceY, " ");
var endCommandCorrection = "";
if (sourcePosition === Position.Left && sourceX < targetX) {
newSourceX = newSourceX - 2 * correctionLength;
if (sourceY < targetY) {
newSourceY = sourceY + correctionRadius;
startCommandCorrection =
startCommandCorrection +
" L ".concat(newSourceX + correctionRadius, ",").concat(sourceY, " A ").concat(correctionRadius, " ").concat(correctionRadius, " ").concat(90, " ").concat(0, " ").concat(0, " ");
}
else {
newSourceY = sourceY - correctionRadius;
startCommandCorrection =
startCommandCorrection +
" L ".concat(newSourceX + correctionRadius, ",").concat(sourceY, " A ").concat(correctionRadius, " ").concat(correctionRadius, " ").concat(90, " ").concat(0, " ").concat(1, " ");
}
}
if (sourcePosition === Position.Right && sourceX > targetX) {
newSourceX =
targetPosition === Position.Right
? newSourceX + correctionLength + correctionRadius
: newSourceX + correctionLength;
if (sourceY < targetY) {
newSourceY = sourceY + correctionRadius;
startCommandCorrection =
startCommandCorrection +
" L ".concat(newSourceX - correctionRadius, ",").concat(sourceY, " A ").concat(correctionRadius, " ").concat(correctionRadius, " ").concat(90, " ").concat(0, " ").concat(1, " ");
}
else {
newSourceY = sourceY - correctionRadius;
startCommandCorrection =
startCommandCorrection +
" L ".concat(newSourceX - correctionRadius, ",").concat(sourceY, " A ").concat(correctionRadius, " ").concat(correctionRadius, " ").concat(90, " ").concat(0, " ").concat(0, " ");
}
}
if (targetPosition === Position.Left && sourceX > targetX) {
newTargetX = newTargetX - 3 * correctionLength;
if (sourceY < targetY) {
newTargetY = targetY - correctionRadius;
endCommandCorrection = " A ".concat(correctionRadius, " ").concat(correctionRadius, " ").concat(90, " ").concat(0, " ").concat(0, " ").concat(newTargetX + correctionRadius, ",").concat(targetY, " L ").concat(targetX, ",").concat(targetY);
}
else {
newTargetY = targetY + correctionRadius;
endCommandCorrection = " A ".concat(correctionRadius, " ").concat(correctionRadius, " ").concat(90, " ").concat(0, " ").concat(1, " ").concat(newTargetX + correctionRadius, ",").concat(targetY, " L ").concat(targetX, ",").concat(targetY);
}
}
if (targetPosition === Position.Right && sourceX < targetX) {
newTargetX = newTargetX + 3 * correctionLength;
if (sourceY < targetY) {
newTargetY = targetY - correctionRadius;
endCommandCorrection = " A ".concat(correctionRadius, " ").concat(correctionRadius, " ").concat(90, " ").concat(0, " ").concat(1, " ").concat(newTargetX - correctionRadius, ",").concat(targetY, " L ").concat(targetX, ",").concat(targetY);
}
else {
newTargetY = targetY + correctionRadius;
endCommandCorrection = " A ".concat(correctionRadius, " ").concat(correctionRadius, " ").concat(90, " ").concat(0, " ").concat(0, " ").concat(newTargetX - correctionRadius, ",").concat(targetY, " L ").concat(targetX, ",").concat(targetY);
}
}
return {
newSourceX: newSourceX,
newSourceY: newSourceY,
newTargetX: newTargetX,
newTargetY: newTargetY,
startCommandCorrection: startCommandCorrection,
endCommandCorrection: endCommandCorrection,
};
};
var pathCommandCorrection = function (_a) {
var pathCommand = _a.pathCommand, startCorrection = _a.startCorrection, endCorrection = _a.endCorrection;
return startCorrection + pathCommand.substring(1) + endCorrection;
};
export var drawEdgeStraight = function (_a) {
var sourceX = _a.sourceX, sourceY = _a.sourceY, sourcePosition = _a.sourcePosition, targetX = _a.targetX, targetY = _a.targetY, targetPosition = _a.targetPosition;
var corrections = posCorrectionEdge({
sourceX: sourceX,
sourceY: sourceY,
sourcePosition: sourcePosition,
targetX: targetX,
targetY: targetY,
targetPosition: targetPosition,
correctionRadius: 0,
});
var pathCommand = "M ".concat(corrections.newSourceX, ",").concat(corrections.newSourceY, "L ").concat(corrections.newTargetX, ",").concat(corrections.newTargetY);
return pathCommandCorrection({
pathCommand: pathCommand,
startCorrection: corrections.startCommandCorrection,
endCorrection: corrections.endCommandCorrection,
});
};
export var getStraightPath = function (params) {
var path = drawEdgeStraight(params);
var _a = __read(getEdgeCenter({
sourceX: params.sourceX,
sourceY: params.sourceY,
targetX: params.targetX,
targetY: params.targetY,
}), 4), labelX = _a[0], labelY = _a[1], offsetX = _a[2], offsetY = _a[3];
return [path, labelX, labelY, offsetX, offsetY];
};
export var drawEdgeStep = function (_a) {
var sourceX = _a.sourceX, sourceY = _a.sourceY, sourcePosition = _a.sourcePosition, targetX = _a.targetX, targetY = _a.targetY, targetPosition = _a.targetPosition, _b = _a.data, data = _b === void 0 ? {} : _b;
var corrections = posCorrectionEdge({
sourceX: sourceX,
sourceY: sourceY,
sourcePosition: sourcePosition,
targetX: targetX,
targetY: targetY,
targetPosition: targetPosition,
correctionLength: data.stepCornerRadius || 7,
correctionRadius: data.stepCornerRadius || 7,
});
var pathCommand = getSmoothStepPath({
sourceX: corrections.newSourceX,
sourceY: corrections.newSourceY,
sourcePosition: sourcePosition,
targetX: corrections.newTargetX,
targetY: corrections.newTargetY,
targetPosition: targetPosition,
borderRadius: data.stepCornerRadius || 7,
});
return pathCommandCorrection({
pathCommand: pathCommand,
startCorrection: corrections.startCommandCorrection,
endCorrection: corrections.endCommandCorrection,
});
};
//# sourceMappingURL=utils.js.map