import { View, LEGEND_EVENTS, VIEW_HOOKS, } from '@alauda/chart';
import { isTemplateRef } from '@alauda/ui';
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, Output, TemplateRef, } from '@angular/core';
import { get } from 'lodash';
import * as i0 from "@angular/core";
function LegendComponent_div_0_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 3);
    i0.ɵɵelementContainer(1, 4);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r0 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.leftOperation)("ngTemplateOutletContext", ctx_r0.leftOperationContext);
} }
function LegendComponent_div_1_ng_container_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelementContainer(1, 8);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    i0.ɵɵnextContext(2);
    const _r3 = i0.ɵɵreference(4);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngTemplateOutlet", _r3);
} }
const _c0 = function (a0) { return { context: a0 }; };
function LegendComponent_div_1_ng_template_2_ng_container_0_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelementContainer(1, 4);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const ctx_r8 = i0.ɵɵnextContext(3);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngTemplateOutlet", ctx_r8.template)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c0, ctx_r8.legendEntries));
} }
function LegendComponent_div_1_ng_template_2_ng_template_1_acl_legend_dropdown_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "acl-legend-dropdown", 12);
} if (rf & 2) {
    const ctx_r11 = i0.ɵɵnextContext(4);
    const _r3 = i0.ɵɵreference(4);
    i0.ɵɵproperty("data", ctx_r11.legendEntries)("noData", ctx_r11.noData)("legendTemplate", _r3)("isCard", ctx_r11.mode === "card");
} }
function LegendComponent_div_1_ng_template_2_ng_template_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0, 10);
    i0.ɵɵtemplate(1, LegendComponent_div_1_ng_template_2_ng_template_1_acl_legend_dropdown_1_Template, 1, 4, "acl-legend-dropdown", 11);
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const ctx_r10 = i0.ɵɵnextContext(3);
    i0.ɵɵproperty("ngSwitch", ctx_r10.template);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngSwitchCase", "dropdown");
} }
function LegendComponent_div_1_ng_template_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵtemplate(0, LegendComponent_div_1_ng_template_2_ng_container_0_Template, 2, 4, "ng-container", 6);
    i0.ɵɵtemplate(1, LegendComponent_div_1_ng_template_2_ng_template_1_Template, 2, 2, "ng-template", null, 9, i0.ɵɵtemplateRefExtractor);
} if (rf & 2) {
    const _r9 = i0.ɵɵreference(2);
    const ctx_r7 = i0.ɵɵnextContext(2);
    i0.ɵɵproperty("ngIf", ctx_r7.isTemplateRef(ctx_r7.template))("ngIfElse", _r9);
} }
function LegendComponent_div_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 5);
    i0.ɵɵtemplate(1, LegendComponent_div_1_ng_container_1_Template, 2, 1, "ng-container", 6);
    i0.ɵɵtemplate(2, LegendComponent_div_1_ng_template_2_Template, 3, 2, "ng-template", null, 7, i0.ɵɵtemplateRefExtractor);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const _r6 = i0.ɵɵreference(3);
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", !ctx_r1.template)("ngIfElse", _r6);
} }
function LegendComponent_div_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 3);
    i0.ɵɵelementContainer(1, 8);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r2 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngTemplateOutlet", ctx_r2.rightOperation);
} }
function LegendComponent_ng_template_3_li_1_Template(rf, ctx) { if (rf & 1) {
    const _r15 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "li", 16)(1, "aui-checkbox", 17);
    i0.ɵɵlistener("ngModelChange", function LegendComponent_ng_template_3_li_1_Template_aui_checkbox_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r14 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r14.allSelected = $event); })("ngModelChange", function LegendComponent_ng_template_3_li_1_Template_aui_checkbox_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r16 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r16.allSelect($event)); });
    i0.ɵɵtext(2);
    i0.ɵɵpipe(3, "translate");
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const ctx_r12 = i0.ɵɵnextContext(2);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngModel", ctx_r12.allSelected);
    i0.ɵɵadvance(1);
    i0.ɵɵtextInterpolate1(" ", ctx_r12.selectAllName || i0.ɵɵpipeBind1(3, 2, "select_all"), " ");
} }
const _c1 = function (a0) { return [a0, "label-symbol"]; };
const _c2 = function () { return {}; };
function LegendComponent_ng_template_3_li_2_Template(rf, ctx) { if (rf & 1) {
    const _r19 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "li", 18);
    i0.ɵɵlistener("click", function LegendComponent_ng_template_3_li_2_Template_li_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r19); const legend_r17 = restoredCtx.$implicit; const ctx_r18 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r18.selected(legend_r17)); });
    i0.ɵɵpipe(1, "translate");
    i0.ɵɵelement(2, "span", 19);
    i0.ɵɵelementStart(3, "span", 20);
    i0.ɵɵtext(4);
    i0.ɵɵpipe(5, "translate");
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const legend_r17 = ctx.$implicit;
    const ctx_r13 = i0.ɵɵnextContext(2);
    i0.ɵɵclassProp("disable", !legend_r17.activate || ctx_r13.noData)("forbid", ctx_r13.noData);
    i0.ɵɵproperty("title", i0.ɵɵpipeBind1(1, 9, legend_r17.activate ? "click_hide" : "click_show"));
    i0.ɵɵadvance(2);
    i0.ɵɵstyleProp("background", legend_r17.color);
    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(15, _c1, ctx_r13.symbolName));
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(ctx_r13.translation ? i0.ɵɵpipeBind3(5, 11, legend_r17.name, i0.ɵɵpureFunction0(17, _c2), true) : legend_r17.name);
} }
function LegendComponent_ng_template_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "ul", 13);
    i0.ɵɵtemplate(1, LegendComponent_ng_template_3_li_1_Template, 4, 4, "li", 14);
    i0.ɵɵtemplate(2, LegendComponent_ng_template_3_li_2_Template, 6, 18, "li", 15);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r4 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", !ctx_r4.noData && ctx_r4.selectAllOperation && ctx_r4.template === "dropdown");
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngForOf", ctx_r4.legendEntries);
} }
export class LegendPayload {
}
export class LegendComponent {
    constructor(cdr) {
        this.cdr = cdr;
        this.symbol = 'line';
        this.mode = 'default';
        this.translation = true;
        this.selectAllOperation = false;
        this.changeLegend = new EventEmitter();
        this.legendEntries = [];
        this.isTemplateRef = isTemplateRef;
        this.allSelected = true;
    }
    get noData() {
        return this.legendEntries?.length === 0 || !this.legendEntries;
    }
    get legendInstance() {
        return this.chart?.getController('legend');
    }
    get symbolName() {
        return `symbol-${this.symbol}`;
    }
    ngOnChanges({ chart }) {
        if (chart.currentValue) {
            this.legendEntries = this.legendInstance?.legendItems;
        }
    }
    ngOnInit() {
        this.legendEntries = this.legendInstance?.legendItems;
        this.chart?.on(VIEW_HOOKS.SET_DATA, (data) => {
            const isBar = this.chart.options.type === 'bar';
            const values = data.flatMap(item => item.values);
            this.legendEntries = isBar
                ? values.reduce((pre, cur) => [
                    ...pre,
                    ...(pre.some(d => d.name === cur.x)
                        ? []
                        : [
                            {
                                name: cur.x,
                                color: cur.color,
                                activate: true,
                                hover: false,
                                value: cur.y,
                                source: cur,
                                unit: get(cur, 'unit'),
                                ...cur,
                            },
                        ]),
                ], [])
                : data.reduce((acc, d) => [
                    ...acc,
                    ...(d.name
                        ? [
                            {
                                name: d.name,
                                color: d.color,
                                activate: !this.legendInstance?.disabledLegend.has(d.name),
                                hover: false,
                                value: d.values[d.values?.length - 1].y,
                                source: d,
                                unit: get(d, 'unit'),
                                ...d,
                            },
                        ]
                        : []),
                ], []);
            if (this.legendInstance?.disabledLegend.size) {
                this.changeLegend.next(this.legendEntries);
            }
            this.cdr.markForCheck();
        });
        this.chart?.on(LEGEND_EVENTS.CLICK, (data) => {
            const { legend, source } = data;
            const legendItem = this.legendEntries.find(item => item.name === legend.name);
            legendItem.activate = !legend.activate;
            this.changeLegend.next(source);
        });
    }
    selected(legend) {
        this.legendInstance.changeLegend(legend);
    }
    allSelect(select) {
        if (select) {
            this.legendInstance.legendSelectAll();
        }
        else {
            this.legendInstance.legendUnselectAll();
        }
        this.legendInstance.changeLegend(this.legendEntries[0]);
    }
}
LegendComponent.ɵfac = function LegendComponent_Factory(t) { return new (t || LegendComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
LegendComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LegendComponent, selectors: [["acl-base-legend"]], inputs: { symbol: "symbol", template: "template", mode: "mode", translation: "translation", leftOperation: "leftOperation", leftOperationContext: "leftOperationContext", rightOperation: "rightOperation", hideLegend: "hideLegend", selectAllOperation: "selectAllOperation", selectAllName: "selectAllName", chart: "chart" }, outputs: { changeLegend: "changeLegend" }, features: [i0.ɵɵNgOnChangesFeature], decls: 5, vars: 3, consts: [["class", "operation", 4, "ngIf"], ["class", "legend-wrap operation", 4, "ngIf"], ["legendTemplate", ""], [1, "operation"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "legend-wrap", "operation"], [4, "ngIf", "ngIfElse"], ["custom", ""], [3, "ngTemplateOutlet"], ["builtinTemplate", ""], [3, "ngSwitch"], ["class", "legend-vertical", 3, "data", "noData", "legendTemplate", "isCard", 4, "ngSwitchCase"], [1, "legend-vertical", 3, "data", "noData", "legendTemplate", "isCard"], [1, "legend-labels"], ["class", "select-all", 4, "ngIf"], ["class", "legend-label", 3, "disable", "forbid", "title", "click", 4, "ngFor", "ngForOf"], [1, "select-all"], [3, "ngModel", "ngModelChange"], [1, "legend-label", 3, "title", "click"], [3, "ngClass"], [1, "label-name"]], template: function LegendComponent_Template(rf, ctx) { if (rf & 1) {
        i0.ɵɵtemplate(0, LegendComponent_div_0_Template, 2, 2, "div", 0);
        i0.ɵɵtemplate(1, LegendComponent_div_1_Template, 4, 2, "div", 1);
        i0.ɵɵtemplate(2, LegendComponent_div_2_Template, 2, 1, "div", 0);
        i0.ɵɵtemplate(3, LegendComponent_ng_template_3_Template, 3, 2, "ng-template", null, 2, i0.ɵɵtemplateRefExtractor);
    } if (rf & 2) {
        i0.ɵɵproperty("ngIf", ctx.isTemplateRef(ctx.leftOperation));
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngIf", !ctx.hideLegend);
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngIf", ctx.isTemplateRef(ctx.rightOperation));
    } }, styles: ["[_nghost-%COMP%]{flex:1;display:flex;justify-content:flex-end;align-items:center}.legend-wrap[_ngcontent-%COMP%]{display:inline-block}.legend-wrap[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%], .legend-wrap[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{padding:0;margin:0;list-style:none}.legend-wrap[_ngcontent-%COMP%]   .legend-labels[_ngcontent-%COMP%]{display:flex}.legend-wrap[_ngcontent-%COMP%]   .legend-label[_ngcontent-%COMP%]{display:flex;align-items:center;cursor:pointer;justify-content:center}.legend-wrap[_ngcontent-%COMP%]   .legend-label[_ngcontent-%COMP%]:not(:last-child){margin-right:12px}.legend-wrap[_ngcontent-%COMP%]   .forbid[_ngcontent-%COMP%]{cursor:no-drop}.legend-wrap[_ngcontent-%COMP%]   .label-name[_ngcontent-%COMP%]{font-size:12px;color:rgb(var(--aui-color-secondary-text))}.legend-wrap[_ngcontent-%COMP%]   .label-symbol[_ngcontent-%COMP%]{margin-right:4px}.disable[_ngcontent-%COMP%]   .label-symbol[_ngcontent-%COMP%]{background:rgb(var(--aui-color-n-6))!important}.disable[_ngcontent-%COMP%]   .label-name[_ngcontent-%COMP%]{color:rgb(var(--aui-color-n-6))}.symbol-square[_ngcontent-%COMP%]{width:12px;height:12px;display:inline-block}.symbol-line[_ngcontent-%COMP%]{width:12px;height:2px;display:inline-block}.symbol-circle[_ngcontent-%COMP%]{width:6px;height:6px;border-radius:50%;display:inline-block}.operation[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;margin-left:8px}.select-all[_ngcontent-%COMP%]     .aui-checkbox{font-size:12px;line-height:16px;margin-bottom:8px}"], changeDetection: 0 });
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LegendComponent, [{
        type: Component,
        args: [{ selector: 'acl-base-legend', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"operation\"\n  *ngIf=\"isTemplateRef(leftOperation)\"\n>\n  <ng-container\n    [ngTemplateOutlet]=\"leftOperation\"\n    [ngTemplateOutletContext]=\"leftOperationContext\"\n  ></ng-container>\n</div>\n\n<div\n  class=\"legend-wrap operation\"\n  *ngIf=\"!hideLegend\"\n>\n  <ng-container *ngIf=\"!template; else custom\">\n    <ng-container [ngTemplateOutlet]=\"legendTemplate\"></ng-container>\n  </ng-container>\n  <ng-template #custom>\n    <ng-container *ngIf=\"isTemplateRef(template); else builtinTemplate\">\n      <ng-container\n        [ngTemplateOutlet]=\"$any(template)\"\n        [ngTemplateOutletContext]=\"{ context: legendEntries }\"\n      ></ng-container>\n    </ng-container>\n    <ng-template #builtinTemplate>\n      <ng-container [ngSwitch]=\"template\">\n        <acl-legend-dropdown\n          class=\"legend-vertical\"\n          *ngSwitchCase=\"'dropdown'\"\n          [data]=\"legendEntries\"\n          [noData]=\"noData\"\n          [legendTemplate]=\"legendTemplate\"\n          [isCard]=\"mode === 'card'\"\n        >\n        </acl-legend-dropdown>\n      </ng-container>\n    </ng-template>\n  </ng-template>\n</div>\n\n<div\n  class=\"operation\"\n  *ngIf=\"isTemplateRef(rightOperation)\"\n>\n  <ng-container [ngTemplateOutlet]=\"rightOperation\"></ng-container>\n</div>\n\n<ng-template #legendTemplate>\n  <ul class=\"legend-labels\">\n    <li\n      class=\"select-all\"\n      *ngIf=\"!noData && selectAllOperation && template === 'dropdown'\"\n    >\n      <aui-checkbox\n        [(ngModel)]=\"allSelected\"\n        (ngModelChange)=\"allSelect($event)\"\n      >\n        {{ selectAllName || ('select_all' | translate) }}\n      </aui-checkbox>\n    </li>\n    <li\n      class=\"legend-label\"\n      [class.disable]=\"!legend.activate || noData\"\n      [class.forbid]=\"noData\"\n      [title]=\"(legend.activate ? 'click_hide' : 'click_show') | translate\"\n      *ngFor=\"let legend of legendEntries\"\n      (click)=\"selected(legend)\"\n    >\n      <span\n        [ngClass]=\"[symbolName, 'label-symbol']\"\n        [style.background]=\"legend.color\"\n      >\n      </span>\n      <span class=\"label-name\">{{\n        translation ? (legend.name | translate: {}:true) : legend.name\n      }}</span>\n    </li>\n  </ul>\n</ng-template>\n", styles: [":host{flex:1;display:flex;justify-content:flex-end;align-items:center}.legend-wrap{display:inline-block}.legend-wrap ul,.legend-wrap li{padding:0;margin:0;list-style:none}.legend-wrap .legend-labels{display:flex}.legend-wrap .legend-label{display:flex;align-items:center;cursor:pointer;justify-content:center}.legend-wrap .legend-label:not(:last-child){margin-right:12px}.legend-wrap .forbid{cursor:no-drop}.legend-wrap .label-name{font-size:12px;color:rgb(var(--aui-color-secondary-text))}.legend-wrap .label-symbol{margin-right:4px}.disable .label-symbol{background:rgb(var(--aui-color-n-6))!important}.disable .label-name{color:rgb(var(--aui-color-n-6))}.symbol-square{width:12px;height:12px;display:inline-block}.symbol-line{width:12px;height:2px;display:inline-block}.symbol-circle{width:6px;height:6px;border-radius:50%;display:inline-block}.operation{display:flex;justify-content:center;align-items:center;margin-left:8px}.select-all ::ng-deep .aui-checkbox{font-size:12px;line-height:16px;margin-bottom:8px}\n"] }]
    }], function () { return [{ type: i0.ChangeDetectorRef }]; }, { symbol: [{
            type: Input
        }], template: [{
            type: Input
        }], mode: [{
            type: Input
        }], translation: [{
            type: Input
        }], leftOperation: [{
            type: Input
        }], leftOperationContext: [{
            type: Input
        }], rightOperation: [{
            type: Input
        }], hideLegend: [{
            type: Input
        }], selectAllOperation: [{
            type: Input
        }], selectAllName: [{
            type: Input
        }], chart: [{
            type: Input
        }], changeLegend: [{
            type: Output
        }] }); })();
//# sourceMappingURL=data:application/json;base64, 