@eccenca/gui-elements
Version:
GUI elements based on other libraries, usable in React application, written in Typescript.
88 lines • 5.23 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.EdgeLabelObject = exports.EdgeLabel = void 0;
const react_1 = __importStar(require("react"));
const Intent_1 = require("../../../common/Intent");
const constants_1 = require("../../../configuration/constants");
const index_1 = require("../../../index");
exports.EdgeLabel = (0, react_1.memo)((_a) => {
var { depiction, text, actions, large, fullWidth, loose, intent, title, className } = _a, otherDivProps = __rest(_a, ["depiction", "text", "actions", "large", "fullWidth", "loose", "intent", "title", "className"]);
const depEl = !!depiction && typeof depiction === "string" ? (react_1.default.createElement(index_1.Depiction, { image: react_1.default.createElement(index_1.Icon, { name: depiction }) })) : (depiction);
return (react_1.default.createElement("div", Object.assign({ className: `${constants_1.CLASSPREFIX}-graphviz__edge-label` +
(large ? ` ${constants_1.CLASSPREFIX}-graphviz__edge-label--large` : "") +
(fullWidth ? ` ${constants_1.CLASSPREFIX}-graphviz__edge-label--fullwidth` : "") +
(loose ? ` ${constants_1.CLASSPREFIX}-graphviz__edge-label--loose` : "") +
(intent ? ` ${(0, Intent_1.intentClassName)(intent)}` : "") +
(className ? ` ${className}` : "") }, otherDivProps),
!!depEl && (react_1.default.createElement("div", { className: `${constants_1.CLASSPREFIX}-graphviz__edge-label__depiction` }, react_1.default.cloneElement(depEl, {
padding: "tiny",
ratio: "1:1",
resizing: "contain",
forceInlineSvg: true,
border: false,
backgroundColor: undefined,
}))),
react_1.default.createElement("div", { className: `${constants_1.CLASSPREFIX}-graphviz__edge-label__text`, title: title }, typeof text === "string" ? react_1.default.createElement(index_1.OverflowText, null, text) : text),
!!actions && react_1.default.createElement("div", { className: `${constants_1.CLASSPREFIX}-graphviz__edge-label__aux` }, actions)));
});
exports.EdgeLabelObject = (0, react_1.memo)((_a) => {
var { children, edgeCenter, resizeTimeout = -1 } = _a, otherForeignObjectProps = __rest(_a, ["children", "edgeCenter", "resizeTimeout"]);
const containerCallback = react_1.default.useCallback((containerRef) => {
if (containerRef)
labelSize(containerRef);
}, [edgeCenter]);
const labelSize = (container) => {
const labelElement = container.getElementsByClassName(`${constants_1.CLASSPREFIX}-graphviz__edge-label`);
if (labelElement.length > 0) {
const width = labelElement[0].offsetWidth;
const height = labelElement[0].offsetHeight;
container.setAttribute("x", (edgeCenter[0] - width / 2).toString());
container.setAttribute("y", (edgeCenter[1] - height / 2).toString());
container.setAttribute("width", width.toString());
container.setAttribute("height", height.toString());
}
else if (resizeTimeout > 0) {
// Content is not ready yet, recall resizing process after timeout.
// This can happen in case the children is actually not a `EdgeLabel`.
setTimeout(() => {
labelSize(container);
}, resizeTimeout);
}
};
return (react_1.default.createElement("foreignObject", Object.assign({ ref: containerCallback, className: `${constants_1.CLASSPREFIX}-graphviz__edge-labelobject`, width: "1", height: "1" }, otherForeignObjectProps, { requiredExtensions: "http://www.w3.org/1999/xhtml" }), children));
});
//# sourceMappingURL=EdgeLabel.js.map