@skbkontur/cassandra-distributed-task-queue-ui
Version:
.NET library implementing distributed task queue machinery using Apache Cassandra
42 lines • 2.74 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.TimeLine = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_ui_1 = require("@skbkontur/react-ui");
const react_1 = require("react");
const TimeLine_styles_1 = require("./TimeLine.styles");
const TimeLineCycled_1 = require("./TimeLineCycled");
class TimeLine extends react_1.Component {
render() {
const { children } = this.props;
return ((0, jsx_runtime_1.jsx)("div", { className: TimeLine_styles_1.jsStyles.root(), "data-tid": "InnerTimeLine", children: children }));
}
}
exports.TimeLine = TimeLine;
TimeLine.Branch = function TimeLineBranch({ children }) {
const theme = (0, react_1.useContext)(react_ui_1.ThemeContext);
return ((0, jsx_runtime_1.jsxs)("div", { className: `${TimeLine_styles_1.jsStyles.root()} ${TimeLine_styles_1.jsStyles.branch()}`, children: [(0, jsx_runtime_1.jsx)("div", { className: TimeLine_styles_1.jsStyles.lineUp(theme) }), children] }));
};
TimeLine.BranchNode = function TimeLineBranchNode({ children }) {
const branches = (0, react_1.useRef)(null);
const line = (0, react_1.useRef)(null);
const theme = (0, react_1.useContext)(react_ui_1.ThemeContext);
(0, react_1.useEffect)(() => {
if (branches.current != null) {
const children = branches.current.children;
const lastEntry = children[children.length - 1];
const lastEntryWidth = lastEntry.clientWidth;
const currentLine = line.current;
if (!isNaN(lastEntryWidth) && currentLine != null) {
currentLine.style.marginRight = (lastEntryWidth - 7).toString() + "px";
}
}
});
return ((0, jsx_runtime_1.jsxs)("div", { className: TimeLine_styles_1.jsStyles.branchNode(), children: [(0, jsx_runtime_1.jsx)("div", { className: TimeLine_styles_1.jsStyles.horLine(theme), ref: line }), (0, jsx_runtime_1.jsx)("div", { className: TimeLine_styles_1.jsStyles.branchNodes(), ref: branches, children: children })] }));
};
TimeLine.Entry = function TimeLineEntry({ children, icon }) {
const theme = (0, react_1.useContext)(react_ui_1.ThemeContext);
return ((0, jsx_runtime_1.jsxs)("div", { className: `__root-entry ${TimeLine_styles_1.jsStyles.entry()}`, children: [(0, jsx_runtime_1.jsxs)("div", { className: TimeLine_styles_1.jsStyles.icon(), children: [icon, (0, jsx_runtime_1.jsx)("div", { className: `__root-entry-line ${TimeLine_styles_1.jsStyles.line(theme)}` })] }), (0, jsx_runtime_1.jsx)("div", { className: `__root-entry-content ${TimeLine_styles_1.jsStyles.content()}`, children: children })] }));
};
TimeLine.Cycled = TimeLineCycled_1.TimeLineCycled;
//# sourceMappingURL=TimeLine.js.map