@pepperi-addons/ngx-lib 0.3.15-beta.19 → 0.3.15-beta.21

package/esm2015/side-bar/side-bar.component.js

@@ -1,131 +1,131 @@
-import { Component, Injectable, Input, Output, EventEmitter, ViewChild, ElementRef, Renderer2, } from '@angular/core';
-import { PepLayoutService, PepScreenSizeType, } from '@pepperi-addons/ngx-lib';
-import { pepIconArrowLeft, pepIconArrowRight } from '@pepperi-addons/ngx-lib/icon';
-export class PepSideBarComponent {
-    constructor(hostElement, renderer, layoutService) {
-        this.hostElement = hostElement;
-        this.renderer = renderer;
-        this.layoutService = layoutService;
-        this.ignoreResize = false;
-        this.showHeader = true;
-        this.showFooter = false;
-        this._useAsWebComponent = false;
-        this._animationTime = 350; // milliseconds.
-        this.state = 'open';
-        this.toggleButtonArrowName = pepIconArrowRight.name;
-        this.isLargeScreen = true;
-        this.stateChange = new EventEmitter();
-        this.isMouseIn = false;
-        this.sideBarHeight = '100%';
-        this.PepScreenSizeType = PepScreenSizeType;
-        this.layoutService.onResize$.subscribe((size) => {
-            this.screenSize = size;
-            this.isLargeScreen = size < PepScreenSizeType.MD;
-        });
-    }
-    set useAsWebComponent(value) {
-        if (value) {
-            this.exportFunctionsOnHostElement();
-        }
-    }
-    get useAsWebComponent() {
-        return this._useAsWebComponent;
-    }
-    exportFunctionsOnHostElement() {
-        // This is for web component usage for use those functions.
-        this.hostElement.nativeElement.open = this.open.bind(this);
-        this.hostElement.nativeElement.close = this.close.bind(this);
-    }
-    setState(state) {
-        this.state = state;
-        this.toggleButtonArrowName =
-            // state === 'open' ?
-            // (this.layoutService.isRtl() ? pepIconArrowRight.name : pepIconArrowLeft.name) :
-            (this.layoutService.isRtl() ? pepIconArrowLeft.name : pepIconArrowRight.name);
-    }
-    toggleState() {
-        this.setState(this.state === 'close' ? 'open' : 'close');
-    }
-    ngOnInit() {
-        document.documentElement.style.setProperty(PepSideBarComponent.ONE_MULTI_BY_DIR_KEY, this.layoutService.isRtl() ? '1' : '-1');
-        this.setState(this.isLargeScreen ? 'open' : 'close');
-    }
-    setSideBarHeight(event) {
-        // const from = event.relatedTarget
-        //     ? event.relatedTarget
-        //     : event.fromElement;
-        // const to = event.target ? event.target : event.toElement;
-        // if (typeof from === 'undefined' || typeof to === 'undefined') {
-        //     return;
-        // }
-        // this.isMouseIn = true;
-        // this.sideBarHeight = window.innerHeight - to.offsetTop + 'px';
-    }
-    mouseLeaveSideBar(event) {
-        // const from = event.relatedTarget
-        //     ? event.relatedTarget
-        //     : event.fromElement;
-        // const to = event.target ? event.target : event.toElement;
-        // if (typeof from === 'undefined' || typeof to === 'undefined') {
-        //     return;
-        // }
-        // this.sideBarHeight = '100%';
-        // this.isMouseIn = false;
-    }
-    open() {
-        if (this.sidenav) {
-            this.sidenav.open();
-        }
-        this.state = 'open';
-    }
-    close() {
-        if (this.sidenav) {
-            this.sidenav.close();
-        }
-        this.state = 'close';
-    }
-    toggle() {
-        if (this.sidenav) {
-            // const isOpen = this.sidenav.opened;
-            this.sidenav.toggle();
-        }
-        this.toggleState();
-    }
-    toggleSideWrapper() {
-        this.toggleState();
-        // Raise event after animation finish.
-        setTimeout(() => {
-            this.stateChange.emit({ state: this.state });
-        }, this._animationTime);
-    }
-    toggleSidenav(isOpen) {
-        this.setState(isOpen ? 'open' : 'close');
-        // Raise event after animation finish.
-        setTimeout(() => {
-            this.stateChange.emit({ state: this.state });
-        }, this._animationTime);
-    }
-}
-PepSideBarComponent.ONE_MULTI_BY_DIR_KEY = '--pep-one-multi-by-dir';
-PepSideBarComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'pep-side-bar',
-                template: "<div class=\"pep-side-bar-container\">\n    <ng-container *ngIf=\"isLargeScreen || ignoreResize; then largeScreensBlock; else notLargeScreensBlock\">\n    </ng-container>\n    <ng-template #largeScreensBlock>\n        <div class=\"toggle-side-bar-container\" [ngClass]=\"{ 'is-open-state': state === 'open'}\">\n            <ng-container *ngTemplateOutlet=\"sideLayoutTemplate\"></ng-container>\n            <div class=\"toggle-button-border\"></div>\n            <button mat-button class=\"toggle-button pep-button xs regular icon-button \" (click)=\"toggleSideWrapper()\">\n                <mat-icon>\n                    <pep-icon [name]=\"toggleButtonArrowName\">\n                    </pep-icon>\n                </mat-icon>\n            </button>\n        </div>\n    </ng-template>\n    <ng-template #notLargeScreensBlock>\n        <mat-sidenav-container [hasBackdrop]=\"true\">\n            <mat-sidenav #sidenav mode=\"over\" autoFocus=\"false\" fixedInViewport=\"false\"\n                (openedChange)=\"toggleSidenav($event)\">\n                <ng-container *ngTemplateOutlet=\"sideLayoutTemplate\"></ng-container>\n            </mat-sidenav>\n        </mat-sidenav-container>\n    </ng-template>\n</div>\n\n<ng-template #sideLayoutTemplate>\n    <div class=\"side-layout\">\n        <div *ngIf=\"showHeader\" class=\"header-content\">\n            <div class=\"content pep-border-bottom body-lg ellipsis\">\n                <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n            </div>\n        </div>\n        <div class=\"main-content\">\n            <div class=\"content\">\n                <ng-container *ngTemplateOutlet=\"startContentTemplate\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"filtersTemplate\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"smartFiltersTemplate\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"endContentTemplate\"></ng-container>\n            </div>\n        </div>\n        <div *ngIf=\"showFooter\" class=\"footer-content\">\n            <div class=\"content pep-border-top body-lg ellipsis\">\n                <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n\n<ng-template #headerTemplate>\n    <ng-content select=\"[header-content]\"></ng-content>\n</ng-template>\n\n<ng-template #startContentTemplate>\n    <ng-content select=\"[start-content]\"></ng-content>\n</ng-template>\n\n<ng-template #contentTemplate>\n    <ng-content></ng-content>\n</ng-template>\n\n<ng-template #endContentTemplate>\n    <ng-content select=\"[end-content]\"></ng-content>\n</ng-template>\n\n<ng-template #filtersTemplate>\n\n</ng-template>\n\n<ng-template #smartFiltersTemplate>\n    <ng-content select=\"pep-smart-filters\"></ng-content>\n</ng-template>\n\n<ng-template #footerTemplate>\n    <ng-content select=\"[footer-content]\"></ng-content>\n</ng-template>",
-                styles: [".pep-side-bar-container{height:100%}.pep-side-bar-container .toggle-side-bar-container{height:inherit;display:grid;grid-auto-flow:column;transition:transform .35s ease-out,width .35s ease-out;transform:translateX(calc(var(--pep-one-multi-by-dir) * 16rem));transform:translateX(calc(var(--pep-one-multi-by-dir) * var(--pep-side-bar-width, 16rem)));width:calc((1rem * 2) + 1px);width:calc((var(--pep-spacing-lg, 1rem) * 2) + 1px)}.pep-side-bar-container .toggle-side-bar-container.is-open-state{transition:transform .35s ease-out,width .35s ease-out;transform:unset;width:16rem;width:var(--pep-side-bar-width,16rem)}.pep-side-bar-container .toggle-side-bar-container.is-open-state .toggle-button{transition:margin-inline .35s ease-out,transform .35s ease-out;transform:rotate(180deg);margin-inline:-3rem .25rem}.pep-side-bar-container .toggle-side-bar-container.is-open-state .toggle-button-border{transition:opacity calc(calc(.35s / 3) * 2) ease-out,margin-inline .35s ease-out;opacity:0;margin-inline:-3rem .25rem}.pep-side-bar-container .toggle-side-bar-container .toggle-button{z-index:2;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:calc(calc(1.5rem + .5rem + 2.5rem) - .75rem);margin-top:calc(calc(var(--pep-top-bar-spacing-top, 1.5rem) + var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem)) - .75rem);transition:margin-inline .35s ease-out,transform .35s ease-out;transform:rotate(0deg);margin-inline:calc(-1 * .75rem) .25rem}.pep-side-bar-container .toggle-side-bar-container .toggle-button-border{transition:opacity calc(calc(.35s / 3) * 2) calc(.35s / 3) ease-out,margin-inline .35s ease-out;opacity:1;margin-inline:unset;width:1px;-webkit-padding-start:1rem;padding-inline-start:1rem;-webkit-padding-start:var(--pep-spacing-lg,1rem);padding-inline-start:var(--pep-spacing-lg,1rem);margin-top:1.5rem;margin-top:var(--pep-top-bar-spacing-top,1.5rem)}.pep-side-bar-container .mat-sidenav-container{position:absolute;bottom:0;left:0;right:0;z-index:999;height:calc(100vh - 4rem);height:calc(100vh - var(--pep-header-height, 4rem));visibility:hidden}.pep-side-bar-container .mat-sidenav-container.mat-drawer-opened{visibility:unset}.pep-side-bar-container .mat-sidenav-container .mat-sidenav{max-width:calc(calc(16rem + 2rem) + calc(1rem * 2));max-width:calc(calc(var(--pep-side-bar-width, 16rem) + var(--pep-spacing-2xl, 2rem)) + calc(var(--pep-spacing-lg, 1rem) * 2));padding-inline:1rem;padding-inline:var(--pep-spacing-lg,1rem)}@media (max-width:599px){.pep-side-bar-container .mat-sidenav-container .mat-sidenav{padding-inline:0}}.pep-side-bar-container .mat-sidenav-container .mat-sidenav .side-layout{max-width:calc(16rem + 2rem);max-width:calc(var(--pep-side-bar-width, 16rem) + var(--pep-spacing-2xl, 2rem));width:calc(16rem + 2rem);width:calc(var(--pep-side-bar-width, 16rem) + var(--pep-spacing-2xl, 2rem))}.pep-side-bar-container .side-layout{display:block;max-width:16rem;max-width:var(--pep-side-bar-width,16rem);width:16rem;width:var(--pep-side-bar-width,16rem);padding:0 1rem;padding:0 var(--pep-spacing-lg,1rem);overflow:auto}.pep-side-bar-container .side-layout .header-content{height:calc(1.5rem + .5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-top, 1.5rem) + var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));padding-top:1.5rem;padding-top:var(--pep-top-bar-spacing-top,1.5rem);z-index:2;position:sticky;top:0}.pep-side-bar-container .side-layout .header-content .content{height:calc(.5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));display:flex;overflow:unset}.pep-side-bar-container .side-layout .footer-content{height:calc(1.5rem + .5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-top, 1.5rem) + var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem))}.pep-side-bar-container .side-layout .main-content{display:block;height:inherit;max-width:16rem;max-width:var(--pep-side-bar-width,16rem)}.pep-side-bar-container .side-layout .main-content .content{height:inherit}", ".pep-side-bar-container .toggle-side-bar-container .toggle-button-border{-webkit-border-end:1px solid rgba(26,26,26,.24);border-inline-end:1px solid rgba(26,26,26,.24);-webkit-border-end:1px solid hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.24);border-inline-end:1px solid hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.24)}.pep-side-bar-container .mat-sidenav-container ::ng-deep.mat-drawer-backdrop.mat-drawer-shown{background-color:rgba(26,26,26,.24);background-color:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.24)}.pep-side-bar-container .side-layout,.pep-side-bar-container .side-layout .header-content{background:#fff;background:hsl(var(--pep-color-system-primary-invert-h,255),var(--pep-color-system-primary-invert-s,100%),var(--pep-color-system-primary-invert-l,100%))}"]
-            },] },
-    { type: Injectable }
-];
-PepSideBarComponent.ctorParameters = () => [
-    { type: ElementRef },
-    { type: Renderer2 },
-    { type: PepLayoutService }
-];
-PepSideBarComponent.propDecorators = {
-    ignoreResize: [{ type: Input }],
-    showHeader: [{ type: Input }],
-    showFooter: [{ type: Input }],
-    useAsWebComponent: [{ type: Input }],
-    stateChange: [{ type: Output }],
-    sidenav: [{ type: ViewChild, args: ['sidenav',] }]
-};
+import { Component, Injectable, Input, Output, EventEmitter, ViewChild, ElementRef, Renderer2, } from '@angular/core';
+import { PepLayoutService, PepScreenSizeType, } from '@pepperi-addons/ngx-lib';
+import { pepIconArrowLeft, pepIconArrowRight } from '@pepperi-addons/ngx-lib/icon';
+export class PepSideBarComponent {
+    constructor(hostElement, renderer, layoutService) {
+        this.hostElement = hostElement;
+        this.renderer = renderer;
+        this.layoutService = layoutService;
+        this.ignoreResize = false;
+        this.showHeader = true;
+        this.showFooter = false;
+        this._useAsWebComponent = false;
+        this._animationTime = 350; // milliseconds.
+        this.state = 'open';
+        this.toggleButtonArrowName = pepIconArrowRight.name;
+        this.isLargeScreen = true;
+        this.stateChange = new EventEmitter();
+        this.isMouseIn = false;
+        this.sideBarHeight = '100%';
+        this.PepScreenSizeType = PepScreenSizeType;
+        this.layoutService.onResize$.subscribe((size) => {
+            this.screenSize = size;
+            this.isLargeScreen = size < PepScreenSizeType.MD;
+        });
+    }
+    set useAsWebComponent(value) {
+        if (value) {
+            this.exportFunctionsOnHostElement();
+        }
+    }
+    get useAsWebComponent() {
+        return this._useAsWebComponent;
+    }
+    exportFunctionsOnHostElement() {
+        // This is for web component usage for use those functions.
+        this.hostElement.nativeElement.open = this.open.bind(this);
+        this.hostElement.nativeElement.close = this.close.bind(this);
+    }
+    setState(state) {
+        this.state = state;
+        this.toggleButtonArrowName =
+            // state === 'open' ?
+            // (this.layoutService.isRtl() ? pepIconArrowRight.name : pepIconArrowLeft.name) :
+            (this.layoutService.isRtl() ? pepIconArrowLeft.name : pepIconArrowRight.name);
+    }
+    toggleState() {
+        this.setState(this.state === 'close' ? 'open' : 'close');
+    }
+    ngOnInit() {
+        document.documentElement.style.setProperty(PepSideBarComponent.ONE_MULTI_BY_DIR_KEY, this.layoutService.isRtl() ? '1' : '-1');
+        this.setState(this.isLargeScreen ? 'open' : 'close');
+    }
+    setSideBarHeight(event) {
+        // const from = event.relatedTarget
+        //     ? event.relatedTarget
+        //     : event.fromElement;
+        // const to = event.target ? event.target : event.toElement;
+        // if (typeof from === 'undefined' || typeof to === 'undefined') {
+        //     return;
+        // }
+        // this.isMouseIn = true;
+        // this.sideBarHeight = window.innerHeight - to.offsetTop + 'px';
+    }
+    mouseLeaveSideBar(event) {
+        // const from = event.relatedTarget
+        //     ? event.relatedTarget
+        //     : event.fromElement;
+        // const to = event.target ? event.target : event.toElement;
+        // if (typeof from === 'undefined' || typeof to === 'undefined') {
+        //     return;
+        // }
+        // this.sideBarHeight = '100%';
+        // this.isMouseIn = false;
+    }
+    open() {
+        if (this.sidenav) {
+            this.sidenav.open();
+        }
+        this.state = 'open';
+    }
+    close() {
+        if (this.sidenav) {
+            this.sidenav.close();
+        }
+        this.state = 'close';
+    }
+    toggle() {
+        if (this.sidenav) {
+            // const isOpen = this.sidenav.opened;
+            this.sidenav.toggle();
+        }
+        this.toggleState();
+    }
+    toggleSideWrapper() {
+        this.toggleState();
+        // Raise event after animation finish.
+        setTimeout(() => {
+            this.stateChange.emit({ state: this.state });
+        }, this._animationTime);
+    }
+    toggleSidenav(isOpen) {
+        this.setState(isOpen ? 'open' : 'close');
+        // Raise event after animation finish.
+        setTimeout(() => {
+            this.stateChange.emit({ state: this.state });
+        }, this._animationTime);
+    }
+}
+PepSideBarComponent.ONE_MULTI_BY_DIR_KEY = '--pep-one-multi-by-dir';
+PepSideBarComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'pep-side-bar',
+                template: "<div class=\"pep-side-bar-container\">\n    <ng-container *ngIf=\"isLargeScreen || ignoreResize; then largeScreensBlock; else notLargeScreensBlock\">\n    </ng-container>\n    <ng-template #largeScreensBlock>\n        <div class=\"toggle-side-bar-container\" [ngClass]=\"{ 'is-open-state': state === 'open'}\">\n            <ng-container *ngTemplateOutlet=\"sideLayoutTemplate\"></ng-container>\n            <div class=\"toggle-button-border\"></div>\n            <button mat-button class=\"toggle-button pep-button xs regular icon-button \" (click)=\"toggleSideWrapper()\">\n                <mat-icon>\n                    <pep-icon [name]=\"toggleButtonArrowName\">\n                    </pep-icon>\n                </mat-icon>\n            </button>\n        </div>\n    </ng-template>\n    <ng-template #notLargeScreensBlock>\n        <mat-sidenav-container [hasBackdrop]=\"true\">\n            <mat-sidenav #sidenav mode=\"over\" autoFocus=\"false\" fixedInViewport=\"false\"\n                (openedChange)=\"toggleSidenav($event)\">\n                <ng-container *ngTemplateOutlet=\"sideLayoutTemplate\"></ng-container>\n            </mat-sidenav>\n        </mat-sidenav-container>\n    </ng-template>\n</div>\n\n<ng-template #sideLayoutTemplate>\n    <div class=\"side-layout\">\n        <div *ngIf=\"showHeader\" class=\"header-content\">\n            <div class=\"content pep-border-bottom body-lg ellipsis\">\n                <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n            </div>\n        </div>\n        <div class=\"main-content\">\n            <div class=\"content\">\n                <ng-container *ngTemplateOutlet=\"startContentTemplate\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"filtersTemplate\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"smartFiltersTemplate\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"endContentTemplate\"></ng-container>\n            </div>\n        </div>\n        <div *ngIf=\"showFooter\" class=\"footer-content\">\n            <div class=\"content pep-border-top body-lg ellipsis\">\n                <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n\n<ng-template #headerTemplate>\n    <ng-content select=\"[header-content]\"></ng-content>\n</ng-template>\n\n<ng-template #startContentTemplate>\n    <ng-content select=\"[start-content]\"></ng-content>\n</ng-template>\n\n<ng-template #contentTemplate>\n    <ng-content></ng-content>\n</ng-template>\n\n<ng-template #endContentTemplate>\n    <ng-content select=\"[end-content]\"></ng-content>\n</ng-template>\n\n<ng-template #filtersTemplate>\n\n</ng-template>\n\n<ng-template #smartFiltersTemplate>\n    <ng-content select=\"pep-smart-filters\"></ng-content>\n</ng-template>\n\n<ng-template #footerTemplate>\n    <ng-content select=\"[footer-content]\"></ng-content>\n</ng-template>",
+                styles: [".pep-side-bar-container{height:100%}.pep-side-bar-container .toggle-side-bar-container{height:inherit;display:grid;grid-auto-flow:column;transition:transform .35s ease-out,width .35s ease-out;transform:translateX(calc(var(--pep-one-multi-by-dir) * 16rem));transform:translateX(calc(var(--pep-one-multi-by-dir) * var(--pep-side-bar-width, 16rem)));width:calc((1rem * 2) + 1px);width:calc((var(--pep-spacing-lg, 1rem) * 2) + 1px)}.pep-side-bar-container .toggle-side-bar-container.is-open-state{transition:transform .35s ease-out,width .35s ease-out;transform:unset;width:16rem;width:var(--pep-side-bar-width,16rem)}.pep-side-bar-container .toggle-side-bar-container.is-open-state .toggle-button{transition:margin-inline .35s ease-out,transform .35s ease-out;transform:rotate(180deg);margin-inline:-3rem .25rem}.pep-side-bar-container .toggle-side-bar-container.is-open-state .toggle-button-border{transition:opacity calc(calc(.35s / 3) * 2) ease-out,margin-inline .35s ease-out;opacity:0;margin-inline:-3rem .25rem}.pep-side-bar-container .toggle-side-bar-container .toggle-button{z-index:2;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:calc(calc(1.5rem + .5rem + 2.5rem) - .75rem);margin-top:calc(calc(var(--pep-top-bar-spacing-top, 1.5rem) + var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem)) - .75rem);transition:margin-inline .35s ease-out,transform .35s ease-out;transform:rotate(0deg);margin-inline:calc(-1 * .75rem) .25rem}.pep-side-bar-container .toggle-side-bar-container .toggle-button-border{transition:opacity calc(calc(.35s / 3) * 2) calc(.35s / 3) ease-out,margin-inline .35s ease-out;opacity:1;margin-inline:unset;width:1px;-webkit-padding-start:1rem;padding-inline-start:1rem;-webkit-padding-start:var(--pep-spacing-lg,1rem);padding-inline-start:var(--pep-spacing-lg,1rem);margin-top:1.5rem;margin-top:var(--pep-top-bar-spacing-top,1.5rem)}.pep-side-bar-container .mat-sidenav-container{position:absolute;bottom:0;left:0;right:0;z-index:999;height:calc(100vh - 4rem);height:calc(100vh - var(--pep-header-height, 4rem));visibility:hidden}.pep-side-bar-container .mat-sidenav-container.mat-drawer-opened{visibility:unset}.pep-side-bar-container .mat-sidenav-container .mat-sidenav{max-width:calc(calc(16rem + 2rem) + calc(1rem * 2));max-width:calc(calc(var(--pep-side-bar-width, 16rem) + var(--pep-spacing-2xl, 2rem)) + calc(var(--pep-spacing-lg, 1rem) * 2));padding-inline:1rem;padding-inline:var(--pep-spacing-lg,1rem)}@media (max-width:599px){.pep-side-bar-container .mat-sidenav-container .mat-sidenav{padding-inline:0}}.pep-side-bar-container .mat-sidenav-container .mat-sidenav .side-layout{max-width:calc(16rem + 2rem);max-width:calc(var(--pep-side-bar-width, 16rem) + var(--pep-spacing-2xl, 2rem));width:calc(16rem + 2rem);width:calc(var(--pep-side-bar-width, 16rem) + var(--pep-spacing-2xl, 2rem))}.pep-side-bar-container .side-layout{display:block;max-width:16rem;max-width:var(--pep-side-bar-width,16rem);width:16rem;width:var(--pep-side-bar-width,16rem);padding:0 1rem;padding:0 var(--pep-spacing-lg,1rem);overflow:auto}.pep-side-bar-container .side-layout .header-content{height:calc(1.5rem + .5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-top, 1.5rem) + var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));padding-top:1.5rem;padding-top:var(--pep-top-bar-spacing-top,1.5rem);z-index:2;position:sticky;top:0}.pep-side-bar-container .side-layout .header-content .content{height:calc(.5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));display:flex;overflow:unset}.pep-side-bar-container .side-layout .footer-content{height:calc(1.5rem + .5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-top, 1.5rem) + var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem))}.pep-side-bar-container .side-layout .main-content{display:block;height:inherit;max-width:16rem;max-width:var(--pep-side-bar-width,16rem)}.pep-side-bar-container .side-layout .main-content .content{height:inherit}", ".pep-side-bar-container .toggle-side-bar-container .toggle-button-border{-webkit-border-end:1px solid rgba(26,26,26,.24);border-inline-end:1px solid rgba(26,26,26,.24);-webkit-border-end:1px solid hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.24);border-inline-end:1px solid hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.24)}.pep-side-bar-container .mat-sidenav-container ::ng-deep.mat-drawer-backdrop.mat-drawer-shown{background-color:rgba(26,26,26,.24);background-color:hsla(var(--pep-color-system-primary-h,0),var(--pep-color-system-primary-s,0%),var(--pep-color-system-primary-l,10%),.24)}.pep-side-bar-container .side-layout,.pep-side-bar-container .side-layout .header-content{background:#fff;background:hsl(var(--pep-color-system-primary-invert-h,255),var(--pep-color-system-primary-invert-s,100%),var(--pep-color-system-primary-invert-l,100%))}"]
+            },] },
+    { type: Injectable }
+];
+PepSideBarComponent.ctorParameters = () => [
+    { type: ElementRef },
+    { type: Renderer2 },
+    { type: PepLayoutService }
+];
+PepSideBarComponent.propDecorators = {
+    ignoreResize: [{ type: Input }],
+    showHeader: [{ type: Input }],
+    showFooter: [{ type: Input }],
+    useAsWebComponent: [{ type: Input }],
+    stateChange: [{ type: Output }],
+    sidenav: [{ type: ViewChild, args: ['sidenav',] }]
+};
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZS1iYXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWxpYi9zaWRlLWJhci9zaWRlLWJhci5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNILFNBQVMsRUFFVCxVQUFVLEVBQ1YsS0FBSyxFQUNMLE1BQU0sRUFDTixZQUFZLEVBQ1osU0FBUyxFQUNULFVBQVUsRUFDVixTQUFTLEdBQ1osTUFBTSxlQUFlLENBQUM7QUFTdkIsT0FBTyxFQUVILGdCQUFnQixFQUNoQixpQkFBaUIsR0FDcEIsTUFBTSx5QkFBeUIsQ0FBQztBQUVqQyxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQVFuRixNQUFNLE9BQU8sbUJBQW1CO0lBbUM1QixZQUNZLFdBQXVCLEVBQ3ZCLFFBQW1CLEVBQ3BCLGFBQStCO1FBRjlCLGdCQUFXLEdBQVgsV0FBVyxDQUFZO1FBQ3ZCLGFBQVEsR0FBUixRQUFRLENBQVc7UUFDcEIsa0JBQWEsR0FBYixhQUFhLENBQWtCO1FBbkNqQyxpQkFBWSxHQUFHLEtBQUssQ0FBQztRQUNyQixlQUFVLEdBQUcsSUFBSSxDQUFDO1FBQ2xCLGVBQVUsR0FBRyxLQUFLLENBQUM7UUFFcEIsdUJBQWtCLEdBQUcsS0FBSyxDQUFDO1FBQ2xCLG1CQUFjLEdBQUcsR0FBRyxDQUFDLENBQUMsZ0JBQWdCO1FBRXZELFVBQUssR0FBd0IsTUFBTSxDQUFDO1FBQ3BDLDBCQUFxQixHQUFXLGlCQUFpQixDQUFDLElBQUksQ0FBQztRQUN2RCxrQkFBYSxHQUFHLElBQUksQ0FBQztRQWFyQixnQkFBVyxHQUE4QyxJQUFJLFlBQVksRUFBK0IsQ0FBQztRQUl6RyxjQUFTLEdBQUcsS0FBSyxDQUFDO1FBQ2xCLGtCQUFhLEdBQUcsTUFBTSxDQUFDO1FBR3ZCLHNCQUFpQixHQUFHLGlCQUFpQixDQUFDO1FBT2xDLElB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Q0FBQyxNQUFNLEVBQUUsQ0FBQztTQUN6QjtRQUVELElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQztJQUN2QixDQUFDO0lBRUQsaUJBQWlCO1FBQ2IsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQ25CLHNDQUFzQztRQUN0QyxVQUFVLENBQUMsR0FBRyxFQUFFO1lBQ1osSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsRUFBRSxLQUFLLEVBQUUsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDLENBQUM7UUFDakQsQ0FBQyxFQUFFLElBQUksQ0FBQyxjQUFjLENBQUMsQ0FBQztJQUM1QixDQUFDO0lBRUQsYUFBYSxDQUFDLE1BQWU7UUFDekIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDekMsc0NBQXNDO1FBQ3RDLFVBQVUsQ0FBQyxHQUFHLEVBQUU7WUFDWixJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxFQUFFLEtBQUssRUFBRSxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQztRQUNqRCxDQUFDLEVBQUUsSUFBSSxDQUFDLGNBQWMsQ0FBQyxDQUFDO0lBQzVCLENBQUM7O0FBdElNLHdDQUFvQixHQUFHLHdCQUF3QixDQUFDOztZQVAxRCxTQUFTLFNBQUM7Z0JBQ1AsUUFBUSxFQUFFLGNBQWM7Z0JBQ3hCLDIvRkFBd0M7O2FBRTNDO1lBQ0EsVUFBVTs7O1lBeEJQLFVBQVU7WUFDVixTQUFTO1lBWVQsZ0JBQWdCOzs7MkJBZWYsS0FBSzt5QkFDTCxLQUFLO3lCQUNMLEtBQUs7Z0NBU0wsS0FBSzswQkFVTCxNQUFNO3NCQUdOLFNBQVMsU0FBQyxTQUFTIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgICBDb21wb25lbnQsXG4gICAgT25Jbml0LFxuICAgIEluamVjdGFibGUsXG4gICAgSW5wdXQsXG4gICAgT3V0cHV0LFxuICAgIEV2ZW50RW1pdHRlcixcbiAgICBWaWV3Q2hpbGQsXG4gICAgRWxlbWVudFJlZixcbiAgICBSZW5kZXJlcjIsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgTWF0U2lkZW5hdiB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL3NpZGVuYXYnO1xuaW1wb3J0IHtcbiAgICB0cmlnZ2VyLFxuICAgIHN0YXRlLFxuICAgIHN0eWxlLFxuICAgIHRyYW5zaXRpb24sXG4gICAgYW5pbWF0ZSxcbn0gZnJvbSAnQGFuZ3VsYXIvYW5pbWF0aW9ucyc7XG5pbXBvcnQge1xuICAgIFBlcEN1c3RvbWl6YXRpb25TZXJ2aWNlLFxuICAgIFBlcExheW91dFNlcnZpY2UsXG4gICAgUGVwU2NyZWVuU2l6ZVR5cGUsXG59IGZyb20gJ0BwZXBwZXJpLWFkZG9ucy9uZ3gtbGliJztcbmltcG9ydCB7IElQZXBTaWRlQmFyU3RhdGVDaGFuZ2VFdmVudCwgUGVwU2lkZUJhclN0YXRlVHlwZSB9IGZyb20gJy4vc2lkZS1iYXIubW9kZWwnO1xuaW1wb3J0IHsgcGVwSWNvbkFycm93TGVmdCwgcGVwSWNvbkFycm93UmlnaHQgfSBmcm9tICdAcGVwcGVyaS1hZGRvbnMvbmd4LWxpYi9pY29uJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdwZXAtc2lkZS1iYXInLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9zaWRlLWJhci5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vc2lkZS1iYXIuY29tcG9uZW50LnNjc3MnLCAnLi9zaWRlLWJhci5jb21wb25lbnQudGhlbWUuc2NzcyddXG59KVxuQEluamVjdGFibGUoKVxuZXhwb3J0IGNsYXNzIFBlcFNpZGVCYXJDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICAgIHN0YXRpYyBPTkVfTVVMVElfQllfRElSX0tFWSA9ICctLXBlcC1vbmUtbXVsdGktYnktZGlyJztcblxuICAgIEBJbnB1dCgpIGlnbm9yZVJlc2l6ZSA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIHNob3dIZWFkZXIgPSB0cnVlO1xuICAgIEBJbnB1dCgpIHNob3dGb290ZXIgPSBmYWxzZTtcblxuICAgIHByaXZhdGUgX3VzZUFzV2ViQ29tcG9uZW50ID0gZmFsc2U7XG4gICAgcHJpdmF0ZSByZWFkb25seSBfYW5pbWF0aW9uVGltZSA9IDM1MDsgLy8gbWlsbGlzZWNvbmRzLlxuXG4gICAgc3RhdGU6IFBlcFNpZGVCYXJTdGF0ZVR5cGUgPSAnb3Blbic7XG4gICAgdG9nZ2xlQnV0dG9uQXJyb3dOYW1lOiBzdHJpbmcgPSBwZXBJY29uQXJyb3dSaWdodC5uYW1lO1xuICAgIGlzTGFyZ2VTY3JlZW4gPSB0cnVlO1xuXG4gICAgQElucHV0KClcbiAgICBzZXQgdXNlQXNXZWJDb21wb25lbnQodmFsdWU6IGJvb2xlYW4pIHtcbiAgICAgICAgaWYgKHZhbHVlKSB7XG4gICAgICAgICAgICB0aGlzLmV4cG9ydEZ1bmN0aW9uc09uSG9zdEVsZW1lbnQoKTtcbiAgICAgICAgfVxuICAgIH1cbiAgICBnZXQgdXNlQXNXZWJDb21wb25lbnQoKTogYm9vbGVhbiB7XG4gICAgICAgIHJldHVybiB0aGlzLl91c2VBc1dlYkNvbXBvbmVudDtcbiAgICB9XG5cbiAgICBAT3V0cHV0KClcbiAgICBzdGF0ZUNoYW5nZTogRXZlbnRFbWl0dGVyPElQZXBTaWRlQmFyU3RhdGVDaGFuZ2VFdmVudD4gPSBuZXcgRXZlbnRFbWl0dGVyPElQZXBTaWRlQmFyU3RhdGVDaGFuZ2VFdmVudD4oKTtcblxuICAgIEBWaWV3Q2hpbGQoJ3NpZGVuYXYnKSBzaWRlbmF2OiBNYXRTaWRlbmF2O1xuXG4gICAgaXNNb3VzZUluID0gZmFsc2U7XG4gICAgc2lkZUJhckhlaWdodCA9ICcxMDAlJztcblxuICAgIHNjcmVlblNpemU6IFBlcFNjcmVlblNpemVUeXBlO1xuICAgIFBlcFNjcmVlblNpemVUeXBlID0gUGVwU2NyZWVuU2l6ZVR5cGU7XG5cbiAgICBjb25zdHJ1Y3RvcihcbiAgICAgICAgcHJpdmF0ZSBob3N0RWxlbWVudDogRWxlbWVudFJlZixcbiAgICAgICAgcHJpdmF0ZSByZW5kZXJlcjogUmVuZGVyZXIyLFxuICAgICAgICBwdWJsaWMgbGF5b3V0U2VydmljZTogUGVwTGF5b3V0U2VydmljZVxuICAgICkge1xuICAgICAgICB0aGlzLmxheW91dFNlcnZpY2Uub25SZXNpemUkLnN1YnNjcmliZSgoc2l6ZTogUGVwU2NyZWVuU2l6ZVR5cGUpID0+IHtcbiAgICAgICAgICAgIHRoaXMuc2NyZWVuU2l6ZSA9IHNpemU7XG4gICAgICAgICAgICB0aGlzLmlzTGFyZ2VTY3JlZW4gPSBzaXplIDwgUGVwU2NyZWVuU2l6ZVR5cGUuTUQ7XG4gICAgICAgIH0pO1xuICAgIH1cblxuICAgIHByaXZhdGUgZXhwb3J0RnVuY3Rpb25zT25Ib3N0RWxlbWVudCgpIHtcbiAgICAgICAgLy8gVGhpcyBpcyBmb3Igd2ViIGNvbXBvbmVudCB1c2FnZSBmb3IgdXNlIHRob3NlIGZ1bmN0aW9ucy5cbiAgICAgICAgdGhpcy5ob3N0RWxlbWVudC5uYXRpdmVFbGVtZW50Lm9wZW4gPSB0aGlzLm9wZW4uYmluZCh0aGlzKTtcbiAgICAgICAgdGhpcy5ob3N0RWxlbWVudC5uYXRpdmVFbGVtZW50LmNsb3NlID0gdGhpcy5jbG9zZS5iaW5kKHRoaXMpO1xuICAgIH1cblxuICAgIHByaXZhdGUgc2V0U3RhdGUoc3RhdGU6IFBlcFNpZGVCYXJTdGF0ZVR5cGUpIHtcbiAgICAgICAgdGhpcy5zdGF0ZSA9IHN0YXRlO1xuICAgICAgICB0aGlzLnRvZ2dsZUJ1dHRvbkFycm93TmFtZSA9XG4gICAgICAgICAgICAvLyBzdGF0ZSA9PT0gJ29wZW4nID9cbiAgICAgICAgICAgIC8vICh0aGlzLmxheW91dFNlcnZpY2UuaXNSdGwoKSA/IHBlcEljb25BcnJvd1JpZ2h0Lm5hbWUgOiBwZXBJY29uQXJyb3dMZWZ0Lm5hbWUpIDpcbiAgICAgICAgICAgICh0aGlzLmxheW91dFNlcnZpY2UuaXNSdGwoKSA/IHBlcEljb25BcnJvd0xlZnQubmFtZSA6IHBlcEljb25BcnJvd1JpZ2h0Lm5hbWUpO1xuICAgIH1cblxuICAgIHByaXZhdGUgdG9nZ2xlU3RhdGUoKSB7XG4gICAgICAgIHRoaXMuc2V0U3RhdGUodGhpcy5zdGF0ZSA9PT0gJ2Nsb3NlJyA/ICdvcGVuJyA6ICdjbG9zZScpO1xuICAgIH1cblxuICAgIG5nT25Jbml0KCkge1xuICAgICAgICBkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQuc3R5bGUuc2V0UHJvcGVydHkoUGVwU2lkZUJhckNvbXBvbmVudC5PTkVfTVVMVElfQllfRElSX0tFWSwgdGhpcy5sYXlvdXRTZXJ2aWNlLmlzUnRsKCkgPyAnMScgOiAnLTEnKTtcbiAgICAgICAgdGhpcy5zZXRTdGF0ZSh0aGlzLmlzTGFyZ2VTY3JlZW4gPyAnb3BlbicgOiAnY2xvc2UnKTtcbiAgICB9XG5cbiAgICBzZXRTaWRlQmFySGVpZ2h0KGV2ZW50KSB7XG4gICAgICAgIC8vIGNvbnN0IGZyb20gPSBldmVudC5yZWxhdGVkVGFyZ2V0XG4gICAgICAgIC8vICAgICA/IGV2ZW50LnJlbGF0ZWRUYXJnZXRcbiAgICAgICAgLy8gICAgIDogZXZlbnQuZnJvbUVsZW1lbnQ7XG4gICAgICAgIC8vIGNvbnN0IHRvID0gZXZlbnQudGFyZ2V0ID8gZXZlbnQudGFyZ2V0IDogZXZlbnQudG9FbGVtZW50O1xuXG4gICAgICAgIC8vIGlmICh0eXBlb2YgZnJvbSA9PT0gJ3VuZGVmaW5lZCcgfHwgdHlwZW9mIHRvID09PSAndW5kZWZpbmVkJykge1xuICAgICAgICAvLyAgICAgcmV0dXJuO1xuICAgICAgICAvLyB9XG4gICAgICAgIC8vIHRoaXMuaXNNb3VzZUluID0gdHJ1ZTtcblxuICAgICAgICAvLyB0aGlzLnNpZGVCYXJIZWlnaHQgPSB3aW5kb3cuaW5uZXJIZWlnaHQgLSB0by5vZmZzZXRUb3AgKyAncHgnO1xuICAgIH1cblxuICAgIG1vdXNlTGVhdmVTaWRlQmFyKGV2ZW50KSB7XG4gICAgICAgIC8vIGNvbnN0IGZyb20gPSBldmVudC5yZWxhdGVkVGFyZ2V0XG4gICAgICAgIC8vICAgICA/IGV2ZW50LnJlbGF0ZWRUYXJnZXRcbiAgICAgICAgLy8gICAgIDogZXZlbnQuZnJvbUVsZW1lbnQ7XG4gICAgICAgIC8vIGNvbnN0IHRvID0gZXZlbnQudGFyZ2V0ID8gZXZlbnQudGFyZ2V0IDogZXZlbnQudG9FbGVtZW50O1xuXG4gICAgICAgIC8vIGlmICh0eXBlb2YgZnJvbSA9PT0gJ3VuZGVmaW5lZCcgfHwgdHlwZW9mIHRvID09PSAndW5kZWZpbmVkJykge1xuICAgICAgICAvLyAgICAgcmV0dXJuO1xuICAgICAgICAvLyB9XG4gICAgICAgIC8vIHRoaXMuc2lkZUJhckhlaWdodCA9ICcxMDAlJztcbiAgICAgICAgLy8gdGhpcy5pc01vdXNlSW4gPSBmYWxzZTtcbiAgICB9XG5cbiAgICBvcGVuKCkge1xuICAgICAgICBpZiAodGhpcy5zaWRlbmF2KSB7XG4gICAgICAgICAgICB0aGlzLnNpZGVuYXYub3BlbigpO1xuICAgICAgICB9XG5cbiAgICAgICAgdGhpcy5zdGF0ZSA9ICdvcGVuJztcbiAgICB9XG5cbiAgICBjbG9zZSgpIHtcbiAgICAgICAgaWYgKHRoaXMuc2lkZW5hdikge1xuICAgICAgICAgICAgdGhpcy5zaWRlbmF2LmNsb3NlKCk7XG4gICAgICAgIH1cblxuICAgICAgICB0aGlzLnN0YXRlID0gJ2Nsb3NlJztcbiAgICB9XG5cbiAgICB0b2dnbGUoKSB7XG4gICAgICAgIGlmICh0aGlzLnNpZGVuYXYpIHtcbiAgICAgICAgICAgIC8vIGNvbnN0IGlzT3BlbiA9IHRoaXMuc2lkZW5hdi5vcGVuZWQ7XG4gICAgICAgICAgICB0aGlzLnNpZGVuYXYudG9nZ2xlKCk7XG4gICAgICAgIH1cblxuICAgICAgICB0aGlzLnRvZ2dsZVN0YXRlKCk7XG4gICAgfVxuXG4gICAgdG9nZ2xlU2lkZVdyYXBwZXIoKSB7XG4gICAgICAgIHRoaXMudG9nZ2xlU3RhdGUoKTtcbiAgICAgICAgLy8gUmFpc2UgZXZlbnQgYWZ0ZXIgYW5pbWF0aW9uIGZpbmlzaC5cbiAgICAgICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICAgICAgICB0aGlzLnN0YXRlQ2hhbmdlLmVtaXQoeyBzdGF0ZTogdGhpcy5zdGF0ZSB9KTtcbiAgICAgICAgfSwgdGhpcy5fYW5pbWF0aW9uVGltZSk7XG4gICAgfVxuXG4gICAgdG9nZ2xlU2lkZW5hdihpc09wZW46IGJvb2xlYW4pIHtcbiAgICAgICAgdGhpcy5zZXRTdGF0ZShpc09wZW4gPyAnb3BlbicgOiAnY2xvc2UnKTtcbiAgICAgICAgLy8gUmFpc2UgZXZlbnQgYWZ0ZXIgYW5pbWF0aW9uIGZpbmlzaC5cbiAgICAgICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICAgICAgICB0aGlzLnN0YXRlQ2hhbmdlLmVtaXQoeyBzdGF0ZTogdGhpcy5zdGF0ZSB9KTtcbiAgICAgICAgfSwgdGhpcy5fYW5pbWF0aW9uVGltZSk7XG4gICAgfVxufVxuIl19

package/esm2015/side-bar/side-bar.model.js

@@ -1,2 +1,2 @@
-export {};
+export {};
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZS1iYXIubW9kZWwuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtbGliL3NpZGUtYmFyL3NpZGUtYmFyLm1vZGVsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgdHlwZSBQZXBTaWRlQmFyU3RhdGVUeXBlID0gJ29wZW4nIHwgJ2Nsb3NlJztcblxuZXhwb3J0IGludGVyZmFjZSBJUGVwU2lkZUJhclN0YXRlQ2hhbmdlRXZlbnQge1xuICAgIHN0YXRlOiBQZXBTaWRlQmFyU3RhdGVUeXBlO1xufVxuIl19

package/esm2015/side-bar/side-bar.module.js

@@ -1,34 +1,34 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { MatCommonModule } from '@angular/material/core';
-import { MatIconModule } from '@angular/material/icon';
-import { MatSidenavModule } from '@angular/material/sidenav';
-import { PepNgxLibModule } from '@pepperi-addons/ngx-lib';
-import { PepIconModule, PepIconRegistry, pepIconSystemClose, } from '@pepperi-addons/ngx-lib/icon';
-import { PepSideBarComponent } from './side-bar.component';
-export class PepSideBarModule {
-    constructor(pepIconRegistry) {
-        this.pepIconRegistry = pepIconRegistry;
-        this.pepIconRegistry.registerIcons([pepIconSystemClose]);
-    }
-}
-PepSideBarModule.decorators = [
-    { type: NgModule, args: [{
-                imports: [
-                    CommonModule,
-                    // Material modules,
-                    MatCommonModule,
-                    MatIconModule,
-                    MatSidenavModule,
-                    // ngx-lib modules
-                    PepNgxLibModule,
-                    PepIconModule,
-                ],
-                exports: [PepSideBarComponent],
-                declarations: [PepSideBarComponent],
-            },] }
-];
-PepSideBarModule.ctorParameters = () => [
-    { type: PepIconRegistry }
-];
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { MatCommonModule } from '@angular/material/core';
+import { MatIconModule } from '@angular/material/icon';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { PepNgxLibModule } from '@pepperi-addons/ngx-lib';
+import { PepIconModule, PepIconRegistry, pepIconSystemClose, } from '@pepperi-addons/ngx-lib/icon';
+import { PepSideBarComponent } from './side-bar.component';
+export class PepSideBarModule {
+    constructor(pepIconRegistry) {
+        this.pepIconRegistry = pepIconRegistry;
+        this.pepIconRegistry.registerIcons([pepIconSystemClose]);
+    }
+}
+PepSideBarModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    // Material modules,
+                    MatCommonModule,
+                    MatIconModule,
+                    MatSidenavModule,
+                    // ngx-lib modules
+                    PepNgxLibModule,
+                    PepIconModule,
+                ],
+                exports: [PepSideBarComponent],
+                declarations: [PepSideBarComponent],
+            },] }
+];
+PepSideBarModule.ctorParameters = () => [
+    { type: PepIconRegistry }
+];
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZS1iYXIubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWxpYi9zaWRlLWJhci9zaWRlLWJhci5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFFL0MsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQ3pELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUN2RCxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUU3RCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFDMUQsT0FBTyxFQUNILGFBQWEsRUFDYixlQUFlLEVBQ2Ysa0JBQWtCLEdBQ3JCLE1BQU0sOEJBQThCLENBQUM7QUFFdEMsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFnQjNELE1BQU0sT0FBTyxnQkFBZ0I7SUFDekIsWUFBb0IsZUFBZ0M7UUFBaEMsb0JBQWUsR0FBZixlQUFlLENBQWlCO1FBQ2hELElBQUksQ0FBQyxlQUFlLENBQUMsYUFBYSxDQUFDLENBQUMsa0JBQWtCLENBQUMsQ0FBQyxDQUFDO0lBQzdELENBQUM7OztZQWpCSixRQUFRLFNBQUM7Z0JBQ04sT0FBTyxFQUFFO29CQUNMLFlBQVk7b0JBQ1osb0JBQW9CO29CQUNwQixlQUFlO29CQUNmLGFBQWE7b0JBQ2IsZ0JBQWdCO29CQUNoQixrQkFBa0I7b0JBQ2xCLGVBQWU7b0JBQ2YsYUFBYTtpQkFDaEI7Z0JBQ0QsT0FBTyxFQUFFLENBQUMsbUJBQW1CLENBQUM7Z0JBQzlCLFlBQVksRUFBRSxDQUFDLG1CQUFtQixDQUFDO2FBQ3RDOzs7WUFuQkcsZUFBZSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuXG5pbXBvcnQgeyBNYXRDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9jb3JlJztcbmltcG9ydCB7IE1hdEljb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9pY29uJztcbmltcG9ydCB7IE1hdFNpZGVuYXZNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9zaWRlbmF2JztcblxuaW1wb3J0IHsgUGVwTmd4TGliTW9kdWxlIH0gZnJvbSAnQHBlcHBlcmktYWRkb25zL25neC1saWInO1xuaW1wb3J0IHtcbiAgICBQZXBJY29uTW9kdWxlLFxuICAgIFBlcEljb25SZWdpc3RyeSxcbiAgICBwZXBJY29uU3lzdGVtQ2xvc2UsXG59IGZyb20gJ0BwZXBwZXJpLWFkZG9ucy9uZ3gtbGliL2ljb24nO1xuXG5pbXBvcnQgeyBQZXBTaWRlQmFyQ29tcG9uZW50IH0gZnJvbSAnLi9zaWRlLWJhci5jb21wb25lbnQnO1xuXG5ATmdNb2R1bGUoe1xuICAgIGltcG9ydHM6IFtcbiAgICAgICAgQ29tbW9uTW9kdWxlLFxuICAgICAgICAvLyBNYXRlcmlhbCBtb2R1bGVzLFxuICAgICAgICBNYXRDb21tb25Nb2R1bGUsXG4gICAgICAgIE1hdEljb25Nb2R1bGUsXG4gICAgICAgIE1hdFNpZGVuYXZNb2R1bGUsXG4gICAgICAgIC8vIG5neC1saWIgbW9kdWxlc1xuICAgICAgICBQZXBOZ3hMaWJNb2R1bGUsXG4gICAgICAgIFBlcEljb25Nb2R1bGUsXG4gICAgXSxcbiAgICBleHBvcnRzOiBbUGVwU2lkZUJhckNvbXBvbmVudF0sXG4gICAgZGVjbGFyYXRpb25zOiBbUGVwU2lkZUJhckNvbXBvbmVudF0sXG59KVxuZXhwb3J0IGNsYXNzIFBlcFNpZGVCYXJNb2R1bGUge1xuICAgIGNvbnN0cnVjdG9yKHByaXZhdGUgcGVwSWNvblJlZ2lzdHJ5OiBQZXBJY29uUmVnaXN0cnkpIHtcbiAgICAgICAgdGhpcy5wZXBJY29uUmVnaXN0cnkucmVnaXN0ZXJJY29ucyhbcGVwSWNvblN5c3RlbUNsb3NlXSk7XG4gICAgfVxufVxuIl19

package/esm2015/signature/pepperi-addons-ngx-lib-signature.js

@@ -1,5 +1,5 @@
-/**
- * Generated bundle index. Do not edit.
- */
-export * from './public-api';
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './public-api';
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGVwcGVyaS1hZGRvbnMtbmd4LWxpYi1zaWduYXR1cmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtbGliL3NpZ25hdHVyZS9wZXBwZXJpLWFkZG9ucy1uZ3gtbGliLXNpZ25hdHVyZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsY0FBYyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL3B1YmxpYy1hcGknO1xuIl19

package/esm2015/signature/public-api.js

@@ -1,6 +1,6 @@
-/*
- * Public API Surface of ngx-lib/signature
- */
-export * from './signature.module';
-export * from './signature.component';
+/*
+ * Public API Surface of ngx-lib/signature
+ */
+export * from './signature.module';
+export * from './signature.component';
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1saWIvc2lnbmF0dXJlL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFDSCxjQUFjLG9CQUFvQixDQUFDO0FBQ25DLGNBQWMsdUJBQXVCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogUHVibGljIEFQSSBTdXJmYWNlIG9mIG5neC1saWIvc2lnbmF0dXJlXG4gKi9cbmV4cG9ydCAqIGZyb20gJy4vc2lnbmF0dXJlLm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL3NpZ25hdHVyZS5jb21wb25lbnQnO1xuIl19