@xui/charts
Version:
xUI Charts for Angular
115 lines • 18.1 kB
JavaScript
import { Component, Inject, Input } from '@angular/core';
import { AnalysisService } from '../analysis.service';
import { DOCUMENT } from '@angular/common';
import * as i0 from "@angular/core";
import * as i1 from "../analysis.service";
import * as i2 from "@xui/components";
import * as i3 from "@angular/cdk/menu";
import * as i4 from "ngx-echarts";
export class ChartComponent {
get trends() {
return this.analysisService.getChart(this.index);
}
constructor(analysisService, document) {
this.analysisService = analysisService;
this.document = document;
this.chartOptions = {
grid: {
left: 40,
top: 10,
right: 40,
bottom: 40
},
tooltip: {
showContent: false,
trigger: 'axis',
axisPointer: { type: 'cross' }
},
xAxis: [
{
type: 'category',
axisLine: {
// show: true,
lineStyle: {
width: 2
// type: 'solid'
}
},
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
{
axisLine: {
onZero: false,
lineStyle: {
width: 2
}
}
}
],
yAxis: [
{
axisLine: {
show: true,
lineStyle: {
width: 2,
type: 'solid'
}
}
// type: 'value'
// splitNumber: 3,
},
{
position: 'right',
axisLine: {
show: true,
lineStyle: {
width: 2,
type: 'solid'
}
}
// splitNumber: 3,
}
],
series: [
{
data: [820, 932, 901, 934, 1290, 1330, 1320],
showSymbol: false,
type: 'line'
},
{
data: [420, 332, 981, 924, 4290, 1930, 2320],
yAxisIndex: 1,
showSymbol: false,
type: 'line'
}
]
};
}
onChartInit(chart) {
this.chart = chart;
this.analysisService.connectChart(chart);
chart.on('highlight', (event) => {
console.log('event', event);
// const series = this.chart.getVisual({ seriesIndex: 1, dataIndex: 1 }, 'symbol');//.getSeries();
const series = this.chart.getModel().getSeries();
// const values = series.map(x => x)
console.log('series', series);
this.document.addEventListener('resize', () => {
console.log('resize');
chart.resize();
});
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: ChartComponent, deps: [{ token: i1.AnalysisService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.1", type: ChartComponent, selector: "xui-analysis-chart", inputs: { index: "index" }, ngImport: i0, template: "<div echarts (chartInit)=\"onChartInit($event)\" [options]=\"chartOptions\" class=\"chart\"></div>\n<div class=\"legend\">\n @for (trend of trends(); track trend) {\n <div class=\"trend\">\n <div class=\"metric\">\n 42.0\n <div class=\"type\">%</div>\n </div>\n\n <div class=\"labels\">\n <div class=\"metric-name\">{{ trend.metric.name }}</div>\n <div class=\"entity-name\">{{ trend.entity.name }}</div>\n </div>\n\n <xui-button type=\"icon\" [cdkMenuTriggerFor]=\"menu\">\n <xui-icon icon=\"more_horiz\"></xui-icon>\n </xui-button>\n </div>\n }\n</div>\n\n<ng-template #menu>\n <xui-context-menu cdkMenu>\n <xui-button cdkMenuItem>Remove</xui-button>\n <hr />\n <xui-button cdkMenuItem>None</xui-button>\n </xui-context-menu>\n</ng-template>\n", styles: [":host{width:100%;min-height:200px;display:flex;gap:4px}.chart{flex:1;background-color:#fff}.legend{width:280px;display:flex;flex-direction:column;gap:4px}.legend .trend{height:48px;display:flex;align-items:center;gap:8px;border-radius:4px}.legend .trend:hover{outline:1px solid gray;outline-offset:-1px}.legend .trend .metric{height:100%;flex:0 0 48px;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;font-weight:500;line-height:1.1em;padding:8px;background-color:#1e90ff;border-radius:4px}.legend .trend .metric .type{font-weight:initial;font-size:.8em}.legend .trend .labels{flex:1;display:flex;gap:4px;flex-direction:column;justify-content:center}.legend .trend .labels .metric-name{font-size:12px;font-weight:500;line-height:1em}.legend .trend .labels .entity-name{font-size:11px;line-height:1em;margin-left:8px}.legend .trend xui-button{display:flex;opacity:0;margin-right:4px;transition:opacity ease-in-out .3s}.legend .trend:hover xui-button{opacity:1}\n"], dependencies: [{ kind: "component", type: i2.XuiButton, selector: "xui-button", inputs: ["type", "size", "color", "shine", "disabled", "stateDelay", "onClick"], outputs: ["click"] }, { kind: "component", type: i2.XuiIcon, selector: "xui-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "icon"], exportAs: ["xuiIcon"] }, { kind: "component", type: i2.XuiContextMenu, selector: "xui-context-menu", inputs: ["anchor"], outputs: ["afterClosed"] }, { kind: "directive", type: i3.CdkMenu, selector: "[cdkMenu]", outputs: ["closed"], exportAs: ["cdkMenu"] }, { kind: "directive", type: i3.CdkMenuItem, selector: "[cdkMenuItem]", inputs: ["cdkMenuItemDisabled", "cdkMenuitemTypeaheadLabel"], outputs: ["cdkMenuItemTriggered"], exportAs: ["cdkMenuItem"] }, { kind: "directive", type: i3.CdkMenuTrigger, selector: "[cdkMenuTriggerFor]", inputs: ["cdkMenuTriggerFor", "cdkMenuPosition", "cdkMenuTriggerData"], outputs: ["cdkMenuOpened", "cdkMenuClosed"], exportAs: ["cdkMenuTriggerFor"] }, { kind: "directive", type: i4.NgxEchartsDirective, selector: "echarts, [echarts]", inputs: ["options", "theme", "initOpts", "merge", "autoResize", "loading", "loadingType", "loadingOpts"], outputs: ["chartInit", "optionsError", "chartClick", "chartDblClick", "chartMouseDown", "chartMouseMove", "chartMouseUp", "chartMouseOver", "chartMouseOut", "chartGlobalOut", "chartContextMenu", "chartHighlight", "chartDownplay", "chartSelectChanged", "chartLegendSelectChanged", "chartLegendSelected", "chartLegendUnselected", "chartLegendLegendSelectAll", "chartLegendLegendInverseSelect", "chartLegendScroll", "chartDataZoom", "chartDataRangeSelected", "chartGraphRoam", "chartGeoRoam", "chartTreeRoam", "chartTimelineChanged", "chartTimelinePlayChanged", "chartRestore", "chartDataViewChanged", "chartMagicTypeChanged", "chartGeoSelectChanged", "chartGeoSelected", "chartGeoUnselected", "chartAxisAreaSelected", "chartBrush", "chartBrushEnd", "chartBrushSelected", "chartGlobalCursorTaken", "chartRendered", "chartFinished"], exportAs: ["echarts"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: ChartComponent, decorators: [{
type: Component,
args: [{ selector: 'xui-analysis-chart', template: "<div echarts (chartInit)=\"onChartInit($event)\" [options]=\"chartOptions\" class=\"chart\"></div>\n<div class=\"legend\">\n @for (trend of trends(); track trend) {\n <div class=\"trend\">\n <div class=\"metric\">\n 42.0\n <div class=\"type\">%</div>\n </div>\n\n <div class=\"labels\">\n <div class=\"metric-name\">{{ trend.metric.name }}</div>\n <div class=\"entity-name\">{{ trend.entity.name }}</div>\n </div>\n\n <xui-button type=\"icon\" [cdkMenuTriggerFor]=\"menu\">\n <xui-icon icon=\"more_horiz\"></xui-icon>\n </xui-button>\n </div>\n }\n</div>\n\n<ng-template #menu>\n <xui-context-menu cdkMenu>\n <xui-button cdkMenuItem>Remove</xui-button>\n <hr />\n <xui-button cdkMenuItem>None</xui-button>\n </xui-context-menu>\n</ng-template>\n", styles: [":host{width:100%;min-height:200px;display:flex;gap:4px}.chart{flex:1;background-color:#fff}.legend{width:280px;display:flex;flex-direction:column;gap:4px}.legend .trend{height:48px;display:flex;align-items:center;gap:8px;border-radius:4px}.legend .trend:hover{outline:1px solid gray;outline-offset:-1px}.legend .trend .metric{height:100%;flex:0 0 48px;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;font-weight:500;line-height:1.1em;padding:8px;background-color:#1e90ff;border-radius:4px}.legend .trend .metric .type{font-weight:initial;font-size:.8em}.legend .trend .labels{flex:1;display:flex;gap:4px;flex-direction:column;justify-content:center}.legend .trend .labels .metric-name{font-size:12px;font-weight:500;line-height:1em}.legend .trend .labels .entity-name{font-size:11px;line-height:1em;margin-left:8px}.legend .trend xui-button{display:flex;opacity:0;margin-right:4px;transition:opacity ease-in-out .3s}.legend .trend:hover xui-button{opacity:1}\n"] }]
}], ctorParameters: () => [{ type: i1.AnalysisService }, { type: Document, decorators: [{
type: Inject,
args: [DOCUMENT]
}] }], propDecorators: { index: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hhcnQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jaGFydHMvc3JjL2FuYWx5c2lzL2NoYXJ0L2NoYXJ0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY2hhcnRzL3NyYy9hbmFseXNpcy9jaGFydC9jaGFydC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQWEsTUFBTSxlQUFlLENBQUM7QUFFcEUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBQ3RELE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQzs7Ozs7O0FBTzNDLE1BQU0sT0FBTyxjQUFjO0lBOEV6QixJQUFJLE1BQU07UUFDUixPQUFPLElBQUksQ0FBQyxlQUFlLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNuRCxDQUFDO0lBRUQsWUFDVSxlQUFnQyxFQUNkLFFBQWtCO1FBRHBDLG9CQUFlLEdBQWYsZUFBZSxDQUFpQjtRQUNkLGFBQVEsR0FBUixRQUFRLENBQVU7UUFoRjlDLGlCQUFZLEdBQWtCO1lBQzVCLElBQUksRUFBRTtnQkFDSixJQUFJLEVBQUUsRUFBRTtnQkFDUixHQUFHLEVBQUUsRUFBRTtnQkFDUCxLQUFLLEVBQUUsRUFBRTtnQkFDVCxNQUFNLEVBQUUsRUFBRTthQUNYO1lBQ0QsT0FBTyxFQUFFO2dCQUNQLFdBQVcsRUFBRSxLQUFLO2dCQUNsQixPQUFPLEVBQUUsTUFBTTtnQkFDZixXQUFXLEVBQUUsRUFBRSxJQUFJLEVBQUUsT0FBTyxFQUFFO2FBQy9CO1lBRUQsS0FBSyxFQUFFO2dCQUNMO29CQUNFLElBQUksRUFBRSxVQUFVO29CQUNoQixRQUFRLEVBQUU7d0JBQ1IsY0FBYzt3QkFDZCxTQUFTLEVBQUU7NEJBQ1QsS0FBSyxFQUFFLENBQUM7NEJBQ1IsZ0JBQWdCO3lCQUNqQjtxQkFDRjtvQkFDRCxJQUFJLEVBQUUsQ0FBQyxLQUFLLEVBQUUsS0FBSyxFQUFFLEtBQUssRUFBRSxLQUFLLEVBQUUsS0FBSyxFQUFFLEtBQUssRUFBRSxLQUFLLENBQUM7aUJBQ3hEO2dCQUNEO29CQUNFLFFBQVEsRUFBRTt3QkFDUixNQUFNLEVBQUUsS0FBSzt3QkFFYixTQUFTLEVBQUU7NEJBQ1QsS0FBSyxFQUFFLENBQUM7eUJBQ1Q7cUJBQ0Y7aUJBQ0Y7YUFDRjtZQUNELEtBQUssRUFBRTtnQkFDTDtvQkFDRSxRQUFRLEVBQUU7d0JBQ1IsSUFBSSxFQUFFLElBQUk7d0JBQ1YsU0FBUyxFQUFFOzRCQUNULEtBQUssRUFBRSxDQUFDOzRCQUNSLElBQUksRUFBRSxPQUFPO3lCQUNkO3FCQUNGO29CQUNELGdCQUFnQjtvQkFDaEIsa0JBQWtCO2lCQUNuQjtnQkFDRDtvQkFDRSxRQUFRLEVBQUUsT0FBTztvQkFDakIsUUFBUSxFQUFFO3dCQUNSLElBQUksRUFBRSxJQUFJO3dCQUNWLFNBQVMsRUFBRTs0QkFDVCxLQUFLLEVBQUUsQ0FBQzs0QkFDUixJQUFJLEVBQUUsT0FBTzt5QkFDZDtxQkFDRjtvQkFDRCxrQkFBa0I7aUJBQ25CO2FBQ0Y7WUFDRCxNQUFNLEVBQUU7Z0JBQ047b0JBQ0UsSUFBSSxFQUFFLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLElBQUksRUFBRSxJQUFJLEVBQUUsSUFBSSxDQUFDO29CQUM1QyxVQUFVLEVBQUUsS0FBSztvQkFDakIsSUFBSSxFQUFFLE1BQU07aUJBQ2I7Z0JBQ0Q7b0JBQ0UsSUFBSSxFQUFFLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLElBQUksRUFBRSxJQUFJLEVBQUUsSUFBSSxDQUFDO29CQUM1QyxVQUFVLEVBQUUsQ0FBQztvQkFDYixVQUFVLEVBQUUsS0FBSztvQkFDakIsSUFBSSxFQUFFLE1BQU07aUJBQ2I7YUFDRjtTQUNGLENBQUM7SUFTQyxDQUFDO0lBRUosV0FBVyxDQUFDLEtBQWM7UUFDeEIsSUFBSSxDQUFDLEtBQUssR0FBRyxLQUFLLENBQUM7UUFDbkIsSUFBSSxDQUFDLGVBQWUsQ0FBQyxZQUFZLENBQUMsS0FBSyxDQUFDLENBQUM7UUFFekMsS0FBSyxDQUFDLEVBQUUsQ0FBQyxXQUFXLEVBQUUsQ0FBQyxLQUFVLEVBQUUsRUFBRTtZQUNuQyxPQUFPLENBQUMsR0FBRyxDQUFDLE9BQU8sRUFBRSxLQUFLLENBQUMsQ0FBQztZQUU1QixrR0FBa0c7WUFDbEcsTUFBTSxNQUFNLEdBQUksSUFBSSxDQUFDLEtBQWEsQ0FBQyxRQUFRLEVBQUUsQ0FBQyxTQUFTLEVBQUUsQ0FBQztZQUUxRCxvQ0FBb0M7WUFFcEMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxRQUFRLEVBQUUsTUFBTSxDQUFDLENBQUM7WUFFOUIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxnQkFBZ0IsQ0FBQyxRQUFRLEVBQUUsR0FBRyxFQUFFO2dCQUM1QyxPQUFPLENBQUMsR0FBRyxDQUFDLFFBQVEsQ0FBQyxDQUFDO2dCQUN0QixLQUFLLENBQUMsTUFBTSxFQUFFLENBQUM7WUFDakIsQ0FBQyxDQUFDLENBQUM7UUFDTCxDQUFDLENBQUMsQ0FBQztJQUNMLENBQUM7OEdBMUdVLGNBQWMsaURBb0ZmLFFBQVE7a0dBcEZQLGNBQWMsc0ZDVjNCLCt6QkE0QkE7OzJGRGxCYSxjQUFjO2tCQUwxQixTQUFTOytCQUNFLG9CQUFvQjs7MEJBd0YzQixNQUFNOzJCQUFDLFFBQVE7eUNBbEZULEtBQUs7c0JBQWIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5qZWN0LCBJbnB1dCwgT25EZXN0cm95IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBFQ2hhcnRzLCBFQ2hhcnRzT3B0aW9uIH0gZnJvbSAnZWNoYXJ0cyc7XG5pbXBvcnQgeyBBbmFseXNpc1NlcnZpY2UgfSBmcm9tICcuLi9hbmFseXNpcy5zZXJ2aWNlJztcbmltcG9ydCB7IERPQ1VNRU5UIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAneHVpLWFuYWx5c2lzLWNoYXJ0JyxcbiAgdGVtcGxhdGVVcmw6ICcuL2NoYXJ0LmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vY2hhcnQuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBDaGFydENvbXBvbmVudCB7XG4gIHByaXZhdGUgY2hhcnQhOiBFQ2hhcnRzO1xuICBASW5wdXQoKSBpbmRleCE6IG51bWJlcjtcblxuICBjaGFydE9wdGlvbnM6IEVDaGFydHNPcHRpb24gPSB7XG4gICAgZ3JpZDoge1xuICAgICAgbGVmdDogNDAsXG4gICAgICB0b3A6IDEwLFxuICAgICAgcmlnaHQ6IDQwLFxuICAgICAgYm90dG9tOiA0MFxuICAgIH0sXG4gICAgdG9vbHRpcDoge1xuICAgICAgc2hvd0NvbnRlbnQ6IGZhbHNlLFxuICAgICAgdHJpZ2dlcjogJ2F4aXMnLFxuICAgICAgYXhpc1BvaW50ZXI6IHsgdHlwZTogJ2Nyb3NzJyB9XG4gICAgfSxcblxuICAgIHhBeGlzOiBbXG4gICAgICB7XG4gICAgICAgIHR5cGU6ICdjYXRlZ29yeScsXG4gICAgICAgIGF4aXNMaW5lOiB7XG4gICAgICAgICAgLy8gc2hvdzogdHJ1ZSxcbiAgICAgICAgICBsaW5lU3R5bGU6IHtcbiAgICAgICAgICAgIHdpZHRoOiAyXG4gICAgICAgICAgICAvLyB0eXBlOiAnc29saWQnXG4gICAgICAgICAgfVxuICAgICAgICB9LFxuICAgICAgICBkYXRhOiBbJ01vbicsICdUdWUnLCAnV2VkJywgJ1RodScsICdGcmknLCAnU2F0JywgJ1N1biddXG4gICAgICB9LFxuICAgICAge1xuICAgICAgICBheGlzTGluZToge1xuICAgICAgICAgIG9uWmVybzogZmFsc2UsXG5cbiAgICAgICAgICBsaW5lU3R5bGU6IHtcbiAgICAgICAgICAgIHdpZHRoOiAyXG4gICAgICAgICAgfVxuICAgICAgICB9XG4gICAgICB9XG4gICAgXSxcbiAgICB5QXhpczogW1xuICAgICAge1xuICAgICAgICBheGlzTGluZToge1xuICAgICAgICAgIHNob3c6IHRydWUsXG4gICAgICAgICAgbGluZVN0eWxlOiB7XG4gICAgICAgICAgICB3aWR0aDogMixcbiAgICAgICAgICAgIHR5cGU6ICdzb2xpZCdcbiAgICAgICAgICB9XG4gICAgICAgIH1cbiAgICAgICAgLy8gdHlwZTogJ3ZhbHVlJ1xuICAgICAgICAvLyBzcGxpdE51bWJlcjogMyxcbiAgICAgIH0sXG4gICAgICB7XG4gICAgICAgIHBvc2l0aW9uOiAncmlnaHQnLFxuICAgICAgICBheGlzTGluZToge1xuICAgICAgICAgIHNob3c6IHRydWUsXG4gICAgICAgICAgbGluZVN0eWxlOiB7XG4gICAgICAgICAgICB3aWR0aDogMixcbiAgICAgICAgICAgIHR5cGU6ICdzb2xpZCdcbiAgICAgICAgICB9XG4gICAgICAgIH1cbiAgICAgICAgLy8gc3BsaXROdW1iZXI6IDMsXG4gICAgICB9XG4gICAgXSxcbiAgICBzZXJpZXM6IFtcbiAgICAgIHtcbiAgICAgICAgZGF0YTogWzgyMCwgOTMyLCA5MDEsIDkzNCwgMTI5MCwgMTMzMCwgMTMyMF0sXG4gICAgICAgIHNob3dTeW1ib2w6IGZhbHNlLFxuICAgICAgICB0eXBlOiAnbGluZSdcbiAgICAgIH0sXG4gICAgICB7XG4gICAgICAgIGRhdGE6IFs0MjAsIDMzMiwgOTgxLCA5MjQsIDQyOTAsIDE5MzAsIDIzMjBdLFxuICAgICAgICB5QXhpc0luZGV4OiAxLFxuICAgICAgICBzaG93U3ltYm9sOiBmYWxzZSxcbiAgICAgICAgdHlwZTogJ2xpbmUnXG4gICAgICB9XG4gICAgXVxuICB9O1xuXG4gIGdldCB0cmVuZHMoKSB7XG4gICAgcmV0dXJuIHRoaXMuYW5hbHlzaXNTZXJ2aWNlLmdldENoYXJ0KHRoaXMuaW5kZXgpO1xuICB9XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJpdmF0ZSBhbmFseXNpc1NlcnZpY2U6IEFuYWx5c2lzU2VydmljZSxcbiAgICBASW5qZWN0KERPQ1VNRU5UKSBwcml2YXRlIGRvY3VtZW50OiBEb2N1bWVudFxuICApIHt9XG5cbiAgb25DaGFydEluaXQoY2hhcnQ6IEVDaGFydHMpIHtcbiAgICB0aGlzLmNoYXJ0ID0gY2hhcnQ7XG4gICAgdGhpcy5hbmFseXNpc1NlcnZpY2UuY29ubmVjdENoYXJ0KGNoYXJ0KTtcblxuICAgIGNoYXJ0Lm9uKCdoaWdobGlnaHQnLCAoZXZlbnQ6IGFueSkgPT4ge1xuICAgICAgY29uc29sZS5sb2coJ2V2ZW50JywgZXZlbnQpO1xuXG4gICAgICAvLyBjb25zdCBzZXJpZXMgPSB0aGlzLmNoYXJ0LmdldFZpc3VhbCh7IHNlcmllc0luZGV4OiAxLCBkYXRhSW5kZXg6IDEgfSwgJ3N5bWJvbCcpOy8vLmdldFNlcmllcygpO1xuICAgICAgY29uc3Qgc2VyaWVzID0gKHRoaXMuY2hhcnQgYXMgYW55KS5nZXRNb2RlbCgpLmdldFNlcmllcygpO1xuXG4gICAgICAvLyBjb25zdCB2YWx1ZXMgPSBzZXJpZXMubWFwKHggPT4geClcblxuICAgICAgY29uc29sZS5sb2coJ3NlcmllcycsIHNlcmllcyk7XG5cbiAgICAgIHRoaXMuZG9jdW1lbnQuYWRkRXZlbnRMaXN0ZW5lcigncmVzaXplJywgKCkgPT4ge1xuICAgICAgICBjb25zb2xlLmxvZygncmVzaXplJyk7XG4gICAgICAgIGNoYXJ0LnJlc2l6ZSgpO1xuICAgICAgfSk7XG4gICAgfSk7XG4gIH1cbn1cbiIsIjxkaXYgZWNoYXJ0cyAoY2hhcnRJbml0KT1cIm9uQ2hhcnRJbml0KCRldmVudClcIiBbb3B0aW9uc109XCJjaGFydE9wdGlvbnNcIiBjbGFzcz1cImNoYXJ0XCI+PC9kaXY+XG48ZGl2IGNsYXNzPVwibGVnZW5kXCI+XG4gIEBmb3IgKHRyZW5kIG9mIHRyZW5kcygpOyB0cmFjayB0cmVuZCkge1xuICAgIDxkaXYgY2xhc3M9XCJ0cmVuZFwiPlxuICAgICAgPGRpdiBjbGFzcz1cIm1ldHJpY1wiPlxuICAgICAgICA0Mi4wXG4gICAgICAgIDxkaXYgY2xhc3M9XCJ0eXBlXCI+JTwvZGl2PlxuICAgICAgPC9kaXY+XG5cbiAgICAgIDxkaXYgY2xhc3M9XCJsYWJlbHNcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cIm1ldHJpYy1uYW1lXCI+e3sgdHJlbmQubWV0cmljLm5hbWUgfX08L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImVudGl0eS1uYW1lXCI+e3sgdHJlbmQuZW50aXR5Lm5hbWUgfX08L2Rpdj5cbiAgICAgIDwvZGl2PlxuXG4gICAgICA8eHVpLWJ1dHRvbiB0eXBlPVwiaWNvblwiIFtjZGtNZW51VHJpZ2dlckZvcl09XCJtZW51XCI+XG4gICAgICAgIDx4dWktaWNvbiBpY29uPVwibW9yZV9ob3JpelwiPjwveHVpLWljb24+XG4gICAgICA8L3h1aS1idXR0b24+XG4gICAgPC9kaXY+XG4gIH1cbjwvZGl2PlxuXG48bmctdGVtcGxhdGUgI21lbnU+XG4gIDx4dWktY29udGV4dC1tZW51IGNka01lbnU+XG4gICAgPHh1aS1idXR0b24gY2RrTWVudUl0ZW0+UmVtb3ZlPC94dWktYnV0dG9uPlxuICAgIDxociAvPlxuICAgIDx4dWktYnV0dG9uIGNka01lbnVJdGVtPk5vbmU8L3h1aS1idXR0b24+XG4gIDwveHVpLWNvbnRleHQtbWVudT5cbjwvbmctdGVtcGxhdGU+XG4iXX0=