@taiga-ui/addon-table
Version:
A library to display tabled data with filters, search, group actions, etc.
110 lines (103 loc) • 5.76 kB
JavaScript
import * as i0 from '@angular/core';
import { signal, computed, Directive, inject, Input } from '@angular/core';
import { NgControl, NgModel } from '@angular/forms';
import { tuiArrayToggle } from '@taiga-ui/cdk/utils/miscellaneous';
import { TuiControl } from '@taiga-ui/cdk/classes';
import { tuiFallbackValueProvider } from '@taiga-ui/cdk/tokens';
class TuiTableControlDirective extends TuiControl {
constructor() {
super(...arguments);
this.children = signal([]);
this.checked = computed(() => !!this.children().length &&
this.children().every((i) => this.value().includes(i.tuiCheckboxRow)));
this.indeterminate = computed(() => !!this.value().length && !this.checked());
}
toggleAll() {
this.onChange(this.checked() ? [] : this.children().map((i) => i.tuiCheckboxRow));
}
process(checkbox) {
this.children.update((children) => tuiArrayToggle(children, checkbox));
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTableControlDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTableControlDirective, isStandalone: true, selector: "[tuiTable][ngModel],[tuiTable][formControl],[tuiTable][formControlName]", providers: [tuiFallbackValueProvider([])], usesInheritance: true, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTableControlDirective, decorators: [{
type: Directive,
args: [{
standalone: true,
selector: '[tuiTable][ngModel],[tuiTable][formControl],[tuiTable][formControlName]',
providers: [tuiFallbackValueProvider([])],
}]
}] });
class TuiCheckboxRowDirective {
constructor() {
this.control = inject(NgControl);
this.parent = inject(TuiTableControlDirective);
this.checked = computed((checked = this.parent
.value()
.includes(this.tuiCheckboxRow)) => {
setTimeout(() => this.control.control?.setValue(checked));
return checked;
});
}
ngOnInit() {
this.parent.process(this);
}
ngOnDestroy() {
this.parent.process(this);
this.parent.onChange(this.parent.value().filter((item) => item !== this.tuiCheckboxRow));
}
onChange() {
this.parent.onChange(tuiArrayToggle(this.parent.value(), this.tuiCheckboxRow));
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiCheckboxRowDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiCheckboxRowDirective, isStandalone: true, selector: "[tuiCheckbox][tuiCheckboxRow]", inputs: { tuiCheckboxRow: "tuiCheckboxRow" }, host: { listeners: { "change": "onChange()" }, properties: { "checked": "checked()" } }, providers: [{ provide: NgControl, useClass: NgModel }], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiCheckboxRowDirective, decorators: [{
type: Directive,
args: [{
standalone: true,
selector: '[tuiCheckbox][tuiCheckboxRow]',
providers: [{ provide: NgControl, useClass: NgModel }],
host: {
'[checked]': 'checked()',
'(change)': 'onChange()',
},
}]
}], propDecorators: { tuiCheckboxRow: [{
type: Input
}] } });
class TuiCheckboxTableDirective {
constructor() {
this.control = inject(NgControl);
this.parent = inject(TuiTableControlDirective);
this.update = computed(() => {
this.control.control?.setValue(this.parent.indeterminate() ? null : this.parent.checked());
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiCheckboxTableDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiCheckboxTableDirective, isStandalone: true, selector: "[tuiCheckbox][tuiCheckboxTable]", host: { listeners: { "change": "parent.toggleAll()" }, properties: { "checked": "parent.checked()", "indeterminate": "parent.indeterminate()" } }, providers: [{ provide: NgControl, useClass: NgModel }], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiCheckboxTableDirective, decorators: [{
type: Directive,
args: [{
standalone: true,
selector: '[tuiCheckbox][tuiCheckboxTable]',
providers: [{ provide: NgControl, useClass: NgModel }],
host: {
'[checked]': 'parent.checked()',
'[indeterminate]': 'parent.indeterminate()',
'(change)': 'parent.toggleAll()',
},
}]
}] });
const TuiTableControl = [
TuiCheckboxRowDirective,
TuiCheckboxTableDirective,
TuiTableControlDirective,
];
/**
* Generated bundle index. Do not edit.
*/
export { TuiCheckboxRowDirective, TuiCheckboxTableDirective, TuiTableControl, TuiTableControlDirective };
//# sourceMappingURL=taiga-ui-addon-table-directives-table-control.mjs.map