@railzai/railz-visualizations
Version:
Railz.ai Visualizations
245 lines (239 loc) • 18.5 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 { h as highcharts, a as accessibility } from './accessibility.js';
import { c as createCommonjsModule } from './_commonjsHelpers.js';
import { T as Translations } from './en.js';
import { g as getConfiguration, C as ConfigurationInstance, a as getFilter, b as getOptions, v as validateRequiredParams, F as isStatements, e as errorLog, G as getReportData, H as formatData, I as getHighchartsParams, c as getTitleByReportType } from './chart.utils.js';
import { e as RVReportTypes } from './financial-ratios.js';
import { d as defineCustomElement$3 } from './error-image.js';
import { d as defineCustomElement$2 } from './loading.js';
import { d as defineCustomElement$1 } from './tooltip.js';
import { i as isEmpty } from './isEmpty.js';
import { i as isEqual } from './isEqual.js';
var indicators = createCommonjsModule(function (module) {
(function(a){module.exports?(a["default"]=a,module.exports=a):a("undefined"!==typeof Highcharts?Highcharts:void 0);})(function(a){function h(a,c,l,h){a.hasOwnProperty(c)||(a[c]=h.apply(null,l));}a=a?a._modules:{};h(a,"Stock/Indicators/SMA/SMAComposition.js",[a["Core/Series/SeriesRegistry.js"],a["Core/Utilities.js"]],
function(a,c){});h(a,"Stock/Indicators/SMA/SMAIndicator.js",[a["Core/Chart/Chart.js"],a["Core/Series/SeriesRegistry.js"],a["Core/Utilities.js"]],function(a,c,l){var h=this&&this.__extends||function(){var a=function(e,b){a=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(b,f){b.__proto__=f;}||function(b,f){for(var d in f)f.hasOwnProperty(d)&&(b[d]=f[d]);};return a(e,b)};return function(e,b){function d(){this.constructor=e;}a(e,b);e.prototype=null===b?Object.create(b):(d.prototype=b.prototype,
new d);}}(),r=c.seriesTypes.line,n=l.addEvent,t=l.error,u=l.extend,v=l.isArray,e=l.merge,g=l.pick,p=l.splat;l=function(m){function k(){var b=null!==m&&m.apply(this,arguments)||this;b.data=void 0;b.dataEventsToUnbind=void 0;b.linkedParent=void 0;b.options=void 0;b.points=void 0;return b}h(k,m);k.prototype.destroy=function(){this.dataEventsToUnbind.forEach(function(b){b();});m.prototype.destroy.apply(this,arguments);};k.prototype.getName=function(){var b=this.name,d=[];b||((this.nameComponents||[]).forEach(function(b,
e){d.push(this.options.params[b]+g(this.nameSuffixes[e],""));},this),b=(this.nameBase||this.type.toUpperCase())+(this.nameComponents?" ("+d.join(", ")+")":""));return b};k.prototype.getValues=function(b,d){var f=d.period,e=b.xData;b=b.yData;var a=b.length,g=0,p=0,k=[],m=[],l=[],c=-1;if(!(e.length<f)){for(v(b[0])&&(c=d.index?d.index:0);g<f-1;)p+=0>c?b[g]:b[g][c],g++;for(d=g;d<a;d++){p+=0>c?b[d]:b[d][c];var h=[e[d],p/f];k.push(h);m.push(h[0]);l.push(h[1]);p-=0>c?b[d-g]:b[d-g][c];}return {values:k,xData:m,
yData:l}}};k.prototype.init=function(b,d){var f=this;m.prototype.init.call(f,b,d);d=n(a,"afterLinkSeries",function(){var d=!!f.dataEventsToUnbind.length;if(f.linkedParent)if(d||(f.dataEventsToUnbind.push(n(f.linkedParent,"updatedData",function(){f.recalculateValues();})),f.calculateOn.xAxis&&f.dataEventsToUnbind.push(n(f.linkedParent.xAxis,f.calculateOn.xAxis,function(){f.recalculateValues();}))),"init"===f.calculateOn.chart)f.processedYData||f.recalculateValues();else {if(!d)var e=n(f.chart,f.calculateOn.chart,
function(){f.recalculateValues();e();});}else return t("Series "+f.options.linkedTo+" not found! Check `linkedTo`.",!1,b)},{order:0});f.dataEventsToUnbind=[];f.eventsToUnbind.push(d);};k.prototype.recalculateValues=function(){var b=this.points||[],d=(this.xData||[]).length,f=this.getValues(this.linkedParent,this.options.params)||{values:[],xData:[],yData:[]},e=[],a=!0;if(d&&!this.hasGroupedData&&this.visible&&this.points)if(this.cropped){if(this.xAxis){var g=this.xAxis.min;var k=this.xAxis.max;}d=this.cropData(f.xData,
f.yData,g,k);for(g=0;g<d.xData.length;g++)e.push([d.xData[g]].concat(p(d.yData[g])));d=f.xData.indexOf(this.xData[0]);g=f.xData.indexOf(this.xData[this.xData.length-1]);-1===d&&g===f.xData.length-2&&e[0][0]===b[0].x&&e.shift();this.updateData(e);}else f.xData.length!==d-1&&f.xData.length!==d+1&&(a=!1,this.updateData(f.values));a&&(this.xData=f.xData,this.yData=f.yData,this.options.data=f.values);this.calculateOn.xAxis&&this.processedXData&&(delete this.processedXData,this.isDirty=!0,this.redraw());
this.isDirtyData=!1;};k.prototype.processData=function(){var b=this.options.compareToMain,d=this.linkedParent;m.prototype.processData.apply(this,arguments);this.dataModify&&d&&d.dataModify&&d.dataModify.compareValue&&b&&(this.dataModify.compareValue=d.dataModify.compareValue);};k.defaultOptions=e(r.defaultOptions,{name:void 0,tooltip:{valueDecimals:4},linkedTo:void 0,compareToMain:!1,params:{index:3,period:14}});return k}(r);u(l.prototype,{calculateOn:{chart:"init"},hasDerivedData:!0,nameComponents:["period"],
nameSuffixes:[],useCommonDataGrouping:!0});c.registerSeriesType("sma",l);return l});h(a,"Stock/Indicators/EMA/EMAIndicator.js",[a["Core/Series/SeriesRegistry.js"],a["Core/Utilities.js"]],function(a,c){var l=this&&this.__extends||function(){var a=function(c,e){a=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,a){e.__proto__=a;}||function(e,a){for(var g in a)a.hasOwnProperty(g)&&(e[g]=a[g]);};return a(c,e)};return function(c,e){function g(){this.constructor=c;}a(c,e);c.prototype=null===
e?Object.create(e):(g.prototype=e.prototype,new g);}}(),h=a.seriesTypes.sma,r=c.correctFloat,n=c.isArray,t=c.merge;c=function(a){function c(){var e=null!==a&&a.apply(this,arguments)||this;e.data=void 0;e.options=void 0;e.points=void 0;return e}l(c,a);c.prototype.accumulatePeriodPoints=function(a,g,c){for(var e=0,k=0,b;k<a;)b=0>g?c[k]:c[k][g],e+=b,k++;return e};c.prototype.calculateEma=function(a,g,c,h,k,b,d){a=a[c-1];g=0>b?g[c-1]:g[c-1][b];h="undefined"===typeof k?d:r(g*h+k*(1-h));return [a,h]};c.prototype.getValues=
function(a,c){var e=c.period,g=a.xData,k=(a=a.yData)?a.length:0,b=2/(e+1),d=[],f=[],h=[],l=-1;if(!(k<e)){n(a[0])&&(l=c.index?c.index:0);c=this.accumulatePeriodPoints(e,l,a);for(c/=e;e<k+1;e++){var q=this.calculateEma(g,a,e,b,q,l,c);d.push(q);f.push(q[0]);h.push(q[1]);q=q[1];}return {values:d,xData:f,yData:h}}};c.defaultOptions=t(h.defaultOptions,{params:{index:3,period:9}});return c}(h);a.registerSeriesType("ema",c);return c});h(a,"masters/indicators/indicators.src.js",[],function(){});});
//# sourceMappingURL=indicators.js.map
});
var trendline = createCommonjsModule(function (module) {
(function(a){module.exports?(a["default"]=a,module.exports=a):a("undefined"!==typeof Highcharts?Highcharts:void 0);})(function(a){function e(a,c,e,g){a.hasOwnProperty(c)||(a[c]=g.apply(null,e));}a=a?a._modules:{};e(a,"Stock/Indicators/TrendLine/TrendLineIndicator.js",[a["Core/Series/SeriesRegistry.js"],
a["Core/Utilities.js"]],function(a,c){var e=this&&this.__extends||function(){var a=function(c,b){a=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(a,b){a.__proto__=b;}||function(a,b){for(var d in b)b.hasOwnProperty(d)&&(a[d]=b[d]);};return a(c,b)};return function(c,b){function d(){this.constructor=c;}a(c,b);c.prototype=null===b?Object.create(b):(d.prototype=b.prototype,new d);}}(),g=a.seriesTypes.sma,m=c.extend,r=c.merge,t=c.isArray;c=function(a){function c(){var b=null!==a&&a.apply(this,
arguments)||this;b.data=void 0;b.options=void 0;b.points=void 0;return b}e(c,a);c.prototype.getValues=function(a,d){var c=a.xData,b=a.yData;a=[];var e=[],g=[],h=0,n=0,p=0,q=0,k=c.length,m=d.index;for(d=0;d<k;d++){var f=c[d];var l=t(b[d])?b[d][m]:b[d];h+=f;n+=l;p+=f*l;q+=f*f;}b=(k*p-h*n)/(k*q-h*h);isNaN(b)&&(b=0);h=(n-b*h)/k;for(d=0;d<k;d++)f=c[d],l=b*f+h,a[d]=[f,l],e[d]=f,g[d]=l;return {xData:e,yData:g,values:a}};c.defaultOptions=r(g.defaultOptions,{params:{period:void 0,index:3}});return c}(g);m(c.prototype,
{nameBase:"Trendline",nameComponents:!1});a.registerSeriesType("trendline",c);return c});e(a,"masters/indicators/trendline.src.js",[],function(){});});
//# sourceMappingURL=trendline.js.map
});
const statementsChartCss = "@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;justify-content:space-between;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-statement-chart-container{display:flex;flex-direction:row;height:100%;margin-left:-10;margin-top:20px}.rv-statement-chart-container .highcharts-root{min-height:328px !important}";
indicators(highcharts);
trendline(highcharts);
accessibility(highcharts);
const StatementsChart = /*@__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 content - content to text that should display
* @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 (isStatements(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);
};
/**
* Request report data based on filter and configuration param
* Formats retrieved data into Highcharts format using formatData
* Updated Highchart params using updateHighchartsParams
*/
this.requestReportData = async () => {
var _a, _b, _c, _d, _e, _f, _g, _h;
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._dataFormatted = formatData({
summary: reportData.data,
reportType: ((_a = this._filter) === null || _a === void 0 ? void 0 : _a.reportType) === RVReportTypes.FINANCIAL_FORECASTS
? (_b = this._filter) === null || _b === void 0 ? void 0 : _b.financialStatementType
: (_c = this._filter) === null || _c === void 0 ? void 0 : _c.reportType,
reportFrequency: (_d = this._filter) === null || _d === void 0 ? void 0 : _d.reportFrequency,
chart: (_e = this._options) === null || _e === void 0 ? void 0 : _e.chart,
date: (_g = (_f = this._options) === null || _f === void 0 ? void 0 : _f.content) === null || _g === void 0 ? void 0 : _g.date,
});
this.updateHighchartsParams();
}
else if (reportData === null || reportData === void 0 ? void 0 : reportData.error) {
this.errorStatusCode = (_h = reportData.error) === null || _h === void 0 ? void 0 : _h.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 = '';
}
};
/**
* Using getHighchartsParams,Combine generic stacked bar line
* chart options and formatted data based on the report type
* into one option for highcharts
*/
this.updateHighchartsParams = () => {
const options = getHighchartsParams({
dataFormatted: this._dataFormatted,
options: this._options,
});
if (options) {
this.loading = '';
this.chartOptions = options;
}
};
this.renderMain = () => {
var _a, _b, _c, _d, _e, _f;
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));
}
return (h("div", { class: "rv-statement-chart-container", id: "railz-chart", ref: (el) => (this.containerRef = el), style: { width: (_d = (_c = this._options) === null || _c === void 0 ? void 0 : _c.chart) === null || _d === void 0 ? void 0 : _d.width, height: (_f = (_e = this._options) === null || _e === void 0 ? void 0 : _e.chart) === null || _f === void 0 ? void 0 : _f.height } }));
};
}
watchContainerRef(newValue, _) {
if (newValue && this.chartOptions) {
highcharts.chart(this.containerRef, this.chartOptions);
}
}
async watchFilter(newValue, oldValue) {
if (newValue && oldValue && !isEqual(oldValue, newValue)) {
await this.validateParams(this.configuration, newValue, this.options);
}
}
async watchConfiguration(newValue, oldValue) {
if (newValue && oldValue && !isEqual(oldValue, newValue)) {
await this.validateParams(newValue, this.filter, 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;
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));
};
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 }, ((_d = (_c = this._options) === null || _c === void 0 ? void 0 : _c.title) === null || _d === void 0 ? void 0 : _d.visible) === false ? ('') : (h("div", { class: "rv-header-container" }, h(TitleElement, null))), this.renderMain()));
}
static get watchers() { return {
"containerRef": ["watchContainerRef"],
"filter": ["watchFilter"],
"configuration": ["watchConfiguration"],
"options": ["watchOptions"]
}; }
static get style() { return statementsChartCss; }
}, [1, "railz-statements-chart", {
"configuration": [16],
"filter": [16],
"options": [16],
"loading": [32],
"_configuration": [32],
"_filter": [32],
"_options": [32],
"_dataFormatted": [32],
"errorStatusCode": [32],
"chartOptions": [32],
"containerRef": [32]
}]);
function defineCustomElement() {
if (typeof customElements === "undefined") {
return;
}
const components = ["railz-statements-chart", "railz-error-image", "railz-loading", "railz-tooltip"];
components.forEach(tagName => { switch (tagName) {
case "railz-statements-chart":
if (!customElements.get(tagName)) {
customElements.define(tagName, StatementsChart);
}
break;
case "railz-error-image":
if (!customElements.get(tagName)) {
defineCustomElement$3();
}
break;
case "railz-loading":
if (!customElements.get(tagName)) {
defineCustomElement$2();
}
break;
case "railz-tooltip":
if (!customElements.get(tagName)) {
defineCustomElement$1();
}
break;
} });
}
export { StatementsChart as S, defineCustomElement as d };
//# sourceMappingURL=statements-chart.js.map