// tslint:disable: max-classes-per-file
import { ChangeDetectionStrategy, Component, ContentChild, ContentChildren, Directive, EventEmitter, Injector, Input, Output, TemplateRef, } from '@angular/core';
import { FormGroupDirective, NgForm } from '@angular/forms';
export const rowBackgroundColorFn = ({ invalid, }) => (invalid ? '#fdefef' : '');
export class ArrayFormTableHeaderDirective {
    constructor(templateRef) {
        this.templateRef = templateRef;
    }
}
ArrayFormTableHeaderDirective.decorators = [
    { type: Directive, args: [{
                selector: '[aclArrayFormTableHeader]',
            },] }
];
ArrayFormTableHeaderDirective.ctorParameters = () => [
    { type: TemplateRef }
];
export class ArrayFormTableRowDirective {
    constructor(templateRef) {
        this.templateRef = templateRef;
    }
}
ArrayFormTableRowDirective.decorators = [
    { type: Directive, args: [{
                selector: '[aclArrayFormTableRow]',
            },] }
];
ArrayFormTableRowDirective.ctorParameters = () => [
    { type: TemplateRef }
];
export class ArrayFormTableZeroStateDirective {
    constructor(templateRef) {
        this.templateRef = templateRef;
    }
}
ArrayFormTableZeroStateDirective.decorators = [
    { type: Directive, args: [{
                selector: '[aclArrayFormTableZeroState]',
            },] }
];
ArrayFormTableZeroStateDirective.ctorParameters = () => [
    { type: TemplateRef }
];
export class ArrayFormTableRowControlDirective {
    constructor(templateRef) {
        this.templateRef = templateRef;
    }
}
ArrayFormTableRowControlDirective.decorators = [
    { type: Directive, args: [{
                selector: '[aclArrayFormTableRowControl]',
            },] }
];
ArrayFormTableRowControlDirective.ctorParameters = () => [
    { type: TemplateRef }
];
export class ArrayFormTableFooterDirective {
    constructor(templateRef) {
        this.templateRef = templateRef;
    }
}
ArrayFormTableFooterDirective.decorators = [
    { type: Directive, args: [{
                selector: '[aclArrayFormTableFooter]',
            },] }
];
ArrayFormTableFooterDirective.ctorParameters = () => [
    { type: TemplateRef }
];
const ROW_DEFAULT_COLOR = 'transparent';
export class ArrayFormTableComponent {
    constructor(injector) {
        this.injector = injector;
        this.noRowSeparator = false;
        // 将使用这个值来渲染无数据提示
        this.resourceName = 'data';
        this.add = new EventEmitter();
        this.remove = new EventEmitter(); // Returns the index to be removed
        this.readonly = false;
        this.addDisabled = false;
        this.rowBackgroundColorFn = (_row, _index) => ROW_DEFAULT_COLOR;
        this.minRow = 0;
    }
    getRowBackgroundColor(control) {
        const formDirective = this.injector.get(NgForm, null) ||
            this.injector.get(FormGroupDirective, null);
        // check if control in form, which is most common scene, dummy check AbstractControl is enough
        if (formDirective && 'dirty' in control) {
            return formDirective.submitted || control.dirty
                ? this.rowBackgroundColorFn(control)
                : ROW_DEFAULT_COLOR;
        }
        return this.rowBackgroundColorFn(control);
    }
}
ArrayFormTableComponent.decorators = [
    { type: Component, args: [{
                selector: 'acl-array-form-table',
                template: "<table\n  class=\"acl-array-form-table\"\n  [class.acl-array-form-table--no-row-separator]=\"noRowSeparator\"\n>\n  <thead *ngIf=\"headerTemplate\">\n    <tr>\n      <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n      <th *ngIf=\"!readonly\" class=\"acl-array-form-table__action-col\"></th>\n    </tr>\n  </thead>\n  <tbody>\n    <ng-container *ngFor=\"let row of rows; let index = index\">\n      <ng-container\n        *ngFor=\"let rowTemplate of rowTemplates; let templateIndex = index\"\n      >\n        <tr\n          [style.background-color]=\"getRowBackgroundColor(row)\"\n          [attr.rowtemplateindex]=\"templateIndex\"\n          [class.acl-array-form-table--row-group-start]=\"templateIndex === 0\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"\n              rowTemplate;\n              context: { $implicit: row, index: index }\n            \"\n          ></ng-container>\n          <td\n            *ngIf=\"templateIndex === 0 && !readonly\"\n            class=\"acl-array-form-table__action-col\"\n          >\n            <ng-container *ngIf=\"rows.length > minRow\">\n              <ng-container *ngIf=\"rowControlTemplate\">\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    rowControlTemplate;\n                    context: { $implicit: row, index: index }\n                  \"\n                ></ng-container>\n              </ng-container>\n\n              <button\n                *ngIf=\"!rowControlTemplate\"\n                aui-button=\"text\"\n                size=\"mini\"\n                type=\"button\"\n                [square]=\"true\"\n                [plain]=\"true\"\n                (click)=\"remove.emit(index)\"\n              >\n                <aui-icon icon=\"basic:minus_circle\"></aui-icon>\n              </button>\n            </ng-container>\n          </td>\n        </tr>\n      </ng-container>\n    </ng-container>\n\n    <tr *ngIf=\"!rows || rows.length === 0\">\n      <td colspan=\"100\">\n        <acl-zero-state\n          *ngIf=\"!zeroStateTemplate\"\n          [zeroState]=\"true\"\n          [resourceName]=\"resourceName\"\n        ></acl-zero-state>\n\n        <ng-container *ngIf=\"zeroStateTemplate\">\n          <ng-container *ngTemplateOutlet=\"zeroStateTemplate\"></ng-container>\n        </ng-container>\n      </td>\n    </tr>\n\n    <tr *ngIf=\"!readonly\">\n      <td colspan=\"100\">\n        <div class=\"acl-array-form-table__bottom-control-buttons\">\n          <ng-container *ngIf=\"footerTemplate\">\n            <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n          </ng-container>\n          <button\n            *ngIf=\"!footerTemplate\"\n            aui-button=\"primary\"\n            type=\"button\"\n            size=\"mini\"\n            [plain]=\"true\"\n            (click)=\"add.emit()\"\n            [disabled]=\"addDisabled\"\n          >\n            <aui-icon icon=\"basic:add_circle\"></aui-icon>\n            {{ 'add' | translate }}\n          </button>\n        </div>\n      </td>\n    </tr>\n  </tbody>\n</table>\n",
                // Since rows maybe updated without changing reference, we use Default here:
                // eslint-disable-next-line @angular-eslint/prefer-on-push-component-change-detection
                changeDetection: ChangeDetectionStrategy.Default,
                styles: [":host ::ng-deep .acl-array-form-table{flex:1;width:100%;border-spacing:0;background:#fafafa}:host ::ng-deep .acl-array-form-table th,:host ::ng-deep .acl-array-form-table td{word-break:break-all;vertical-align:top;padding:4px;line-height:24px}:host ::ng-deep .acl-array-form-table th:first-child,:host ::ng-deep .acl-array-form-table td:first-child{padding-left:8px}:host ::ng-deep .acl-array-form-table th:last-child,:host ::ng-deep .acl-array-form-table td:last-child{padding-right:8px}:host ::ng-deep .acl-array-form-table th{height:32px;text-align:left;font-weight:400}:host ::ng-deep .acl-array-form-table th[required]:before{content:\"*\";color:var(--aui-color-error);margin-right:4px}:host ::ng-deep .acl-array-form-table thead{background-color:#f0f0f0}:host ::ng-deep .acl-array-form-table tbody tr:first-of-type>td{padding-top:8px}:host ::ng-deep .acl-array-form-table tbody tr:last-of-type>td{padding-bottom:8px}:host ::ng-deep .acl-array-form-table td.acl-array-form-table__action-col{text-align:right;white-space:nowrap;width:36px;min-width:36px;vertical-align:middle}:host ::ng-deep .acl-array-form-table td.acl-array-form-table__action-col .aui-button--text.isPlain{font-size:16px}:host ::ng-deep .acl-array-form-table td.acl-array-form-table__action-col .aui-button--text.isPlain aui-icon{cursor:inherit}:host ::ng-deep .acl-array-form-table td.acl-array-form-table__action-col .aui-button--text.isPlain:not([disabled]):not(:hover){color:#999}:host ::ng-deep .acl-array-form-table td.acl-array-form-table__action-col .action-col__vertical{display:flex;flex-direction:column;align-items:center;justify-content:center}:host ::ng-deep .acl-array-form-table td.acl-table-form-error-hint{padding-top:0;color:var(--aui-color-error);font-size:12px}:host ::ng-deep .acl-array-form-table__bottom-control-buttons{display:flex;width:100%;border-top:none}:host ::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button{flex:1;border-style:dashed}:host ::ng-deep .acl-array-form-table__bottom-control-buttons .aui-button--default:not(:hover){border-color:#333}:host ::ng-deep .acl-array-form-table:not(.acl-array-form-table--no-row-separator)>tbody>tr.acl-array-form-table--row-group-start:not(:first-of-type) td{border-top:1px dashed #eee}\n"]
            },] }
];
ArrayFormTableComponent.ctorParameters = () => [
    { type: Injector }
];
ArrayFormTableComponent.propDecorators = {
    headerTemplate: [{ type: ContentChild, args: [ArrayFormTableHeaderDirective, {
                    read: TemplateRef,
                    static: true,
                },] }],
    rowTemplates: [{ type: ContentChildren, args: [ArrayFormTableRowDirective, { read: TemplateRef },] }],
    rowControlTemplate: [{ type: ContentChild, args: [ArrayFormTableRowControlDirective, {
                    read: TemplateRef,
                    static: true,
                },] }],
    footerTemplate: [{ type: ContentChild, args: [ArrayFormTableFooterDirective, {
                    read: TemplateRef,
                    static: true,
                },] }],
    zeroStateTemplate: [{ type: ContentChild, args: [ArrayFormTableZeroStateDirective, {
                    read: TemplateRef,
                    static: true,
                },] }],
    rows: [{ type: Input }],
    noRowSeparator: [{ type: Input }],
    resourceName: [{ type: Input }],
    add: [{ type: Output }],
    remove: [{ type: Output }],
    readonly: [{ type: Input }],
    addDisabled: [{ type: Input }],
    rowBackgroundColorFn: [{ type: Input }],
    minRow: [{ type: Input }]
};
//# sourceMappingURL=data:application/json;base64, 