@railzai/railz-visualizations
Version:
Railz.ai Visualizations
760 lines (709 loc) • 33.2 kB
JavaScript
/*!
* Accounting Data as a Service™ is the solution that makes sense of your business customers' financial data.
* Built with Stencil
* Copyright (c) FIS.
*/
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
import { z as toString, j as format, l as parseISO, m as RAILZ_DATE_FORMAT, p as pick, R as RequestServiceInstance, e as errorLog, g as getConfiguration, C as ConfigurationInstance, a as getFilter, b as getOptions, v as validateRequiredParams, A as isFinancialRatios, B as roundNumber, c as getTitleByReportType } from './chart.utils.js';
import { T as Translations } from './en.js';
import { i as RVParams, g as RVReportTypesUrlMapping, F as FinancialRatio } from './financial-ratios.js';
import { d as defineCustomElement$6 } from './error-image.js';
import { d as defineCustomElement$5 } from './loading.js';
import { d as defineCustomElement$4 } from './percentage.js';
import { d as defineCustomElement$3 } from './select.js';
import { d as defineCustomElement$2 } from './sparkline-chart.js';
import { d as defineCustomElement$1 } from './tooltip.js';
import { i as isEmpty } from './isEmpty.js';
import { i as isEqual } from './isEqual.js';
/**
* The base implementation of `_.slice` without an iteratee call guard.
*
* @private
* @param {Array} array The array to slice.
* @param {number} [start=0] The start position.
* @param {number} [end=array.length] The end position.
* @returns {Array} Returns the slice of `array`.
*/
function baseSlice(array, start, end) {
var index = -1,
length = array.length;
if (start < 0) {
start = -start > length ? 0 : (length + start);
}
end = end > length ? length : end;
if (end < 0) {
end += length;
}
length = start > end ? 0 : ((end - start) >>> 0);
start >>>= 0;
var result = Array(length);
while (++index < length) {
result[index] = array[index + start];
}
return result;
}
/**
* Casts `array` to a slice if it's needed.
*
* @private
* @param {Array} array The array to inspect.
* @param {number} start The start position.
* @param {number} [end=array.length] The end position.
* @returns {Array} Returns the cast slice.
*/
function castSlice(array, start, end) {
var length = array.length;
end = end === undefined ? length : end;
return (!start && end >= length) ? array : baseSlice(array, start, end);
}
/** Used to compose unicode character classes. */
var rsAstralRange$2 = '\\ud800-\\udfff',
rsComboMarksRange$3 = '\\u0300-\\u036f',
reComboHalfMarksRange$3 = '\\ufe20-\\ufe2f',
rsComboSymbolsRange$3 = '\\u20d0-\\u20ff',
rsComboRange$3 = rsComboMarksRange$3 + reComboHalfMarksRange$3 + rsComboSymbolsRange$3,
rsVarRange$2 = '\\ufe0e\\ufe0f';
/** Used to compose unicode capture groups. */
var rsZWJ$2 = '\\u200d';
/** Used to detect strings with [zero-width joiners or code points from the astral planes](http://eev.ee/blog/2015/09/12/dark-corners-of-unicode/). */
var reHasUnicode = RegExp('[' + rsZWJ$2 + rsAstralRange$2 + rsComboRange$3 + rsVarRange$2 + ']');
/**
* Checks if `string` contains Unicode symbols.
*
* @private
* @param {string} string The string to inspect.
* @returns {boolean} Returns `true` if a symbol is found, else `false`.
*/
function hasUnicode(string) {
return reHasUnicode.test(string);
}
/**
* Converts an ASCII `string` to an array.
*
* @private
* @param {string} string The string to convert.
* @returns {Array} Returns the converted array.
*/
function asciiToArray(string) {
return string.split('');
}
/** Used to compose unicode character classes. */
var rsAstralRange$1 = '\\ud800-\\udfff',
rsComboMarksRange$2 = '\\u0300-\\u036f',
reComboHalfMarksRange$2 = '\\ufe20-\\ufe2f',
rsComboSymbolsRange$2 = '\\u20d0-\\u20ff',
rsComboRange$2 = rsComboMarksRange$2 + reComboHalfMarksRange$2 + rsComboSymbolsRange$2,
rsVarRange$1 = '\\ufe0e\\ufe0f';
/** Used to compose unicode capture groups. */
var rsAstral = '[' + rsAstralRange$1 + ']',
rsCombo$2 = '[' + rsComboRange$2 + ']',
rsFitz$1 = '\\ud83c[\\udffb-\\udfff]',
rsModifier$1 = '(?:' + rsCombo$2 + '|' + rsFitz$1 + ')',
rsNonAstral$1 = '[^' + rsAstralRange$1 + ']',
rsRegional$1 = '(?:\\ud83c[\\udde6-\\uddff]){2}',
rsSurrPair$1 = '[\\ud800-\\udbff][\\udc00-\\udfff]',
rsZWJ$1 = '\\u200d';
/** Used to compose unicode regexes. */
var reOptMod$1 = rsModifier$1 + '?',
rsOptVar$1 = '[' + rsVarRange$1 + ']?',
rsOptJoin$1 = '(?:' + rsZWJ$1 + '(?:' + [rsNonAstral$1, rsRegional$1, rsSurrPair$1].join('|') + ')' + rsOptVar$1 + reOptMod$1 + ')*',
rsSeq$1 = rsOptVar$1 + reOptMod$1 + rsOptJoin$1,
rsSymbol = '(?:' + [rsNonAstral$1 + rsCombo$2 + '?', rsCombo$2, rsRegional$1, rsSurrPair$1, rsAstral].join('|') + ')';
/** Used to match [string symbols](https://mathiasbynens.be/notes/javascript-unicode). */
var reUnicode = RegExp(rsFitz$1 + '(?=' + rsFitz$1 + ')|' + rsSymbol + rsSeq$1, 'g');
/**
* Converts a Unicode `string` to an array.
*
* @private
* @param {string} string The string to convert.
* @returns {Array} Returns the converted array.
*/
function unicodeToArray(string) {
return string.match(reUnicode) || [];
}
/**
* Converts `string` to an array.
*
* @private
* @param {string} string The string to convert.
* @returns {Array} Returns the converted array.
*/
function stringToArray(string) {
return hasUnicode(string)
? unicodeToArray(string)
: asciiToArray(string);
}
/**
* Creates a function like `_.lowerFirst`.
*
* @private
* @param {string} methodName The name of the `String` case method to use.
* @returns {Function} Returns the new case function.
*/
function createCaseFirst(methodName) {
return function(string) {
string = toString(string);
var strSymbols = hasUnicode(string)
? stringToArray(string)
: undefined;
var chr = strSymbols
? strSymbols[0]
: string.charAt(0);
var trailing = strSymbols
? castSlice(strSymbols, 1).join('')
: string.slice(1);
return chr[methodName]() + trailing;
};
}
/**
* Converts the first character of `string` to upper case.
*
* @static
* @memberOf _
* @since 4.0.0
* @category String
* @param {string} [string=''] The string to convert.
* @returns {string} Returns the converted string.
* @example
*
* _.upperFirst('fred');
* // => 'Fred'
*
* _.upperFirst('FRED');
* // => 'FRED'
*/
var upperFirst = createCaseFirst('toUpperCase');
/**
* A specialized version of `_.reduce` for arrays without support for
* iteratee shorthands.
*
* @private
* @param {Array} [array] The array to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @param {*} [accumulator] The initial value.
* @param {boolean} [initAccum] Specify using the first element of `array` as
* the initial value.
* @returns {*} Returns the accumulated value.
*/
function arrayReduce(array, iteratee, accumulator, initAccum) {
var index = -1,
length = array == null ? 0 : array.length;
if (initAccum && length) {
accumulator = array[++index];
}
while (++index < length) {
accumulator = iteratee(accumulator, array[index], index, array);
}
return accumulator;
}
/**
* The base implementation of `_.propertyOf` without support for deep paths.
*
* @private
* @param {Object} object The object to query.
* @returns {Function} Returns the new accessor function.
*/
function basePropertyOf(object) {
return function(key) {
return object == null ? undefined : object[key];
};
}
/** Used to map Latin Unicode letters to basic Latin letters. */
var deburredLetters = {
// Latin-1 Supplement block.
'\xc0': 'A', '\xc1': 'A', '\xc2': 'A', '\xc3': 'A', '\xc4': 'A', '\xc5': 'A',
'\xe0': 'a', '\xe1': 'a', '\xe2': 'a', '\xe3': 'a', '\xe4': 'a', '\xe5': 'a',
'\xc7': 'C', '\xe7': 'c',
'\xd0': 'D', '\xf0': 'd',
'\xc8': 'E', '\xc9': 'E', '\xca': 'E', '\xcb': 'E',
'\xe8': 'e', '\xe9': 'e', '\xea': 'e', '\xeb': 'e',
'\xcc': 'I', '\xcd': 'I', '\xce': 'I', '\xcf': 'I',
'\xec': 'i', '\xed': 'i', '\xee': 'i', '\xef': 'i',
'\xd1': 'N', '\xf1': 'n',
'\xd2': 'O', '\xd3': 'O', '\xd4': 'O', '\xd5': 'O', '\xd6': 'O', '\xd8': 'O',
'\xf2': 'o', '\xf3': 'o', '\xf4': 'o', '\xf5': 'o', '\xf6': 'o', '\xf8': 'o',
'\xd9': 'U', '\xda': 'U', '\xdb': 'U', '\xdc': 'U',
'\xf9': 'u', '\xfa': 'u', '\xfb': 'u', '\xfc': 'u',
'\xdd': 'Y', '\xfd': 'y', '\xff': 'y',
'\xc6': 'Ae', '\xe6': 'ae',
'\xde': 'Th', '\xfe': 'th',
'\xdf': 'ss',
// Latin Extended-A block.
'\u0100': 'A', '\u0102': 'A', '\u0104': 'A',
'\u0101': 'a', '\u0103': 'a', '\u0105': 'a',
'\u0106': 'C', '\u0108': 'C', '\u010a': 'C', '\u010c': 'C',
'\u0107': 'c', '\u0109': 'c', '\u010b': 'c', '\u010d': 'c',
'\u010e': 'D', '\u0110': 'D', '\u010f': 'd', '\u0111': 'd',
'\u0112': 'E', '\u0114': 'E', '\u0116': 'E', '\u0118': 'E', '\u011a': 'E',
'\u0113': 'e', '\u0115': 'e', '\u0117': 'e', '\u0119': 'e', '\u011b': 'e',
'\u011c': 'G', '\u011e': 'G', '\u0120': 'G', '\u0122': 'G',
'\u011d': 'g', '\u011f': 'g', '\u0121': 'g', '\u0123': 'g',
'\u0124': 'H', '\u0126': 'H', '\u0125': 'h', '\u0127': 'h',
'\u0128': 'I', '\u012a': 'I', '\u012c': 'I', '\u012e': 'I', '\u0130': 'I',
'\u0129': 'i', '\u012b': 'i', '\u012d': 'i', '\u012f': 'i', '\u0131': 'i',
'\u0134': 'J', '\u0135': 'j',
'\u0136': 'K', '\u0137': 'k', '\u0138': 'k',
'\u0139': 'L', '\u013b': 'L', '\u013d': 'L', '\u013f': 'L', '\u0141': 'L',
'\u013a': 'l', '\u013c': 'l', '\u013e': 'l', '\u0140': 'l', '\u0142': 'l',
'\u0143': 'N', '\u0145': 'N', '\u0147': 'N', '\u014a': 'N',
'\u0144': 'n', '\u0146': 'n', '\u0148': 'n', '\u014b': 'n',
'\u014c': 'O', '\u014e': 'O', '\u0150': 'O',
'\u014d': 'o', '\u014f': 'o', '\u0151': 'o',
'\u0154': 'R', '\u0156': 'R', '\u0158': 'R',
'\u0155': 'r', '\u0157': 'r', '\u0159': 'r',
'\u015a': 'S', '\u015c': 'S', '\u015e': 'S', '\u0160': 'S',
'\u015b': 's', '\u015d': 's', '\u015f': 's', '\u0161': 's',
'\u0162': 'T', '\u0164': 'T', '\u0166': 'T',
'\u0163': 't', '\u0165': 't', '\u0167': 't',
'\u0168': 'U', '\u016a': 'U', '\u016c': 'U', '\u016e': 'U', '\u0170': 'U', '\u0172': 'U',
'\u0169': 'u', '\u016b': 'u', '\u016d': 'u', '\u016f': 'u', '\u0171': 'u', '\u0173': 'u',
'\u0174': 'W', '\u0175': 'w',
'\u0176': 'Y', '\u0177': 'y', '\u0178': 'Y',
'\u0179': 'Z', '\u017b': 'Z', '\u017d': 'Z',
'\u017a': 'z', '\u017c': 'z', '\u017e': 'z',
'\u0132': 'IJ', '\u0133': 'ij',
'\u0152': 'Oe', '\u0153': 'oe',
'\u0149': "'n", '\u017f': 's'
};
/**
* Used by `_.deburr` to convert Latin-1 Supplement and Latin Extended-A
* letters to basic Latin letters.
*
* @private
* @param {string} letter The matched letter to deburr.
* @returns {string} Returns the deburred letter.
*/
var deburrLetter = basePropertyOf(deburredLetters);
/** Used to match Latin Unicode letters (excluding mathematical operators). */
var reLatin = /[\xc0-\xd6\xd8-\xf6\xf8-\xff\u0100-\u017f]/g;
/** Used to compose unicode character classes. */
var rsComboMarksRange$1 = '\\u0300-\\u036f',
reComboHalfMarksRange$1 = '\\ufe20-\\ufe2f',
rsComboSymbolsRange$1 = '\\u20d0-\\u20ff',
rsComboRange$1 = rsComboMarksRange$1 + reComboHalfMarksRange$1 + rsComboSymbolsRange$1;
/** Used to compose unicode capture groups. */
var rsCombo$1 = '[' + rsComboRange$1 + ']';
/**
* Used to match [combining diacritical marks](https://en.wikipedia.org/wiki/Combining_Diacritical_Marks) and
* [combining diacritical marks for symbols](https://en.wikipedia.org/wiki/Combining_Diacritical_Marks_for_Symbols).
*/
var reComboMark = RegExp(rsCombo$1, 'g');
/**
* Deburrs `string` by converting
* [Latin-1 Supplement](https://en.wikipedia.org/wiki/Latin-1_Supplement_(Unicode_block)#Character_table)
* and [Latin Extended-A](https://en.wikipedia.org/wiki/Latin_Extended-A)
* letters to basic Latin letters and removing
* [combining diacritical marks](https://en.wikipedia.org/wiki/Combining_Diacritical_Marks).
*
* @static
* @memberOf _
* @since 3.0.0
* @category String
* @param {string} [string=''] The string to deburr.
* @returns {string} Returns the deburred string.
* @example
*
* _.deburr('déjà vu');
* // => 'deja vu'
*/
function deburr(string) {
string = toString(string);
return string && string.replace(reLatin, deburrLetter).replace(reComboMark, '');
}
/** Used to match words composed of alphanumeric characters. */
var reAsciiWord = /[^\x00-\x2f\x3a-\x40\x5b-\x60\x7b-\x7f]+/g;
/**
* Splits an ASCII `string` into an array of its words.
*
* @private
* @param {string} The string to inspect.
* @returns {Array} Returns the words of `string`.
*/
function asciiWords(string) {
return string.match(reAsciiWord) || [];
}
/** Used to detect strings that need a more robust regexp to match words. */
var reHasUnicodeWord = /[a-z][A-Z]|[A-Z]{2}[a-z]|[0-9][a-zA-Z]|[a-zA-Z][0-9]|[^a-zA-Z0-9 ]/;
/**
* Checks if `string` contains a word composed of Unicode symbols.
*
* @private
* @param {string} string The string to inspect.
* @returns {boolean} Returns `true` if a word is found, else `false`.
*/
function hasUnicodeWord(string) {
return reHasUnicodeWord.test(string);
}
/** Used to compose unicode character classes. */
var rsAstralRange = '\\ud800-\\udfff',
rsComboMarksRange = '\\u0300-\\u036f',
reComboHalfMarksRange = '\\ufe20-\\ufe2f',
rsComboSymbolsRange = '\\u20d0-\\u20ff',
rsComboRange = rsComboMarksRange + reComboHalfMarksRange + rsComboSymbolsRange,
rsDingbatRange = '\\u2700-\\u27bf',
rsLowerRange = 'a-z\\xdf-\\xf6\\xf8-\\xff',
rsMathOpRange = '\\xac\\xb1\\xd7\\xf7',
rsNonCharRange = '\\x00-\\x2f\\x3a-\\x40\\x5b-\\x60\\x7b-\\xbf',
rsPunctuationRange = '\\u2000-\\u206f',
rsSpaceRange = ' \\t\\x0b\\f\\xa0\\ufeff\\n\\r\\u2028\\u2029\\u1680\\u180e\\u2000\\u2001\\u2002\\u2003\\u2004\\u2005\\u2006\\u2007\\u2008\\u2009\\u200a\\u202f\\u205f\\u3000',
rsUpperRange = 'A-Z\\xc0-\\xd6\\xd8-\\xde',
rsVarRange = '\\ufe0e\\ufe0f',
rsBreakRange = rsMathOpRange + rsNonCharRange + rsPunctuationRange + rsSpaceRange;
/** Used to compose unicode capture groups. */
var rsApos$1 = "['\u2019]",
rsBreak = '[' + rsBreakRange + ']',
rsCombo = '[' + rsComboRange + ']',
rsDigits = '\\d+',
rsDingbat = '[' + rsDingbatRange + ']',
rsLower = '[' + rsLowerRange + ']',
rsMisc = '[^' + rsAstralRange + rsBreakRange + rsDigits + rsDingbatRange + rsLowerRange + rsUpperRange + ']',
rsFitz = '\\ud83c[\\udffb-\\udfff]',
rsModifier = '(?:' + rsCombo + '|' + rsFitz + ')',
rsNonAstral = '[^' + rsAstralRange + ']',
rsRegional = '(?:\\ud83c[\\udde6-\\uddff]){2}',
rsSurrPair = '[\\ud800-\\udbff][\\udc00-\\udfff]',
rsUpper = '[' + rsUpperRange + ']',
rsZWJ = '\\u200d';
/** Used to compose unicode regexes. */
var rsMiscLower = '(?:' + rsLower + '|' + rsMisc + ')',
rsMiscUpper = '(?:' + rsUpper + '|' + rsMisc + ')',
rsOptContrLower = '(?:' + rsApos$1 + '(?:d|ll|m|re|s|t|ve))?',
rsOptContrUpper = '(?:' + rsApos$1 + '(?:D|LL|M|RE|S|T|VE))?',
reOptMod = rsModifier + '?',
rsOptVar = '[' + rsVarRange + ']?',
rsOptJoin = '(?:' + rsZWJ + '(?:' + [rsNonAstral, rsRegional, rsSurrPair].join('|') + ')' + rsOptVar + reOptMod + ')*',
rsOrdLower = '\\d*(?:1st|2nd|3rd|(?![123])\\dth)(?=\\b|[A-Z_])',
rsOrdUpper = '\\d*(?:1ST|2ND|3RD|(?![123])\\dTH)(?=\\b|[a-z_])',
rsSeq = rsOptVar + reOptMod + rsOptJoin,
rsEmoji = '(?:' + [rsDingbat, rsRegional, rsSurrPair].join('|') + ')' + rsSeq;
/** Used to match complex or compound words. */
var reUnicodeWord = RegExp([
rsUpper + '?' + rsLower + '+' + rsOptContrLower + '(?=' + [rsBreak, rsUpper, '$'].join('|') + ')',
rsMiscUpper + '+' + rsOptContrUpper + '(?=' + [rsBreak, rsUpper + rsMiscLower, '$'].join('|') + ')',
rsUpper + '?' + rsMiscLower + '+' + rsOptContrLower,
rsUpper + '+' + rsOptContrUpper,
rsOrdUpper,
rsOrdLower,
rsDigits,
rsEmoji
].join('|'), 'g');
/**
* Splits a Unicode `string` into an array of its words.
*
* @private
* @param {string} The string to inspect.
* @returns {Array} Returns the words of `string`.
*/
function unicodeWords(string) {
return string.match(reUnicodeWord) || [];
}
/**
* Splits `string` into an array of its words.
*
* @static
* @memberOf _
* @since 3.0.0
* @category String
* @param {string} [string=''] The string to inspect.
* @param {RegExp|string} [pattern] The pattern to match words.
* @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
* @returns {Array} Returns the words of `string`.
* @example
*
* _.words('fred, barney, & pebbles');
* // => ['fred', 'barney', 'pebbles']
*
* _.words('fred, barney, & pebbles', /[^, ]+/g);
* // => ['fred', 'barney', '&', 'pebbles']
*/
function words(string, pattern, guard) {
string = toString(string);
pattern = guard ? undefined : pattern;
if (pattern === undefined) {
return hasUnicodeWord(string) ? unicodeWords(string) : asciiWords(string);
}
return string.match(pattern) || [];
}
/** Used to compose unicode capture groups. */
var rsApos = "['\u2019]";
/** Used to match apostrophes. */
var reApos = RegExp(rsApos, 'g');
/**
* Creates a function like `_.camelCase`.
*
* @private
* @param {Function} callback The function to combine each word.
* @returns {Function} Returns the new compounder function.
*/
function createCompounder(callback) {
return function(string) {
return arrayReduce(words(deburr(string).replace(reApos, '')), callback, '');
};
}
/**
* Converts `string` to
* [start case](https://en.wikipedia.org/wiki/Letter_case#Stylistic_or_specialised_usage).
*
* @static
* @memberOf _
* @since 3.1.0
* @category String
* @param {string} [string=''] The string to convert.
* @returns {string} Returns the start cased string.
* @example
*
* _.startCase('--foo-bar--');
* // => 'Foo Bar'
*
* _.startCase('fooBar');
* // => 'Foo Bar'
*
* _.startCase('__FOO_BAR__');
* // => 'FOO BAR'
*/
var startCase = createCompounder(function(result, word, index) {
return result + (index ? ' ' : '') + upperFirst(word);
});
/**
* Make API call based on expected parameters for financial ratio data type
*/
const getReportData = async ({ filter, }) => {
let reportData;
try {
const startDate = format(parseISO(filter.startDate), RAILZ_DATE_FORMAT);
const endDate = format(parseISO(filter.endDate), RAILZ_DATE_FORMAT);
const allParameters = pick(Object.assign(Object.assign({}, filter), { startDate,
endDate }), [RVParams.START_DATE, RVParams.END_DATE, RVParams.REPORT_FREQUENCY, RVParams.CONNECTION_UUID]);
reportData = await RequestServiceInstance.getReportData({
path: RVReportTypesUrlMapping[filter.reportType],
filter: allParameters,
});
}
catch (error) {
errorLog(Translations.RV_NOT_ABLE_TO_RETRIEVE_REPORT_DATA, error);
reportData = { error };
}
return reportData;
};
const financialRatiosCss = "@font-face{font-family:Inter;src:url(\"../assets/fonts/Inter-italic-var.woff2\");font-family:Inter;src:url(\"../assets/fonts/Inter-upright-var.woff2\")}body,div[class^=railz-],div[class*=\" railz-\"]{font-family:Inter, Roboto, -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.rv-container{display:flex;padding:16px;position:relative;border:1px solid #eee;border-radius:7px;flex-direction:column;width:auto;height:360px}.rv-container *{font-family:Inter, Roboto, -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.rv-header-container{display:flex}.rv-title{display:flex;color:#015b7e;font-size:18px;font-weight:600;margin:0;padding:0;text-align:left;flex-grow:1;line-height:1.235}.rv-financial-ratios{overflow-y:auto;overflow-x:hidden;padding-top:8px;height:100%}.rv-financial-ratio-container-item{display:flex;flex-grow:1;padding-top:8px;border-bottom:thin solid #e0e0e0;padding-bottom:8px;justify-content:space-between;overflow:visible}.rv-financial-ratio-container-item:last-child{border-bottom:none}.rv-financial-ratio-info{display:flex;flex-direction:column}.rv-financial-ratio-info .rv-ratio-name{display:flex;line-height:1.5;color:#424242;font-size:12px;font-weight:600}.rv-financial-ratio-info .rv-ratio-name .rv-ratio-name-text{padding-left:4px}.rv-financial-ratio-info .rv-ratio-values{display:flex;flex-grow:1;align-items:center}.rv-financial-ratio-info .rv-ratio-values .rv-ratio-summary{line-height:1.5;font-size:20px;max-width:70%;font-weight:700;margin-right:8px}.rv-select{border:0;font-size:14px}";
const FinancialRatios = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
constructor() {
super();
this.__registerHost();
this.__attachShadow();
this.loading = '';
/**
* Validates if configuration was passed correctly before setting filter
* @param configuration - Config for authentication
* @param filter - filter to decide chart type to show
* @param options: Whitelabeling options
* @param triggerRequest - indicate if api request should be made
*/
this.validateParams = async (configuration, filter, options, triggerRequest = true) => {
this._configuration = getConfiguration(configuration);
if (this._configuration) {
ConfigurationInstance.configuration = this._configuration;
try {
this._filter = getFilter(filter);
this._options = getOptions(options);
if (validateRequiredParams(this._filter)) {
if (isFinancialRatios(this._filter.reportType)) {
if (triggerRequest) {
await this.requestReportData();
}
}
else {
this.errorStatusCode = 500;
errorLog(Translations.RV_ERROR_INVALID_REPORT_TYPE);
}
}
else {
this.errorStatusCode = 204;
}
}
catch (e) {
this.errorStatusCode = 500;
errorLog(e);
}
}
else {
this.errorStatusCode = 0;
}
};
this.propsUpdated = async (triggerRequest = true) => {
await this.validateParams(this.configuration, this.filter, this.options, triggerRequest);
};
this.handleSelected = (selectedIndex) => {
const summaryKeys = Object.keys(this._summary);
const selectedKey = summaryKeys[selectedIndex];
this._selected = this._summary[selectedKey];
};
/**
* Request report data based on filter and configuration param
*/
this.requestReportData = async () => {
var _a, _b;
this.errorStatusCode = undefined;
this.loading = Translations.RV_LOADING_REPORT;
try {
const reportData = (await getReportData({
filter: this._filter,
}));
if (reportData === null || reportData === void 0 ? void 0 : reportData.data) {
this._summary = reportData === null || reportData === void 0 ? void 0 : reportData.data;
if (!isEmpty(this._summary)) {
this.handleSelected(0);
}
else {
this.errorStatusCode = (_a = reportData.error) === null || _a === void 0 ? void 0 : _a.statusCode;
}
}
else if (reportData === null || reportData === void 0 ? void 0 : reportData.error) {
this.errorStatusCode = (_b = reportData.error) === null || _b === void 0 ? void 0 : _b.statusCode;
}
else {
this.errorStatusCode = reportData === null || reportData === void 0 ? void 0 : reportData.status;
}
}
catch (error) {
errorLog(Translations.RV_NOT_ABLE_TO_PARSE_REPORT_DATA, error);
}
finally {
this.loading = '';
}
};
this.renderMain = () => {
var _a, _b, _c;
if (this.errorStatusCode !== undefined) {
return (h("railz-error-image", Object.assign({ statusCode: this.errorStatusCode || 500 }, (_a = this._options) === null || _a === void 0 ? void 0 : _a.errorIndicator)));
}
if (!isEmpty(this.loading)) {
return h("railz-loading", Object.assign({ loadingText: this.loading }, (_b = this._options) === null || _b === void 0 ? void 0 : _b.loadingIndicator));
}
const FinancialRatioItem = ({ key, ratioValue, }) => {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
const translation = (key, tooltip = false) => {
var _a, _b, _c, _d, _e, _f;
const financialRatioKey = Object.keys(FinancialRatio).find((ratio) => FinancialRatio[ratio] === key);
const financialRatio = FinancialRatio[financialRatioKey];
const contentTranslation = (_c = (_b = (_a = this._options) === null || _a === void 0 ? void 0 : _a.content) === null || _b === void 0 ? void 0 : _b.label) === null || _c === void 0 ? void 0 : _c[financialRatio];
const contentTooltipTranslation = (_f = (_e = (_d = this._options) === null || _d === void 0 ? void 0 : _d.content) === null || _e === void 0 ? void 0 : _e.tooltip) === null || _f === void 0 ? void 0 : _f[financialRatio];
if (tooltip) {
if (contentTooltipTranslation)
return contentTooltipTranslation;
return Translations['RV_FINANCIAL_RATIO_TOOLTIP_' + financialRatioKey];
}
if (contentTranslation)
return contentTranslation;
return Translations['RV_FINANCIAL_RATIO_' + financialRatioKey] || startCase(key);
};
const item = this._selected[key];
const tooltipText = translation(key, true);
return (h("div", { class: "rv-financial-ratio-container-item", style: (_b = (_a = this._options) === null || _a === void 0 ? void 0 : _a.ratio) === null || _b === void 0 ? void 0 : _b.itemContainer }, h("div", { class: "rv-financial-ratio-info", style: (_d = (_c = this._options) === null || _c === void 0 ? void 0 : _c.ratio) === null || _d === void 0 ? void 0 : _d.itemInfo }, h("div", { class: "rv-ratio-name", style: (_f = (_e = this._options) === null || _e === void 0 ? void 0 : _e.ratio) === null || _f === void 0 ? void 0 : _f.itemName }, !isEmpty(tooltipText) &&
(((_j = (_h = (_g = this._options) === null || _g === void 0 ? void 0 : _g.ratio) === null || _h === void 0 ? void 0 : _h.itemToolTip) === null || _j === void 0 ? void 0 : _j.visible) === false ? ('') : (h("railz-tooltip", { tooltipText: tooltipText, tooltipStyle: Object.assign({ position: 'bottom-right' }, (_l = (_k = this._options) === null || _k === void 0 ? void 0 : _k.ratio) === null || _l === void 0 ? void 0 : _l.itemToolTip) }))), h("div", { class: "rv-ratio-name-text", style: (_o = (_m = this._options) === null || _m === void 0 ? void 0 : _m.ratio) === null || _o === void 0 ? void 0 : _o.itemNameText }, translation(key))), h("div", { class: "rv-ratio-values", style: (_q = (_p = this._options) === null || _p === void 0 ? void 0 : _p.ratio) === null || _q === void 0 ? void 0 : _q.itemSummary }, h("div", { class: "rv-ratio-summary", style: (_s = (_r = this._options) === null || _r === void 0 ? void 0 : _r.ratio) === null || _s === void 0 ? void 0 : _s.itemValue }, roundNumber(item.currentValue)), h("div", { class: "rv-ratio-percentage" }, h("railz-percentage", { percentage: item.percentageChange, percentageStyle: (_u = (_t = this._options) === null || _t === void 0 ? void 0 : _t.ratio) === null || _u === void 0 ? void 0 : _u.itemPercentage })))), h("railz-sparkline-chart", { data: item.timePeriodData, sparkLineStyle: (_w = (_v = this._options) === null || _v === void 0 ? void 0 : _v.ratio) === null || _w === void 0 ? void 0 : _w.sparkLine })));
};
return (this._selected && (h("div", { class: "rv-financial-ratios" }, (_c = Object.entries(this._selected)) === null || _c === void 0 ? void 0 : _c.map(([key, value]) => (h(FinancialRatioItem, { key: key, ratioValue: value }))))));
};
}
async watchConfiguration(newValue, oldValue) {
if (newValue && oldValue && !isEqual(oldValue, newValue)) {
await this.validateParams(newValue, this.filter, this.options);
}
}
async watchFilter(newValue, oldValue) {
if (newValue && oldValue && !isEqual(oldValue, newValue)) {
await this.validateParams(this.configuration, newValue, this.options);
}
}
async watchOptions(newValue, oldValue) {
if (newValue && oldValue && !isEqual(oldValue, newValue)) {
await this.validateParams(this.configuration, this.filter, newValue);
}
}
componentWillLoad() {
this.propsUpdated && this.propsUpdated();
}
render() {
var _a, _b, _c, _d, _e, _f;
if (this.errorStatusCode === 0) {
return null;
}
const TitleElement = () => {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
return (h("p", { class: "rv-title", style: (_b = (_a = this._options) === null || _a === void 0 ? void 0 : _a.title) === null || _b === void 0 ? void 0 : _b.style }, ((_d = (_c = this._options) === null || _c === void 0 ? void 0 : _c.content) === null || _d === void 0 ? void 0 : _d.title) || getTitleByReportType((_e = this._filter) === null || _e === void 0 ? void 0 : _e.reportType) || '', ' ', ((_g = (_f = this._options) === null || _f === void 0 ? void 0 : _f.tooltipIndicator) === null || _g === void 0 ? void 0 : _g.visible) &&
((_k = (_j = (_h = this._options) === null || _h === void 0 ? void 0 : _h.content) === null || _j === void 0 ? void 0 : _j.tooltip) === null || _k === void 0 ? void 0 : _k.description) ? (h("railz-tooltip", { tooltipStyle: Object.assign(Object.assign({ position: 'bottom-center' }, (_l = this._options) === null || _l === void 0 ? void 0 : _l.tooltipIndicator), { style: Object.assign({ marginLeft: '5px' }, (_o = (_m = this._options) === null || _m === void 0 ? void 0 : _m.tooltipIndicator) === null || _o === void 0 ? void 0 : _o.style) }), tooltipText: (_r = (_q = (_p = this._options) === null || _p === void 0 ? void 0 : _p.content) === null || _q === void 0 ? void 0 : _q.tooltip) === null || _r === void 0 ? void 0 : _r.description })) : null));
};
const SelectElement = () => {
var _a, _b;
const items = Object.keys(this._summary).map((item) => Translations[`RV_FINANCIAL_RATIO_TYPE_${item.toUpperCase()}`]);
return (h("railz-select", { items: items,
//reset the component per loading
key: this.loading, selectStyle: (_b = (_a = this._options) === null || _a === void 0 ? void 0 : _a.ratio) === null || _b === void 0 ? void 0 : _b.select, onSelectedItem: (event) => {
this.handleSelected(event.detail);
} }));
};
return (h("div", { class: "rv-container", style: (_b = (_a = this._options) === null || _a === void 0 ? void 0 : _a.container) === null || _b === void 0 ? void 0 : _b.style }, h("div", { class: "rv-header-container", style: (_d = (_c = this._options) === null || _c === void 0 ? void 0 : _c.ratio) === null || _d === void 0 ? void 0 : _d.header }, ((_f = (_e = this._options) === null || _e === void 0 ? void 0 : _e.title) === null || _f === void 0 ? void 0 : _f.visible) === false ? '' : h(TitleElement, null), !isEmpty(this._summary) && h(SelectElement, null)), this.renderMain()));
}
static get watchers() { return {
"configuration": ["watchConfiguration"],
"filter": ["watchFilter"],
"options": ["watchOptions"]
}; }
static get style() { return financialRatiosCss; }
}, [1, "railz-financial-ratios", {
"configuration": [16],
"filter": [16],
"options": [16],
"loading": [32],
"_configuration": [32],
"_filter": [32],
"_options": [32],
"_summary": [32],
"_selected": [32],
"errorStatusCode": [32]
}]);
function defineCustomElement() {
if (typeof customElements === "undefined") {
return;
}
const components = ["railz-financial-ratios", "railz-error-image", "railz-loading", "railz-percentage", "railz-select", "railz-sparkline-chart", "railz-tooltip"];
components.forEach(tagName => { switch (tagName) {
case "railz-financial-ratios":
if (!customElements.get(tagName)) {
customElements.define(tagName, FinancialRatios);
}
break;
case "railz-error-image":
if (!customElements.get(tagName)) {
defineCustomElement$6();
}
break;
case "railz-loading":
if (!customElements.get(tagName)) {
defineCustomElement$5();
}
break;
case "railz-percentage":
if (!customElements.get(tagName)) {
defineCustomElement$4();
}
break;
case "railz-select":
if (!customElements.get(tagName)) {
defineCustomElement$3();
}
break;
case "railz-sparkline-chart":
if (!customElements.get(tagName)) {
defineCustomElement$2();
}
break;
case "railz-tooltip":
if (!customElements.get(tagName)) {
defineCustomElement$1();
}
break;
} });
}
export { FinancialRatios as F, defineCustomElement as d };
//# sourceMappingURL=financial-ratios2.js.map