@qius.solutions/parallel-ui-angular 1.0.0

package/fesm2015/qius.solutions-parallel-ui-angular-virtualscroller.mjs

@@ -0,0 +1,157 @@
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, ContentChild, ContentChildren, ViewChild, Output, NgModule } from '@angular/core';
+import * as i2 from '@qius.solutions/parallel-ui-angular/api';
+import { Header, Footer, QiusTemplate, SharedModule } from '@qius.solutions/parallel-ui-angular/api';
+import * as i3 from '@qius.solutions/parallel-ui-angular/scroller';
+import { ScrollerModule } from '@qius.solutions/parallel-ui-angular/scroller';
+
+class VirtualScroller {
+    constructor(el, cd) {
+        this.el = el;
+        this.cd = cd;
+        this.delay = 250;
+        this.onLazyLoad = new EventEmitter();
+    }
+    ngAfterContentInit() {
+        this.templates.forEach((item) => {
+            switch (item.getType()) {
+                case 'item':
+                    this.itemTemplate = item.template;
+                    break;
+                case 'loadingItem':
+                    this.loadingItemTemplate = item.template;
+                    break;
+                case 'header':
+                    this.headerTemplate = item.template;
+                    break;
+                case 'footer':
+                    this.footerTemplate = item.template;
+                    break;
+                default:
+                    this.itemTemplate = item.template;
+                    break;
+            }
+        });
+    }
+    onLazyItemLoad(event) {
+        if (this.virtualScrollTimeout) {
+            clearTimeout(this.virtualScrollTimeout);
+        }
+        this.virtualScrollTimeout = setTimeout(() => {
+            this.onLazyLoad.emit(Object.assign(Object.assign({}, event), { rows: event.last - event.first, forceUpdate: () => this.cd.detectChanges() }));
+        }, this.delay);
+    }
+    getBlockableElement() {
+        return this.el.nativeElement.children[0];
+    }
+    scrollToIndex(index, mode) {
+        var _a;
+        (_a = this.scroller) === null || _a === void 0 ? void 0 : _a.scrollToIndex(index, mode);
+    }
+}
+VirtualScroller.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: VirtualScroller, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+VirtualScroller.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: VirtualScroller, selector: "p-virtualScroller", inputs: { value: "value", itemSize: "itemSize", style: "style", styleClass: "styleClass", scrollHeight: "scrollHeight", lazy: "lazy", options: "options", delay: "delay" }, outputs: { onLazyLoad: "onLazyLoad" }, host: { classAttribute: "p-element" }, queries: [{ propertyName: "header", first: true, predicate: Header, descendants: true }, { propertyName: "footer", first: true, predicate: Footer, descendants: true }, { propertyName: "templates", predicate: QiusTemplate }], viewQueries: [{ propertyName: "scroller", first: true, predicate: ["scroller"], descendants: true }], ngImport: i0, template: `
+        <div [ngClass]="'p-virtualscroller p-component'" [ngStyle]="style" [class]="styleClass">
+            <div class="p-virtualscroller-header" *ngIf="header || headerTemplate">
+                <ng-content select="p-header"></ng-content>
+                <ng-container *ngTemplateOutlet="headerTemplate"></ng-container>
+            </div>
+            <div #content class="p-virtualscroller-content">
+                <p-scroller #scroller [items]="value" styleClass="p-virtualscroller-list" [style]="{ height: scrollHeight }" [itemSize]="itemSize" [lazy]="lazy" (onLazyLoad)="onLazyItemLoad($event)" [options]="options">
+                    <ng-template pTemplate="item" let-item let-scrollerOptions="options">
+                        <div [ngStyle]="{ height: itemSize + 'px' }" class="p-virtualscroller-item">
+                            <ng-container *ngTemplateOutlet="item ? itemTemplate : loadingItemTemplate; context: { $implicit: item, options: scrollerOptions }"></ng-container>
+                        </div>
+                    </ng-template>
+                </p-scroller>
+            </div>
+            <div class="p-virtualscroller-footer" *ngIf="footer || footerTemplate">
+                <ng-content select="p-footer"></ng-content>
+                <ng-container *ngTemplateOutlet="footerTemplate"></ng-container>
+            </div>
+        </div>
+    `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.QiusTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i3.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: VirtualScroller, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-virtualScroller',
+                    template: `
+        <div [ngClass]="'p-virtualscroller p-component'" [ngStyle]="style" [class]="styleClass">
+            <div class="p-virtualscroller-header" *ngIf="header || headerTemplate">
+                <ng-content select="p-header"></ng-content>
+                <ng-container *ngTemplateOutlet="headerTemplate"></ng-container>
+            </div>
+            <div #content class="p-virtualscroller-content">
+                <p-scroller #scroller [items]="value" styleClass="p-virtualscroller-list" [style]="{ height: scrollHeight }" [itemSize]="itemSize" [lazy]="lazy" (onLazyLoad)="onLazyItemLoad($event)" [options]="options">
+                    <ng-template pTemplate="item" let-item let-scrollerOptions="options">
+                        <div [ngStyle]="{ height: itemSize + 'px' }" class="p-virtualscroller-item">
+                            <ng-container *ngTemplateOutlet="item ? itemTemplate : loadingItemTemplate; context: { $implicit: item, options: scrollerOptions }"></ng-container>
+                        </div>
+                    </ng-template>
+                </p-scroller>
+            </div>
+            <div class="p-virtualscroller-footer" *ngIf="footer || footerTemplate">
+                <ng-content select="p-footer"></ng-content>
+                <ng-container *ngTemplateOutlet="footerTemplate"></ng-container>
+            </div>
+        </div>
+    `,
+                    changeDetection: ChangeDetectionStrategy.Default,
+                    encapsulation: ViewEncapsulation.None,
+                    host: {
+                        class: 'p-element'
+                    }
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { value: [{
+                type: Input
+            }], itemSize: [{
+                type: Input
+            }], style: [{
+                type: Input
+            }], styleClass: [{
+                type: Input
+            }], scrollHeight: [{
+                type: Input
+            }], lazy: [{
+                type: Input
+            }], options: [{
+                type: Input
+            }], delay: [{
+                type: Input
+            }], header: [{
+                type: ContentChild,
+                args: [Header]
+            }], footer: [{
+                type: ContentChild,
+                args: [Footer]
+            }], templates: [{
+                type: ContentChildren,
+                args: [QiusTemplate]
+            }], scroller: [{
+                type: ViewChild,
+                args: ['scroller']
+            }], onLazyLoad: [{
+                type: Output
+            }] } });
+class VirtualScrollerModule {
+}
+VirtualScrollerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: VirtualScrollerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+VirtualScrollerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: VirtualScrollerModule, declarations: [VirtualScroller], imports: [CommonModule, SharedModule, ScrollerModule], exports: [VirtualScroller, SharedModule, ScrollerModule] });
+VirtualScrollerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: VirtualScrollerModule, imports: [CommonModule, SharedModule, ScrollerModule, SharedModule, ScrollerModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: VirtualScrollerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, SharedModule, ScrollerModule],
+                    exports: [VirtualScroller, SharedModule, ScrollerModule],
+                    declarations: [VirtualScroller]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { VirtualScroller, VirtualScrollerModule };
+//# sourceMappingURL=qius.solutions-parallel-ui-angular-virtualscroller.mjs.map

package/fesm2015/qius.solutions-parallel-ui-angular-virtualscroller.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"qius.solutions-parallel-ui-angular-virtualscroller.mjs","sources":["../../src/app/components/virtualscroller/virtualscroller.ts","../../src/app/components/virtualscroller/qius.solutions-parallel-ui-angular-virtualscroller.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { AfterContentInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, ContentChildren, ElementRef, EventEmitter, Input, NgModule, Output, QueryList, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core';\nimport { BlockableUI, Footer, Header, QiusTemplate, SharedModule } from '@qius.solutions/parallel-ui-angular/api';\nimport { Scroller, ScrollerModule, ScrollerOptions } from '@qius.solutions/parallel-ui-angular/scroller';\n\n@Component({\n    selector: 'p-virtualScroller',\n    template: `\n        <div [ngClass]=\"'p-virtualscroller p-component'\" [ngStyle]=\"style\" [class]=\"styleClass\">\n            <div class=\"p-virtualscroller-header\" *ngIf=\"header || headerTemplate\">\n                <ng-content select=\"p-header\"></ng-content>\n                <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n            </div>\n            <div #content class=\"p-virtualscroller-content\">\n                <p-scroller #scroller [items]=\"value\" styleClass=\"p-virtualscroller-list\" [style]=\"{ height: scrollHeight }\" [itemSize]=\"itemSize\" [lazy]=\"lazy\" (onLazyLoad)=\"onLazyItemLoad($event)\" [options]=\"options\">\n                    <ng-template pTemplate=\"item\" let-item let-scrollerOptions=\"options\">\n                        <div [ngStyle]=\"{ height: itemSize + 'px' }\" class=\"p-virtualscroller-item\">\n                            <ng-container *ngTemplateOutlet=\"item ? itemTemplate : loadingItemTemplate; context: { $implicit: item, options: scrollerOptions }\"></ng-container>\n                        </div>\n                    </ng-template>\n                </p-scroller>\n            </div>\n            <div class=\"p-virtualscroller-footer\" *ngIf=\"footer || footerTemplate\">\n                <ng-content select=\"p-footer\"></ng-content>\n                <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n            </div>\n        </div>\n    `,\n    changeDetection: ChangeDetectionStrategy.Default,\n    encapsulation: ViewEncapsulation.None,\n    host: {\n        class: 'p-element'\n    }\n})\nexport class VirtualScroller implements AfterContentInit, BlockableUI {\n    @Input() value: any[];\n\n    @Input() itemSize: number;\n\n    @Input() style: any;\n\n    @Input() styleClass: string;\n\n    @Input() scrollHeight: any;\n\n    @Input() lazy: boolean;\n\n    @Input() options: ScrollerOptions;\n\n    @Input() delay: number = 250;\n\n    @ContentChild(Header) header: Header;\n\n    @ContentChild(Footer) footer: Footer;\n\n    @ContentChildren(QiusTemplate) templates: QueryList<any>;\n\n    @ViewChild('scroller') scroller: Scroller;\n\n    @Output() onLazyLoad: EventEmitter<any> = new EventEmitter();\n\n    itemTemplate: TemplateRef<any>;\n\n    headerTemplate: TemplateRef<any>;\n\n    footerTemplate: TemplateRef<any>;\n\n    loadingItemTemplate: TemplateRef<any>;\n\n    virtualScrollTimeout: any;\n\n    constructor(public el: ElementRef, public cd: ChangeDetectorRef) {}\n\n    ngAfterContentInit() {\n        this.templates.forEach((item) => {\n            switch (item.getType()) {\n                case 'item':\n                    this.itemTemplate = item.template;\n                    break;\n\n                case 'loadingItem':\n                    this.loadingItemTemplate = item.template;\n                    break;\n\n                case 'header':\n                    this.headerTemplate = item.template;\n                    break;\n\n                case 'footer':\n                    this.footerTemplate = item.template;\n                    break;\n\n                default:\n                    this.itemTemplate = item.template;\n                    break;\n            }\n        });\n    }\n\n    onLazyItemLoad(event) {\n        if (this.virtualScrollTimeout) {\n            clearTimeout(this.virtualScrollTimeout);\n        }\n\n        this.virtualScrollTimeout = setTimeout(() => {\n            this.onLazyLoad.emit({\n                ...event,\n                rows: event.last - event.first,\n                forceUpdate: () => this.cd.detectChanges()\n            });\n        }, this.delay);\n    }\n\n    getBlockableElement(): HTMLElement {\n        return this.el.nativeElement.children[0];\n    }\n\n    scrollToIndex(index: number, mode?: ScrollBehavior): void {\n        this.scroller?.scrollToIndex(index, mode);\n    }\n}\n\n@NgModule({\n    imports: [CommonModule, SharedModule, ScrollerModule],\n    exports: [VirtualScroller, SharedModule, ScrollerModule],\n    declarations: [VirtualScroller]\n})\nexport class VirtualScrollerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;;;MAkCa,eAAe,CAAA;IAqCxB,WAAmB,CAAA,EAAc,EAAS,EAAqB,EAAA;AAA5C,QAAA,IAAE,CAAA,EAAA,GAAF,EAAE,CAAY;AAAS,QAAA,IAAE,CAAA,EAAA,GAAF,EAAE,CAAmB;AAtBtD,QAAA,IAAK,CAAA,KAAA,GAAW,GAAG,CAAC;AAUnB,QAAA,IAAA,CAAA,UAAU,GAAsB,IAAI,YAAY,EAAE,CAAC;KAYM;IAEnE,kBAAkB,GAAA;QACd,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AAC5B,YAAA,QAAQ,IAAI,CAAC,OAAO,EAAE;AAClB,gBAAA,KAAK,MAAM;AACP,oBAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC;oBAClC,MAAM;AAEV,gBAAA,KAAK,aAAa;AACd,oBAAA,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,QAAQ,CAAC;oBACzC,MAAM;AAEV,gBAAA,KAAK,QAAQ;AACT,oBAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,QAAQ,CAAC;oBACpC,MAAM;AAEV,gBAAA,KAAK,QAAQ;AACT,oBAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,QAAQ,CAAC;oBACpC,MAAM;AAEV,gBAAA;AACI,oBAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC;oBAClC,MAAM;AACb,aAAA;AACL,SAAC,CAAC,CAAC;KACN;AAED,IAAA,cAAc,CAAC,KAAK,EAAA;QAChB,IAAI,IAAI,CAAC,oBAAoB,EAAE;AAC3B,YAAA,YAAY,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;AAC3C,SAAA;AAED,QAAA,IAAI,CAAC,oBAAoB,GAAG,UAAU,CAAC,MAAK;AACxC,YAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CACb,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,KAAK,CACR,EAAA,EAAA,IAAI,EAAE,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC,KAAK,EAC9B,WAAW,EAAE,MAAM,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE,IAC5C,CAAC;AACP,SAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;KAClB;IAED,mBAAmB,GAAA;QACf,OAAO,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;KAC5C;IAED,aAAa,CAAC,KAAa,EAAE,IAAqB,EAAA;;QAC9C,CAAA,EAAA,GAAA,IAAI,CAAC,QAAQ,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,aAAa,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;KAC7C;;6GArFQ,eAAe,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAf,eAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,eAAe,uVAiBV,MAAM,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,QAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAEN,MAAM,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,WAAA,EAAA,SAAA,EAEH,YAAY,EAhDnB,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,UAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;;;;;;;;;;;;;;;;;;KAoBT,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,QAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,IAAA,EAAA,OAAA,EAAA,YAAA,EAAA,UAAA,EAAA,OAAA,EAAA,UAAA,EAAA,cAAA,EAAA,aAAA,EAAA,aAAA,EAAA,MAAA,EAAA,OAAA,EAAA,aAAA,EAAA,YAAA,EAAA,QAAA,EAAA,MAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,SAAA,EAAA,YAAA,EAAA,YAAA,EAAA,mBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,YAAA,EAAA,UAAA,EAAA,qBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,OAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;4FAOQ,eAAe,EAAA,UAAA,EAAA,CAAA;kBA7B3B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,mBAAmB;AAC7B,oBAAA,QAAQ,EAAE,CAAA;;;;;;;;;;;;;;;;;;;;AAoBT,IAAA,CAAA;oBACD,eAAe,EAAE,uBAAuB,CAAC,OAAO;oBAChD,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACrC,oBAAA,IAAI,EAAE;AACF,wBAAA,KAAK,EAAE,WAAW;AACrB,qBAAA;iBACJ,CAAA;iIAEY,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAEG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBAEG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAEG,UAAU,EAAA,CAAA;sBAAlB,KAAK;gBAEG,YAAY,EAAA,CAAA;sBAApB,KAAK;gBAEG,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBAEG,OAAO,EAAA,CAAA;sBAAf,KAAK;gBAEG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAEgB,MAAM,EAAA,CAAA;sBAA3B,YAAY;uBAAC,MAAM,CAAA;gBAEE,MAAM,EAAA,CAAA;sBAA3B,YAAY;uBAAC,MAAM,CAAA;gBAEW,SAAS,EAAA,CAAA;sBAAvC,eAAe;uBAAC,YAAY,CAAA;gBAEN,QAAQ,EAAA,CAAA;sBAA9B,SAAS;uBAAC,UAAU,CAAA;gBAEX,UAAU,EAAA,CAAA;sBAAnB,MAAM;;MAoEE,qBAAqB,CAAA;;mHAArB,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAArB,qBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,EA7FrB,YAAA,EAAA,CAAA,eAAe,CAyFd,EAAA,OAAA,EAAA,CAAA,YAAY,EAAE,YAAY,EAAE,cAAc,CAzF3C,EAAA,OAAA,EAAA,CAAA,eAAe,EA0FG,YAAY,EAAE,cAAc,CAAA,EAAA,CAAA,CAAA;oHAG9C,qBAAqB,EAAA,OAAA,EAAA,CAJpB,YAAY,EAAE,YAAY,EAAE,cAAc,EACzB,YAAY,EAAE,cAAc,CAAA,EAAA,CAAA,CAAA;4FAG9C,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBALjC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,YAAY,EAAE,cAAc,CAAC;AACrD,oBAAA,OAAO,EAAE,CAAC,eAAe,EAAE,YAAY,EAAE,cAAc,CAAC;oBACxD,YAAY,EAAE,CAAC,eAAe,CAAC;iBAClC,CAAA;;;AC9HD;;AAEG;;;;"}

package/fesm2015/qius.solutions-parallel-ui-angular.mjs

@@ -0,0 +1,6 @@
+var public_api = {};
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+//# sourceMappingURL=qius.solutions-parallel-ui-angular.mjs.map

package/fesm2015/qius.solutions-parallel-ui-angular.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"qius.solutions-parallel-ui-angular.mjs","sources":["../../src/app/components/public_api.ts","../../src/app/components/qius.solutions-parallel-ui-angular.ts"],"sourcesContent":["export default {};\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"AAAA,iBAAe,EAAE;;ACAjB;;AAEG"}

package/fesm2020/qius.solutions-parallel-ui-angular-accordion.mjs

@@ -0,0 +1,403 @@
+import { trigger, state, style, transition, animate } from '@angular/animations';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { EventEmitter, forwardRef, Component, ChangeDetectionStrategy, ViewEncapsulation, Inject, Input, Output, ContentChildren, NgModule } from '@angular/core';
+import { Header, QiusTemplate, SharedModule } from '@qius.solutions/parallel-ui-angular/api';
+import { ChevronRightIcon } from '@qius.solutions/parallel-ui-angular/icons/chevronright';
+import { ChevronDownIcon } from '@qius.solutions/parallel-ui-angular/icons/chevrondown';
+
+let idx = 0;
+class AccordionTab {
+    constructor(accordion, changeDetector) {
+        this.changeDetector = changeDetector;
+        this.cache = true;
+        this.selectedChange = new EventEmitter();
+        this.transitionOptions = '400ms cubic-bezier(0.86, 0, 0.07, 1)';
+        this.iconPos = 'start';
+        this.id = `p-accordiontab-${idx++}`;
+        this.accordion = accordion;
+    }
+    get selected() {
+        return this._selected;
+    }
+    set selected(val) {
+        this._selected = val;
+        if (!this.loaded) {
+            if (this._selected && this.cache) {
+                this.loaded = true;
+            }
+            this.changeDetector.detectChanges();
+        }
+    }
+    get iconClass() {
+        if (this.iconPos === 'end') {
+            return 'p-accordion-toggle-icon-end';
+        }
+        else {
+            return 'p-accordion-toggle-icon';
+        }
+    }
+    ngAfterContentInit() {
+        this.templates.forEach((item) => {
+            switch (item.getType()) {
+                case 'content':
+                    this.contentTemplate = item.template;
+                    break;
+                case 'header':
+                    this.headerTemplate = item.template;
+                    break;
+                case 'icon':
+                    this.iconTemplate = item.template;
+                    break;
+                default:
+                    this.contentTemplate = item.template;
+                    break;
+            }
+        });
+    }
+    toggle(event) {
+        if (this.disabled) {
+            return false;
+        }
+        let index = this.findTabIndex();
+        if (this.selected) {
+            this.selected = false;
+            this.accordion.onClose.emit({ originalEvent: event, index: index });
+        }
+        else {
+            if (!this.accordion.multiple) {
+                for (var i = 0; i < this.accordion.tabs.length; i++) {
+                    if (this.accordion.tabs[i].selected) {
+                        this.accordion.tabs[i].selected = false;
+                        this.accordion.tabs[i].selectedChange.emit(false);
+                        this.accordion.tabs[i].changeDetector.markForCheck();
+                    }
+                }
+            }
+            this.selected = true;
+            this.loaded = true;
+            this.accordion.onOpen.emit({ originalEvent: event, index: index });
+        }
+        this.selectedChange.emit(this.selected);
+        this.accordion.updateActiveIndex();
+        this.changeDetector.markForCheck();
+        event.preventDefault();
+    }
+    findTabIndex() {
+        let index = -1;
+        for (var i = 0; i < this.accordion.tabs.length; i++) {
+            if (this.accordion.tabs[i] == this) {
+                index = i;
+                break;
+            }
+        }
+        return index;
+    }
+    get hasHeaderFacet() {
+        return this.headerFacet && this.headerFacet.length > 0;
+    }
+    onKeydown(event) {
+        if (event.which === 32 || event.which === 13) {
+            this.toggle(event);
+            event.preventDefault();
+        }
+    }
+    ngOnDestroy() {
+        this.accordion.tabs.splice(this.findTabIndex(), 1);
+    }
+}
+AccordionTab.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AccordionTab, deps: [{ token: forwardRef(() => Accordion) }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+AccordionTab.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: AccordionTab, selector: "p-accordionTab", inputs: { header: "header", headerStyle: "headerStyle", tabStyle: "tabStyle", contentStyle: "contentStyle", tabStyleClass: "tabStyleClass", headerStyleClass: "headerStyleClass", contentStyleClass: "contentStyleClass", disabled: "disabled", cache: "cache", transitionOptions: "transitionOptions", iconPos: "iconPos", selected: "selected" }, outputs: { selectedChange: "selectedChange" }, host: { classAttribute: "p-element" }, queries: [{ propertyName: "headerFacet", predicate: Header }, { propertyName: "templates", predicate: QiusTemplate }], ngImport: i0, template: `
+        <div class="p-accordion-tab" [class.p-accordion-tab-active]="selected" [ngClass]="tabStyleClass" [ngStyle]="tabStyle">
+            <div class="p-accordion-header" [class.p-highlight]="selected" [class.p-disabled]="disabled">
+                <a
+                    [ngClass]="headerStyleClass"
+                    [style]="headerStyle"
+                    role="tab"
+                    class="p-accordion-header-link"
+                    (click)="toggle($event)"
+                    (keydown)="onKeydown($event)"
+                    [attr.tabindex]="disabled ? null : 0"
+                    [attr.id]="id"
+                    [attr.aria-controls]="id + '-content'"
+                    [attr.aria-expanded]="selected"
+                >
+                    <ng-container *ngIf="!iconTemplate">
+                        <ng-container *ngIf="selected">
+                            <span *ngIf="accordion.collapseIcon" [class]="accordion.collapseIcon" [ngClass]="iconClass"></span>
+                            <ChevronDownIcon *ngIf="!accordion.collapseIcon" [styleClass]="iconClass"/>
+                        </ng-container>
+                        <ng-container *ngIf="!selected">
+                            <span *ngIf="accordion.expandIcon" [class]="accordion.expandIcon" [ngClass]="iconClass"></span>
+                            <ChevronRightIcon *ngIf="!accordion.expandIcon" [styleClass]="iconClass"/>
+                        </ng-container>
+                    </ng-container>
+                    <ng-template *ngTemplateOutlet="iconTemplate; context: { $implicit: selected }"></ng-template>
+                    <span class="p-accordion-header-text" *ngIf="!hasHeaderFacet">
+                        {{ header }}
+                    </span>
+                    <ng-container *ngTemplateOutlet="headerTemplate"></ng-container>
+                    <ng-content select="p-header" *ngIf="hasHeaderFacet"></ng-content>
+                </a>
+            </div>
+            <div
+                [attr.id]="id + '-content'"
+                class="p-toggleable-content"
+                [@tabContent]="selected ? { value: 'visible', params: { transitionParams: transitionOptions } } : { value: 'hidden', params: { transitionParams: transitionOptions } }"
+                role="region"
+                [attr.aria-hidden]="!selected"
+                [attr.aria-labelledby]="id"
+            >
+                <div class="p-accordion-content" [ngClass]="contentStyleClass" [ngStyle]="contentStyle">
+                    <ng-content></ng-content>
+                    <ng-container *ngIf="contentTemplate && (cache ? loaded : selected)">
+                        <ng-container *ngTemplateOutlet="contentTemplate"></ng-container>
+                    </ng-container>
+                </div>
+            </div>
+        </div>
+    `, isInline: true, styles: [".p-accordion-header-link{cursor:pointer;display:flex;align-items:center;-webkit-user-select:none;user-select:none;position:relative;text-decoration:none}.p-accordion-header-link:focus{z-index:1}.p-accordion-header-text{line-height:1}.p-accordion .p-toggleable-content{overflow:hidden}.p-accordion .p-accordion-tab-active>.p-toggleable-content:not(.ng-animating){overflow:inherit}.p-accordion-toggle-icon-end{order:1;margin-left:auto}.p-accordion-toggle-icon{order:0}\n"], dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i1.NgClass; }), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgTemplateOutlet; }), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgStyle; }), selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i0.forwardRef(function () { return ChevronRightIcon; }), selector: "ChevronRightIcon" }, { kind: "component", type: i0.forwardRef(function () { return ChevronDownIcon; }), selector: "ChevronDownIcon" }], animations: [
+        trigger('tabContent', [
+            state('hidden', style({
+                height: '0'
+            })),
+            state('visible', style({
+                height: '*'
+            })),
+            transition('visible <=> hidden', [animate('{{transitionParams}}')]),
+            transition('void => *', animate(0))
+        ])
+    ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AccordionTab, decorators: [{
+            type: Component,
+            args: [{ selector: 'p-accordionTab', template: `
+        <div class="p-accordion-tab" [class.p-accordion-tab-active]="selected" [ngClass]="tabStyleClass" [ngStyle]="tabStyle">
+            <div class="p-accordion-header" [class.p-highlight]="selected" [class.p-disabled]="disabled">
+                <a
+                    [ngClass]="headerStyleClass"
+                    [style]="headerStyle"
+                    role="tab"
+                    class="p-accordion-header-link"
+                    (click)="toggle($event)"
+                    (keydown)="onKeydown($event)"
+                    [attr.tabindex]="disabled ? null : 0"
+                    [attr.id]="id"
+                    [attr.aria-controls]="id + '-content'"
+                    [attr.aria-expanded]="selected"
+                >
+                    <ng-container *ngIf="!iconTemplate">
+                        <ng-container *ngIf="selected">
+                            <span *ngIf="accordion.collapseIcon" [class]="accordion.collapseIcon" [ngClass]="iconClass"></span>
+                            <ChevronDownIcon *ngIf="!accordion.collapseIcon" [styleClass]="iconClass"/>
+                        </ng-container>
+                        <ng-container *ngIf="!selected">
+                            <span *ngIf="accordion.expandIcon" [class]="accordion.expandIcon" [ngClass]="iconClass"></span>
+                            <ChevronRightIcon *ngIf="!accordion.expandIcon" [styleClass]="iconClass"/>
+                        </ng-container>
+                    </ng-container>
+                    <ng-template *ngTemplateOutlet="iconTemplate; context: { $implicit: selected }"></ng-template>
+                    <span class="p-accordion-header-text" *ngIf="!hasHeaderFacet">
+                        {{ header }}
+                    </span>
+                    <ng-container *ngTemplateOutlet="headerTemplate"></ng-container>
+                    <ng-content select="p-header" *ngIf="hasHeaderFacet"></ng-content>
+                </a>
+            </div>
+            <div
+                [attr.id]="id + '-content'"
+                class="p-toggleable-content"
+                [@tabContent]="selected ? { value: 'visible', params: { transitionParams: transitionOptions } } : { value: 'hidden', params: { transitionParams: transitionOptions } }"
+                role="region"
+                [attr.aria-hidden]="!selected"
+                [attr.aria-labelledby]="id"
+            >
+                <div class="p-accordion-content" [ngClass]="contentStyleClass" [ngStyle]="contentStyle">
+                    <ng-content></ng-content>
+                    <ng-container *ngIf="contentTemplate && (cache ? loaded : selected)">
+                        <ng-container *ngTemplateOutlet="contentTemplate"></ng-container>
+                    </ng-container>
+                </div>
+            </div>
+        </div>
+    `, animations: [
+                        trigger('tabContent', [
+                            state('hidden', style({
+                                height: '0'
+                            })),
+                            state('visible', style({
+                                height: '*'
+                            })),
+                            transition('visible <=> hidden', [animate('{{transitionParams}}')]),
+                            transition('void => *', animate(0))
+                        ])
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        class: 'p-element'
+                    }, styles: [".p-accordion-header-link{cursor:pointer;display:flex;align-items:center;-webkit-user-select:none;user-select:none;position:relative;text-decoration:none}.p-accordion-header-link:focus{z-index:1}.p-accordion-header-text{line-height:1}.p-accordion .p-toggleable-content{overflow:hidden}.p-accordion .p-accordion-tab-active>.p-toggleable-content:not(.ng-animating){overflow:inherit}.p-accordion-toggle-icon-end{order:1;margin-left:auto}.p-accordion-toggle-icon{order:0}\n"] }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [forwardRef(() => Accordion)]
+                }] }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { header: [{
+                type: Input
+            }], headerStyle: [{
+                type: Input
+            }], tabStyle: [{
+                type: Input
+            }], contentStyle: [{
+                type: Input
+            }], tabStyleClass: [{
+                type: Input
+            }], headerStyleClass: [{
+                type: Input
+            }], contentStyleClass: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], cache: [{
+                type: Input
+            }], selectedChange: [{
+                type: Output
+            }], transitionOptions: [{
+                type: Input
+            }], iconPos: [{
+                type: Input
+            }], headerFacet: [{
+                type: ContentChildren,
+                args: [Header]
+            }], templates: [{
+                type: ContentChildren,
+                args: [QiusTemplate]
+            }], selected: [{
+                type: Input
+            }] } });
+class Accordion {
+    constructor(el, changeDetector) {
+        this.el = el;
+        this.changeDetector = changeDetector;
+        this.onClose = new EventEmitter();
+        this.onOpen = new EventEmitter();
+        this.activeIndexChange = new EventEmitter();
+        this.tabs = [];
+    }
+    ngAfterContentInit() {
+        this.initTabs();
+        this.tabListSubscription = this.tabList.changes.subscribe((_) => {
+            this.initTabs();
+        });
+    }
+    initTabs() {
+        this.tabs = this.tabList.toArray();
+        this.updateSelectionState();
+        this.changeDetector.markForCheck();
+    }
+    getBlockableElement() {
+        return this.el.nativeElement.children[0];
+    }
+    get activeIndex() {
+        return this._activeIndex;
+    }
+    set activeIndex(val) {
+        this._activeIndex = val;
+        if (this.preventActiveIndexPropagation) {
+            this.preventActiveIndexPropagation = false;
+            return;
+        }
+        this.updateSelectionState();
+    }
+    updateSelectionState() {
+        if (this.tabs && this.tabs.length && this._activeIndex != null) {
+            for (let i = 0; i < this.tabs.length; i++) {
+                let selected = this.multiple ? this._activeIndex.includes(i) : i === this._activeIndex;
+                let changed = selected !== this.tabs[i].selected;
+                if (changed) {
+                    this.tabs[i].selected = selected;
+                    this.tabs[i].selectedChange.emit(selected);
+                    this.tabs[i].changeDetector.markForCheck();
+                }
+            }
+        }
+    }
+    updateActiveIndex() {
+        let index = this.multiple ? [] : null;
+        this.tabs.forEach((tab, i) => {
+            if (tab.selected) {
+                if (this.multiple) {
+                    index.push(i);
+                }
+                else {
+                    index = i;
+                    return;
+                }
+            }
+        });
+        this.preventActiveIndexPropagation = true;
+        this.activeIndexChange.emit(index);
+    }
+    ngOnDestroy() {
+        if (this.tabListSubscription) {
+            this.tabListSubscription.unsubscribe();
+        }
+    }
+}
+Accordion.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: Accordion, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+Accordion.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: Accordion, selector: "p-accordion", inputs: { multiple: "multiple", style: "style", styleClass: "styleClass", expandIcon: "expandIcon", collapseIcon: "collapseIcon", activeIndex: "activeIndex" }, outputs: { onClose: "onClose", onOpen: "onOpen", activeIndexChange: "activeIndexChange" }, host: { classAttribute: "p-element" }, queries: [{ propertyName: "tabList", predicate: AccordionTab }], ngImport: i0, template: `
+        <div [ngClass]="'p-accordion p-component'" [ngStyle]="style" [class]="styleClass" role="tablist">
+            <ng-content></ng-content>
+        </div>
+    `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: Accordion, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-accordion',
+                    template: `
+        <div [ngClass]="'p-accordion p-component'" [ngStyle]="style" [class]="styleClass" role="tablist">
+            <ng-content></ng-content>
+        </div>
+    `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        class: 'p-element'
+                    }
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { multiple: [{
+                type: Input
+            }], onClose: [{
+                type: Output
+            }], onOpen: [{
+                type: Output
+            }], style: [{
+                type: Input
+            }], styleClass: [{
+                type: Input
+            }], expandIcon: [{
+                type: Input
+            }], collapseIcon: [{
+                type: Input
+            }], activeIndexChange: [{
+                type: Output
+            }], tabList: [{
+                type: ContentChildren,
+                args: [AccordionTab]
+            }], activeIndex: [{
+                type: Input
+            }] } });
+class AccordionModule {
+}
+AccordionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AccordionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+AccordionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: AccordionModule, declarations: [Accordion, AccordionTab], imports: [CommonModule, ChevronRightIcon, ChevronDownIcon], exports: [Accordion, AccordionTab, SharedModule] });
+AccordionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AccordionModule, imports: [CommonModule, ChevronRightIcon, ChevronDownIcon, SharedModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AccordionModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, ChevronRightIcon, ChevronDownIcon],
+                    exports: [Accordion, AccordionTab, SharedModule],
+                    declarations: [Accordion, AccordionTab]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Accordion, AccordionModule, AccordionTab };
+//# sourceMappingURL=qius.solutions-parallel-ui-angular-accordion.mjs.map