@ux-aspects/ux-aspects
Version:
Open source user interface framework for building modern, responsive, mobile big data applications
45 lines • 7.3 kB
JavaScript
import { Directive, ElementRef, inject, Renderer2 } from '@angular/core';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { ResizeService } from '../../../directives/resize';
import { RESIZABLE_TABLE_SERVICE_TOKEN } from './resizable-table-service.token';
import * as i0 from "@angular/core";
export class BaseResizableTableDirective {
constructor() {
this._table = inject(RESIZABLE_TABLE_SERVICE_TOKEN);
this._elementRef = inject(ElementRef);
this._renderer = inject(Renderer2);
this.resize = inject(ResizeService);
/** Unsubscribe from the observables */
this._onDestroy = new Subject();
/** Store the initialised state of the table */
this._initialised = false;
// watch for the table being resized
this.resize.addResizeListener(this._elementRef.nativeElement).pipe(takeUntil(this._onDestroy)).subscribe(() => {
// store the latest table size
this._table.tableWidth = this.getScrollWidth();
// run the initial logic if the table is fully visible
this.onTableReady();
});
}
/** Cleanup after the component is destroyed */
ngOnDestroy() {
this._onDestroy.next();
this._onDestroy.complete();
}
/** Set all resizable columns to the same width */
setUniformWidths() {
this._table.setUniformWidths();
}
/** Get the smallest tbody width taking into account scrollbars (uxFixedHeaderTable) */
getScrollWidth() {
return Array.from(this._elementRef.nativeElement.tBodies)
.reduce((width, tbody) => Math.min(width, tbody.scrollWidth), this._elementRef.nativeElement.offsetWidth);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: BaseResizableTableDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.12", type: BaseResizableTableDirective, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: BaseResizableTableDirective, decorators: [{
type: Directive
}], ctorParameters: () => [] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmVzaXphYmxlLXRhYmxlLWJhc2UuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdGFibGUvdGFibGUtY29sdW1uLXJlc2l6ZS9yZXNpemFibGUtdGFibGUtYmFzZS5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxVQUFVLEVBQUUsTUFBTSxFQUF3QixTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDL0YsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUMvQixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDM0MsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLDRCQUE0QixDQUFDO0FBRTNELE9BQU8sRUFBRSw2QkFBNkIsRUFBRSxNQUFNLGlDQUFpQyxDQUFDOztBQUdoRixNQUFNLE9BQWdCLDJCQUEyQjtJQWlCN0M7UUFoQm1CLFdBQU0sR0FBRyxNQUFNLENBQUMsNkJBQTZCLENBQUMsQ0FBQztRQUUvQyxnQkFBVyxHQUFHLE1BQU0sQ0FBK0IsVUFBVSxDQUFDLENBQUM7UUFFL0QsY0FBUyxHQUFHLE1BQU0sQ0FBQyxTQUFTLENBQUMsQ0FBQztRQUV4QyxXQUFNLEdBQUcsTUFBTSxDQUFDLGFBQWEsQ0FBQyxDQUFDO1FBSXhDLHVDQUF1QztRQUM3QixlQUFVLEdBQUcsSUFBSSxPQUFPLEVBQVEsQ0FBQztRQUUzQywrQ0FBK0M7UUFDckMsaUJBQVksR0FBWSxLQUFLLENBQUM7UUFHcEMsb0NBQW9DO1FBQ3BDLElBQUksQ0FBQyxNQUFNLENBQUMsaUJBQWlCLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxhQUFhLENBQUMsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxHQUFHLEVBQUU7WUFDMUcsOEJBQThCO1lBQzlCLElBQUksQ0FBQyxNQUFNLENBQUMsVUFBVSxHQUFHLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztZQUUvQyxzREFBc0Q7WUFDdEQsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO1FBQ3hCLENBQUMsQ0FBQyxDQUFDO0lBQ1AsQ0FBQztJQUVELCtDQUErQztJQUMvQyxXQUFXO1FBQ1AsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLEVBQUUsQ0FBQztRQUN2QixJQUFJLENBQUMsVUFBVSxDQUFDLFFBQVEsRUFBRSxDQUFDO0lBQy9CLENBQUM7SUFFRCxrREFBa0Q7SUFDbEQsZ0JBQWdCO1FBQ1osSUFBSSxDQUFDLE1BQU0sQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDO0lBQ25DLENBQUM7SUFFRCx1RkFBdUY7SUFDN0UsY0FBYztRQUNwQixPQUFPLEtBQUssQ0FBQyxJQUFJLENBQUUsSUFBSSxDQUFDLFdBQVcsQ0FBQyxhQUFrQyxDQUFDLE9BQU8sQ0FBQzthQUMxRSxNQUFNLENBQUMsQ0FBQyxLQUFLLEVBQUUsS0FBSyxFQUFFLEVBQUUsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsV0FBVyxDQUFDLEVBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxhQUFrQyxDQUFDLFdBQVcsQ0FBQyxDQUFDO0lBQ3hJLENBQUM7K0dBM0NpQiwyQkFBMkI7bUdBQTNCLDJCQUEyQjs7NEZBQTNCLDJCQUEyQjtrQkFEaEQsU0FBUyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgaW5qZWN0LCBPbkRlc3Ryb3ksIFF1ZXJ5TGlzdCwgUmVuZGVyZXIyIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBTdWJqZWN0IH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyB0YWtlVW50aWwgfSBmcm9tICdyeGpzL29wZXJhdG9ycyc7XG5pbXBvcnQgeyBSZXNpemVTZXJ2aWNlIH0gZnJvbSAnLi4vLi4vLi4vZGlyZWN0aXZlcy9yZXNpemUnO1xuaW1wb3J0IHsgUmVzaXphYmxlVGFibGVDb2x1bW5Db21wb25lbnQgfSBmcm9tICcuL3Jlc2l6YWJsZS10YWJsZS1jb2x1bW4uY29tcG9uZW50JztcbmltcG9ydCB7IFJFU0laQUJMRV9UQUJMRV9TRVJWSUNFX1RPS0VOIH0gZnJvbSAnLi9yZXNpemFibGUtdGFibGUtc2VydmljZS50b2tlbic7XG5cbkBEaXJlY3RpdmUoKVxuZXhwb3J0IGFic3RyYWN0IGNsYXNzIEJhc2VSZXNpemFibGVUYWJsZURpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uRGVzdHJveSB7XG4gICAgcHJvdGVjdGVkIHJlYWRvbmx5IF90YWJsZSA9IGluamVjdChSRVNJWkFCTEVfVEFCTEVfU0VSVklDRV9UT0tFTik7XG5cbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgX2VsZW1lbnRSZWYgPSBpbmplY3Q8RWxlbWVudFJlZjxIVE1MVGFibGVFbGVtZW50Pj4oRWxlbWVudFJlZik7XG5cbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgX3JlbmRlcmVyID0gaW5qZWN0KFJlbmRlcmVyMik7XG5cbiAgICByZWFkb25seSByZXNpemUgPSBpbmplY3QoUmVzaXplU2VydmljZSk7XG5cbiAgICBjb2x1bW5zOiBRdWVyeUxpc3Q8UmVzaXphYmxlVGFibGVDb2x1bW5Db21wb25lbnQ+O1xuXG4gICAgLyoqIFVuc3Vic2NyaWJlIGZyb20gdGhlIG9ic2VydmFibGVzICovXG4gICAgcHJvdGVjdGVkIF9vbkRlc3Ryb3kgPSBuZXcgU3ViamVjdDx2b2lkPigpO1xuXG4gICAgLyoqIFN0b3JlIHRoZSBpbml0aWFsaXNlZCBzdGF0ZSBvZiB0aGUgdGFibGUgKi9cbiAgICBwcm90ZWN0ZWQgX2luaXRpYWxpc2VkOiBib29sZWFuID0gZmFsc2U7XG5cbiAgICBjb25zdHJ1Y3RvcigpIHtcbiAgICAgICAgLy8gd2F0Y2ggZm9yIHRoZSB0YWJsZSBiZWluZyByZXNpemVkXG4gICAgICAgIHRoaXMucmVzaXplLmFkZFJlc2l6ZUxpc3RlbmVyKHRoaXMuX2VsZW1lbnRSZWYubmF0aXZlRWxlbWVudCkucGlwZSh0YWtlVW50aWwodGhpcy5fb25EZXN0cm95KSkuc3Vic2NyaWJlKCgpID0+IHtcbiAgICAgICAgICAgIC8vIHN0b3JlIHRoZSBsYXRlc3QgdGFibGUgc2l6ZVxuICAgICAgICAgICAgdGhpcy5fdGFibGUudGFibGVXaWR0aCA9IHRoaXMuZ2V0U2Nyb2xsV2lkdGgoKTtcblxuICAgICAgICAgICAgLy8gcnVuIHRoZSBpbml0aWFsIGxvZ2ljIGlmIHRoZSB0YWJsZSBpcyBmdWxseSB2aXNpYmxlXG4gICAgICAgICAgICB0aGlzLm9uVGFibGVSZWFkeSgpO1xuICAgICAgICB9KTtcbiAgICB9XG5cbiAgICAvKiogQ2xlYW51cCBhZnRlciB0aGUgY29tcG9uZW50IGlzIGRlc3Ryb3llZCAqL1xuICAgIG5nT25EZXN0cm95KCk6IHZvaWQge1xuICAgICAgICB0aGlzLl9vbkRlc3Ryb3kubmV4dCgpO1xuICAgICAgICB0aGlzLl9vbkRlc3Ryb3kuY29tcGxldGUoKTtcbiAgICB9XG5cbiAgICAvKiogU2V0IGFsbCByZXNpemFibGUgY29sdW1ucyB0byB0aGUgc2FtZSB3aWR0aCAqL1xuICAgIHNldFVuaWZvcm1XaWR0aHMoKTogdm9pZCB7XG4gICAgICAgIHRoaXMuX3RhYmxlLnNldFVuaWZvcm1XaWR0aHMoKTtcbiAgICB9XG5cbiAgICAvKiogR2V0IHRoZSBzbWFsbGVzdCB0Ym9keSB3aWR0aCB0YWtpbmcgaW50byBhY2NvdW50IHNjcm9sbGJhcnMgKHV4Rml4ZWRIZWFkZXJUYWJsZSkgKi9cbiAgICBwcm90ZWN0ZWQgZ2V0U2Nyb2xsV2lkdGgoKTogbnVtYmVyIHtcbiAgICAgICAgcmV0dXJuIEFycmF5LmZyb20oKHRoaXMuX2VsZW1lbnRSZWYubmF0aXZlRWxlbWVudCBhcyBIVE1MVGFibGVFbGVtZW50KS50Qm9kaWVzKVxuICAgICAgICAgICAgLnJlZHVjZSgod2lkdGgsIHRib2R5KSA9PiBNYXRoLm1pbih3aWR0aCwgdGJvZHkuc2Nyb2xsV2lkdGgpLCAodGhpcy5fZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50IGFzIEhUTUxUYWJsZUVsZW1lbnQpLm9mZnNldFdpZHRoKTtcbiAgICB9XG5cbiAgICBhYnN0cmFjdCBvblRhYmxlUmVhZHkoKTogdm9pZDtcbn1cbiJdfQ==