@eccenca/gui-elements
Version:
GUI elements based on other libraries, usable in React application, written in Typescript.
25 lines • 1.94 kB
JavaScript
import React from "react";
import { intentClassName } from "../../../common/Intent/index.js";
import { CLASSPREFIX as eccgui } from "../../../configuration/constants.js";
// FIXME: we need to check how these markers are used and if we can justify the namings
import { MarkerArrowClosedInverse } from "./MarkerArrowClosedInverse.js";
var ReactFlowMarker = function (_a) {
var className = _a.className, _b = _a.appearance, appearance = _b === void 0 ? "arrow-closed" : _b, intent = _a.intent, reverse = _a.reverse;
var markerDisplay = {
"arrow-closed": (React.createElement("path", { d: "M-5,-4 L5,0 L-5,4 Z", fill: "currentColor", "stroke-linecap": "round", "stroke-linejoin": "round" })),
};
return (React.createElement("marker", { id: "react-flow__marker--".concat(appearance).concat(intent ? "-".concat(intent) : "").concat(reverse ? "-reverse" : ""), className: "".concat(eccgui, "-graphviz__marker") +
(className ? " ".concat(className) : "") +
(intent ? " ".concat(intentClassName(intent)) : ""), markerWidth: "12.5", markerHeight: "12.5", viewBox: "-10 -10 20 20", refX: "0", refY: "0", orient: reverse ? "auto-start-reverse" : "auto" }, markerDisplay[appearance]));
};
var ReactFlowMarkers = function () {
var intents = ["none", "primary", "accent", "success", "warning", "danger", "info"];
return (React.createElement("svg", null,
React.createElement("defs", null,
React.createElement(MarkerArrowClosedInverse, null),
intents.map(function (intent) { return (React.createElement(React.Fragment, null,
React.createElement(ReactFlowMarker, { appearance: "arrow-closed", intent: intent }),
React.createElement(ReactFlowMarker, { appearance: "arrow-closed", intent: intent, reverse: true }))); }))));
};
export { MarkerArrowClosedInverse, ReactFlowMarkers, ReactFlowMarker };
//# sourceMappingURL=ReactFlowMarkers.js.map