ack-angular/esm2020/components/AckSections.component.mjs

Extra special directives, components, providers and pipes to aide in tackling everyday interface development needs in Angular2

import { ContentChild, Component, Input } from "@angular/core";
import { SectionProvider } from "../providers/AckSections.provider";
import { string } from "./templates/ack-sections.pug";
import * as i0 from "@angular/core";
import * as i1 from "../providers/AckSections.provider";
import * as i2 from "@angular/common";
import * as i3 from "../directives/HtmlHeightModel.directive";
import * as i4 from "../directives/ElementSizeModel.directive";
export class AckSections {
    constructor(SectionProvider, ElementRef) {
        this.SectionProvider = SectionProvider;
        this.ElementRef = ElementRef;
        //clone is more performant in most cases but things duplicate like requests and timers may result
        this.mode = "calculate";
        this.zIndex = 19;
        const elmStyle = ElementRef.nativeElement.style;
        elmStyle.height = "100%";
        elmStyle.display = "block";
    }
}
AckSections.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.4", ngImport: i0, type: AckSections, deps: [{ token: i1.SectionProvider }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
AckSections.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.4", type: AckSections, selector: "ack-sections", inputs: { mode: "mode", zIndex: "zIndex" }, providers: [SectionProvider], queries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true }, { propertyName: "headerWrap", first: true, predicate: ["headerWrap"], descendants: true }, { propertyName: "bodyCell", first: true, predicate: ["bodyCell"], descendants: true }, { propertyName: "leftBodyWrap", first: true, predicate: ["leftBodyWrap"], descendants: true }, { propertyName: "rightBodyWrap", first: true, predicate: ["rightBodyWrap"], descendants: true }], ngImport: i0, template: "<ng-container [(htmlHeightModel)]=\"htmlHeightModel\"></ng-container><ng-container *ngIf=\"SectionProvider.headerTemplates.length\"><div *ngIf=\"mode==='calculate'\" style=\"position:fixed;top:0;width:100%\" [style.z-index]=\"zIndex\" [(elementHeightModel)]=\"headerHeight\" [elementSizeModelWatch]=\"SectionProvider.headerTemplates.length\"><ng-template *ngTemplateOutlet=\"headerWrap || headerContent;context:{outlet:headerContent}\"></ng-template></div><ng-template #headerContent=\"\"><ng-container *ngFor=\"let item of SectionProvider.headerTemplates\"><ng-template *ngTemplateOutlet=\"item\"></ng-template></ng-container></ng-template><div *ngIf=\"!mode || mode==='clone'\" style=\"position:fixed;top:0;width:100%\" [style.z-index]=\"zIndex\"><ng-template *ngTemplateOutlet=\"headerContent\"></ng-template></div></ng-container><ng-template *ngTemplateOutlet=\"table || defaultTableTag;context:{outlet:tableRows}\"></ng-template><ng-template #defaultTableTag=\"\"><table style=\"height:100%;width:100%;border-collapse: collapse;\" cellPadding=\"0\" cellSpacing=\"0\" border=\"0\"><ng-template *ngTemplateOutlet=\"tableRows\"></ng-template></table></ng-template><ng-template #tableRows=\"\"><tr *ngIf=\"SectionProvider.headerTemplates.length\"><td colspan=\"3\" [style.height.px]=\"headerHeight\" style=\"visibility:hidden\"><ng-container *ngIf=\"!mode || mode==='clone'\"><ng-container *ngFor=\"let item of SectionProvider.headerTemplates\"><ng-template *ngTemplateOutlet=\"item\"></ng-template></ng-container></ng-container></td></tr><tr><td *ngIf=\"SectionProvider.leftBodyTemplates.length\" [style.min-width.px]=\"leftBodyWidth\" valign=\"top\" align=\"right\"><ng-template #defaultLeftBodyWrap=\"\"><div style=\"overflow:auto;height:100%;\"><ng-template *ngTemplateOutlet=\"leftBodyContent\"></ng-template></div></ng-template><ng-template #leftBodyContent=\"\"><ng-container *ngFor=\"let item of SectionProvider.leftBodyTemplates\"><ng-template *ngTemplateOutlet=\"item\"></ng-template></ng-container></ng-template><div *ngIf=\"mode==='calculate'\" style=\"position:fixed;\" [style.z-index]=\"zIndex - 1\" [style.height.px]=\"htmlHeightModel - (SectionProvider.headerTemplates.length ? headerHeight : 0) - (SectionProvider.footerTemplates.length ? footerHeight : 0)\" [(elementWidthModel)]=\"leftBodyWidth\" [elementSizeModelWatch]=\"SectionProvider.leftBodyTemplates.length\"><ng-template *ngTemplateOutlet=\"leftBodyWrap || defaultLeftBodyWrap;context:{outlet:leftBodyContent}\"></ng-template></div><div *ngIf=\"!mode || mode==='clone'\" style=\"position:fixed;top:0;\" [style.z-index]=\"zIndex - 1\"><ng-template *ngTemplateOutlet=\"leftBodyWrap || defaultLeftBodyWrap;context:{outlet:leftBodyContent}\"></ng-template></div><ng-container *ngIf=\"!mode || mode==='clone'\"><ng-template *ngTemplateOutlet=\"leftBodyWrap || defaultLeftBodyWrap;context:{outlet:leftBodyContent}\"></ng-template></ng-container></td><ng-container *ngTemplateOutlet=\"bodyCell || defaultBodyCell;context:{outlet:body}\"></ng-container><ng-template #defaultBodyCell=\"\"><td style=\"height:100%\" valign=\"top\"><ng-template *ngTemplateOutlet=\"body\"></ng-template></td></ng-template><ng-template #body=\"\"><ng-content></ng-content></ng-template><td *ngIf=\"SectionProvider.rightBodyTemplates.length\" [style.min-width.px]=\"rightBodyWidth\" valign=\"top\" align=\"left\"><ng-template #defaultRightBodyWrap=\"\"><div style=\"overflow:auto;height:100%;\"><ng-template *ngTemplateOutlet=\"rightBodyContent\"></ng-template></div></ng-template><ng-template #rightBodyContent=\"\"><ng-container *ngFor=\"let item of SectionProvider.rightBodyTemplates\"><ng-template *ngTemplateOutlet=\"item\"></ng-template></ng-container></ng-template><div *ngIf=\"mode==='calculate'\" style=\"position:fixed;\" [style.z-index]=\"zIndex - 1\" [style.height.px]=\"htmlHeightModel - (SectionProvider.headerTemplates.length ? headerHeight : 0) - (SectionProvider.footerTemplates.length ? footerHeight : 0)\" [(elementWidthModel)]=\"rightBodyWidth\" [elementSizeModelWatch]=\"SectionProvider.rightBodyTemplates.length\"><ng-template *ngTemplateOutlet=\"rightBodyWrap || defaultRightBodyWrap;context:{outlet:rightBodyContent}\"></ng-template></div><div *ngIf=\"!mode || mode==='clone'\" style=\"position:fixed;top:0;overflow:auto;\" [style.z-index]=\"zIndex - 1\"><ng-template *ngTemplateOutlet=\"rightBodyWrap || defaultRightBodyWrap;context:{outlet:rightBodyContent}\"></ng-template></div><ng-container *ngIf=\"!mode || mode==='clone'\"><ng-template *ngTemplateOutlet=\"rightBodyWrap || defaultRightBodyWrap;context:{outlet:rightBodyContent}\"></ng-template></ng-container></td></tr><tr *ngIf=\"SectionProvider.footerTemplates.length\"><td colspan=\"3\" [style.height.px]=\"footerHeight\"><div *ngIf=\"!mode || mode==='clone'\" style=\"visibility:hidden\"><ng-container *ngFor=\"let item of SectionProvider.footerTemplates\"><ng-template *ngTemplateOutlet=\"item\"></ng-template></ng-container></div></td></tr></ng-template><ng-container *ngIf=\"SectionProvider.footerTemplates.length\"><div *ngIf=\"mode==='calculate'\" style=\"position:fixed;bottom:0;width:100%\" [style.z-index]=\"zIndex\" [(elementHeightModel)]=\"footerHeight\" [elementSizeModelWatch]=\"SectionProvider.footerTemplates.length\"><ng-container *ngFor=\"let item of SectionProvider.footerTemplates\"><ng-template *ngTemplateOutlet=\"item\"></ng-template></ng-container></div><div *ngIf=\"!mode || mode==='clone'\" style=\"position:fixed;bottom:0;width:100%\" [style.z-index]=\"zIndex\"><ng-container *ngFor=\"let item of SectionProvider.footerTemplates\"><ng-template *ngTemplateOutlet=\"item\"></ng-template></ng-container></div></ng-container>", isInline: true, dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.HtmlHeightModel, selector: "[htmlHeightModel]", inputs: ["htmlHeightModel"], outputs: ["htmlHeightModelChange"] }, { kind: "directive", type: i4.ElementWidthModel, selector: "[elementWidthModel]", inputs: ["elementWidthModel"], outputs: ["elementWidthModelChange"], exportAs: ["ElementWidthModel"] }, { kind: "directive", type: i4.ElementHeightModel, selector: "[elementHeightModel]", inputs: ["elementHeightModel"], outputs: ["elementHeightModelChange"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.4", ngImport: i0, type: AckSections, decorators: [{
            type: Component,
            args: [{
                    selector: 'ack-sections',
                    template: string,
                    providers: [SectionProvider]
                    //,exportAs:"AckSections"
                }]
        }], ctorParameters: function () { return [{ type: i1.SectionProvider }, { type: i0.ElementRef }]; }, propDecorators: { mode: [{
                type: Input
            }], zIndex: [{
                type: Input
            }], table: [{
                type: ContentChild,
                args: ["table"]
            }], headerWrap: [{
                type: ContentChild,
                args: ["headerWrap"]
            }], bodyCell: [{
                type: ContentChild,
                args: ["bodyCell"]
            }], leftBodyWrap: [{
                type: ContentChild,
                args: ["leftBodyWrap"]
            }], rightBodyWrap: [{
                type: ContentChild,
                args: ["rightBodyWrap"]
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQWNrU2VjdGlvbnMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvQWNrU2VjdGlvbnMuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxZQUFZLEVBRVosU0FBUyxFQUNULEtBQUssRUFJTixNQUFNLGVBQWUsQ0FBQTtBQUV0QixPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sbUNBQW1DLENBQUE7QUFDbkUsT0FBTyxFQUFFLE1BQU0sRUFBRSxNQUFNLDhCQUE4QixDQUFBOzs7Ozs7QUFPbEQsTUFBTSxPQUFPLFdBQVc7SUF3QnpCLFlBQ1MsZUFBK0IsRUFDL0IsVUFBcUI7UUFEckIsb0JBQWUsR0FBZixlQUFlLENBQWdCO1FBQy9CLGVBQVUsR0FBVixVQUFVLENBQVc7UUF6QjlCLGlHQUFpRztRQUN4RixTQUFJLEdBQXVCLFdBQVcsQ0FBQTtRQUV0QyxXQUFNLEdBQVUsRUFBRSxDQUFBO1FBd0J6QixNQUFNLFFBQVEsR0FBRyxVQUFVLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQTtRQUUvQyxRQUFRLENBQUMsTUFBTSxHQUFJLE1BQU0sQ0FBQTtRQUN6QixRQUFRLENBQUMsT0FBTyxHQUFHLE9BQU8sQ0FBQTtJQUM1QixDQUFDOzt3R0FoQ2EsV0FBVzs0RkFBWCxXQUFXLG1GQUZmLENBQUUsZUFBZSxDQUFFOzJGQUVmLFdBQVc7a0JBTDFCLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFDLGNBQWM7b0JBQ3ZCLFFBQVEsRUFBQyxNQUFNO29CQUNmLFNBQVMsRUFBQyxDQUFFLGVBQWUsQ0FBRTtvQkFDN0IseUJBQXlCO2lCQUMxQjsrSEFFVSxJQUFJO3NCQUFaLEtBQUs7Z0JBRUcsTUFBTTtzQkFBZCxLQUFLO2dCQUVpQixLQUFLO3NCQUEzQixZQUFZO3VCQUFDLE9BQU87Z0JBQ08sVUFBVTtzQkFBckMsWUFBWTt1QkFBQyxZQUFZO2dCQUNBLFFBQVE7c0JBQWpDLFlBQVk7dUJBQUMsVUFBVTtnQkFDTSxZQUFZO3NCQUF6QyxZQUFZO3VCQUFDLGNBQWM7Z0JBQ0csYUFBYTtzQkFBM0MsWUFBWTt1QkFBQyxlQUFlIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29udGVudENoaWxkLFxuXG4gIENvbXBvbmVudCxcbiAgSW5wdXQsXG4gIEVsZW1lbnRSZWYsXG5cbiAgVGVtcGxhdGVSZWZcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIlxuXG5pbXBvcnQgeyBTZWN0aW9uUHJvdmlkZXIgfSBmcm9tIFwiLi4vcHJvdmlkZXJzL0Fja1NlY3Rpb25zLnByb3ZpZGVyXCJcbmltcG9ydCB7IHN0cmluZyB9IGZyb20gXCIuL3RlbXBsYXRlcy9hY2stc2VjdGlvbnMucHVnXCJcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOidhY2stc2VjdGlvbnMnLFxuICB0ZW1wbGF0ZTpzdHJpbmcsXG4gIHByb3ZpZGVyczpbIFNlY3Rpb25Qcm92aWRlciBdXG4gIC8vLGV4cG9ydEFzOlwiQWNrU2VjdGlvbnNcIlxufSkgZXhwb3J0IGNsYXNzIEFja1NlY3Rpb25ze1xuICAvL2Nsb25lIGlzIG1vcmUgcGVyZm9ybWFudCBpbiBtb3N0IGNhc2VzIGJ1dCB0aGluZ3MgZHVwbGljYXRlIGxpa2UgcmVxdWVzdHMgYW5kIHRpbWVycyBtYXkgcmVzdWx0XG4gIEBJbnB1dCgpIG1vZGU6XCJjYWxjdWxhdGVcInxcImNsb25lXCIgPSBcImNhbGN1bGF0ZVwiXG5cbiAgQElucHV0KCkgekluZGV4Om51bWJlciA9IDE5XG5cbiAgQENvbnRlbnRDaGlsZChcInRhYmxlXCIpIHRhYmxlITogVGVtcGxhdGVSZWY8YW55PlxuICBAQ29udGVudENoaWxkKFwiaGVhZGVyV3JhcFwiKSBoZWFkZXJXcmFwITogVGVtcGxhdGVSZWY8YW55PlxuICBAQ29udGVudENoaWxkKFwiYm9keUNlbGxcIikgYm9keUNlbGwhOiBUZW1wbGF0ZVJlZjxhbnk+XG4gIEBDb250ZW50Q2hpbGQoXCJsZWZ0Qm9keVdyYXBcIikgbGVmdEJvZHlXcmFwITogVGVtcGxhdGVSZWY8YW55PlxuICBAQ29udGVudENoaWxkKFwicmlnaHRCb2R5V3JhcFwiKSByaWdodEJvZHlXcmFwITogVGVtcGxhdGVSZWY8YW55PlxuXG4gIC8vQENvbnRlbnRDaGlsZChcImhlYWRlclwiKSBoZWFkZXI6VGVtcGxhdGVSZWY8YW55PlxuICAvL0BDb250ZW50Q2hpbGQoXCJmb290ZXJcIikgZm9vdGVyOlRlbXBsYXRlUmVmPGFueT5cbiAgLy9AQ29udGVudENoaWxkKFwibGVmdEJvZHlcIikgbGVmdEJvZHk6VGVtcGxhdGVSZWY8YW55PlxuICAvL0BDb250ZW50Q2hpbGQoXCJyaWdodEJvZHlcIikgcmlnaHRCb2R5OlRlbXBsYXRlUmVmPGFueT5cblxuICBodG1sSGVpZ2h0TW9kZWwhOiBudW1iZXJcblxuICBoZWFkZXJIZWlnaHQhOiBudW1iZXJcbiAgbGVmdEJvZHlXaWR0aCE6IG51bWJlclxuICBmb290ZXJIZWlnaHQhOiBudW1iZXJcbiAgcmlnaHRCb2R5V2lkdGghOiBudW1iZXJcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwdWJsaWMgU2VjdGlvblByb3ZpZGVyOlNlY3Rpb25Qcm92aWRlcixcbiAgICBwdWJsaWMgRWxlbWVudFJlZjpFbGVtZW50UmVmXG4gICl7XG4gICAgY29uc3QgZWxtU3R5bGUgPSBFbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQuc3R5bGVcblxuICAgIGVsbVN0eWxlLmhlaWdodCAgPSBcIjEwMCVcIlxuICAgIGVsbVN0eWxlLmRpc3BsYXkgPSBcImJsb2NrXCJcbiAgfVxufSJdfQ==