UNPKG

@redocly/theme

Version:

Shared UI components lib

38 lines 2.16 kB
"use strict"; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); exports.CatalogEntityRelationsEdge = CatalogEntityRelationsEdge; const react_1 = __importDefault(require("react")); const react_2 = require("@xyflow/react"); const styled_components_1 = __importDefault(require("styled-components")); function CatalogEntityRelationsEdge(props) { const { id, sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, style, label, markerEnd, className, } = props; const [edgePath, labelX, labelY] = (0, react_2.getSmoothStepPath)({ sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, borderRadius: 12, }); return (react_1.default.createElement(react_1.default.Fragment, null, react_1.default.createElement(react_2.BaseEdge, { id: id, path: edgePath, style: style, markerEnd: markerEnd }), label ? (react_1.default.createElement(react_2.EdgeLabelRenderer, null, react_1.default.createElement(EdgeLabel, { className: className ? `nopan ${className}` : 'nopan', style: { transform: `translate(-50%, 0%) translate(${labelX}px, ${labelY - 10}px)` }, "data-component-name": "Catalog/CatalogEntity/CatalogEntityGraph/CatalogEntityRelationsEdge" }, label))) : null)); } const EdgeLabel = styled_components_1.default.div ` position: absolute; background: var(--catalog-entity-relations-edge-label-bg-color); color: var(--catalog-entity-relations-edge-label-text-color); border: var(--catalog-entity-relations-edge-label-border-width) var(--catalog-entity-relations-edge-label-border-style) var(--catalog-entity-relations-edge-label-border-color); border-radius: var(--catalog-entity-relations-edge-label-border-radius); padding: var(--catalog-entity-relations-edge-label-padding); font-size: var(--catalog-entity-relations-edge-label-font-size); line-height: var(--catalog-entity-relations-edge-label-line-height); `; //# sourceMappingURL=CatalogEntityRelationsEdge.js.map