@eccenca/gui-elements
Version:
GUI elements based on other libraries, usable in React application, written in Typescript.
60 lines • 3.46 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
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;
};
import React from "react";
import Color from "color";
import { CLASSPREFIX as eccgui } from "../../configuration/constants.js";
import { ProgressBar } from "./../../components/ProgressBar/index.js";
import { Tag } from "./../../components/Tag/index.js";
var toPercent = function (n) {
var formatted = (n * 100).toFixed(2);
var maybeRemovedFraction = formatted.replace(/(\.0+$)|(0+$)/, "");
return "".concat(maybeRemovedFraction, "%");
};
export function ConfidenceValue(_a) {
var className = _a.className, value = _a.value, _b = _a.minValue, minValue = _b === void 0 ? -1 : _b, _c = _a.maxValue, maxValue = _c === void 0 ? 1 : _c, _d = _a.centerValue, centerValue = _d === void 0 ? 0 : _d, barColor = _a.barColor, _e = _a.barStart, barStart = _e === void 0 ? "side" : _e, _f = _a.spaceUsage, spaceUsage = _f === void 0 ? "static" : _f, tagProps = _a.tagProps, progressBarProps = _a.progressBarProps, otherProps = __rest(_a, ["className", "value", "minValue", "maxValue", "centerValue", "barColor", "barStart", "spaceUsage", "tagProps", "progressBarProps"]);
var barValue = value === centerValue
? 0
: value < centerValue
? value / (minValue - centerValue)
: value / (maxValue - centerValue);
var color = Color("#000000");
if (barColor) {
try {
color = Color(barColor);
}
catch (ex) {
console.warn("Received invalid color for confidence bar: " + barColor);
}
}
return (React.createElement("span", __assign({ className: "".concat(eccgui, "-confidencevalue") +
" ".concat(eccgui, "-confidencevalue--").concat(barStart) +
" ".concat(eccgui, "-confidencevalue--").concat(spaceUsage, "space") +
(value < centerValue
? " ".concat(eccgui, "-confidencevalue--negative")
: " ".concat(eccgui, "-confidencevalue--positive")) +
(className ? " ".concat(className) : "") }, otherProps),
React.createElement(Tag, __assign({ className: "".concat(eccgui, "-confidencevalue__value") }, tagProps), toPercent(value)),
React.createElement("div", { className: "".concat(eccgui, "-confidencevalue__bar-colorwrapper"), style: barColor ? { color: color.rgb().toString() } : {} },
React.createElement(ProgressBar, __assign({ className: "".concat(eccgui, "-confidencevalue__bar"), value: barValue, intent: barColor ? undefined : value < centerValue ? "danger" : "success", stripes: false, animate: false }, progressBarProps)))));
}
//# sourceMappingURL=ConfidenceValue.js.map