@gooddata/react-components
Version:
GoodData.UI - A powerful JavaScript library for building analytical applications
87 lines • 3.24 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
// (C) 2007-2019 GoodData Corporation
var numberjs_1 = require("@gooddata/numberjs");
var isEmpty = require("lodash/isEmpty");
var isNaN = require("lodash/isNaN");
var DEFAULT_VALUE_WHEN_EMPTY = "–";
var INVALID_VALUE = "NaN";
var PERCENTAGE_VALUE_LIMIT = 999;
function processStringForNumberJs(value, format) {
return value === null && !isEmpty(format)
? "" // return empty string for null value for number.js to apply [=null] format
: parseFloat(value);
}
function formatValueToLabelWithColors(value, format, separators) {
var processedValue = processStringForNumberJs(value, format);
var formattedValue = numberjs_1.numberFormat(processedValue, format, undefined, separators);
return numberjs_1.colors2Object(formattedValue);
}
function buildCssStyle(color, backgroundColor) {
var style = {};
if (color !== undefined) {
style.color = color;
}
if (backgroundColor !== undefined) {
style.backgroundColor = backgroundColor;
}
return style;
}
/**
* Format {HeadlineData} value.
*
* The method processes the provided item and returns object with value that can be rendered as it is and 'cssStyle'
* object that can be passed into the react element 'style' attribute.
*
* @param item
* @returns {{cssStyle: {color, backgroundColor}, value: string, isValueEmpty: boolean}}
*/
function formatItemValue(item, config) {
if (config === void 0) { config = {}; }
var separators = config.separators;
var _a = formatValueToLabelWithColors(item.value, item.format, separators), label = _a.label, color = _a.color, backgroundColor = _a.backgroundColor;
var isValueEmpty = label === INVALID_VALUE || label === "";
var value = isValueEmpty ? DEFAULT_VALUE_WHEN_EMPTY : label;
return {
cssStyle: buildCssStyle(color, backgroundColor),
value: value,
isValueEmpty: isValueEmpty,
};
}
exports.formatItemValue = formatItemValue;
/**
* The method processes the provided IHeadlineDataItem and returns object with formatted value and isValueEmpty flag.
*
* Formatted value conditions:
* - value is rounded to Integer
* - shows '>999%' when value is above the limit
* - shows '<-999%' when value is below the limit
* - otherwise shows 'value%'
*
* @param item
* @returns {{value: string, isValueEmpty: boolean}}
*/
function formatPercentageValue(item) {
if (!item || item.value === null || isNaN(parseFloat(item.value))) {
return {
value: DEFAULT_VALUE_WHEN_EMPTY,
isValueEmpty: true,
};
}
var roundedNumber = Math.round(parseFloat(item.value));
var isOverLimit = roundedNumber > PERCENTAGE_VALUE_LIMIT;
var isUnderLimit = roundedNumber < -PERCENTAGE_VALUE_LIMIT;
var formattedValue = roundedNumber + "%";
if (isOverLimit) {
formattedValue = ">" + PERCENTAGE_VALUE_LIMIT + "%";
}
else if (isUnderLimit) {
formattedValue = "<-" + PERCENTAGE_VALUE_LIMIT + "%";
}
return {
value: formattedValue,
isValueEmpty: false,
};
}
exports.formatPercentageValue = formatPercentageValue;
//# sourceMappingURL=HeadlineDataItemUtils.js.map