@pepperi-addons/ngx-composite-lib 0.4.2-beta.99 → 0.5.0-ng16.2

package/fesm2015/pepperi-addons-ngx-composite-lib-show-if-badge.mjs

@@ -1,100 +0,0 @@
-import * as i0 from '@angular/core';
-import { Component, Input, NgModule } from '@angular/core';
-import * as i2 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i1 from '@pepperi-addons/ngx-lib';
-import { PepNgxLibModule } from '@pepperi-addons/ngx-lib';
-import * as i1$1 from '@pepperi-addons/ngx-lib/icon';
-import { pepIconSystemView, PepIconModule } from '@pepperi-addons/ngx-lib/icon';
-import * as i2$1 from '@ngx-translate/core';
-import { TranslateModule } from '@ngx-translate/core';
-import * as i4 from '@angular/material/icon';
-import { MatIconModule } from '@angular/material/icon';
-import { MatBadgeModule } from '@angular/material/badge';
-
-class ShowIfBadgeComponent {
-    constructor(layoutService) {
-        this.layoutService = layoutService;
-        this.showIf = false;
-        /**
-        * If you want to show an icon in the button then select an icon form the provided icon list
-        *
-        * @type {PepIconType} See {@link PepIconType}
-        * @memberof PepButtonComponent
-        */
-        this.iconName = pepIconSystemView.name;
-        this.backgroundColor = 'hsl(0,0%,0%)';
-        this.isRtl = false;
-        this.isRtl = this.layoutService.isRtl();
-    }
-    ngOnInit() {
-        setTimeout(() => {
-            const badge = document.getElementsByClassName("mat-badge-content")[0];
-            if (badge) {
-                badge.setAttribute('style', 'background-color:' + this.backgroundColor + '!important');
-            }
-        }, 0);
-    }
-}
-ShowIfBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ShowIfBadgeComponent, deps: [{ token: i1.PepLayoutService }], target: i0.ɵɵFactoryTarget.Component });
-ShowIfBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: ShowIfBadgeComponent, selector: "pep-show-if-badge", inputs: { showIf: "showIf", iconName: "iconName", backgroundColor: "backgroundColor" }, ngImport: i0, template: "<div *ngIf=\"showIf\" class=\"show-if-badge\" [ngClass]=\"{ 'rtl-direction': isRtl }\">\n    <mat-icon class=\"mat-badge-content\">\n        <pep-icon [name]=\"iconName\"></pep-icon>\n    </mat-icon>\n</div>", styles: [".show-if-badge{position:relative;right:0}.show-if-badge .mat-badge-content{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color: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%));background-color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))!important;box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.32)}.show-if-badge .mat-badge-content .svg-icon{fill: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%))}.show-if-badge .mat-badge-content .svg-icon.stroke{fill:unset;stroke: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%))}.show-if-badge.rtl-direction{right:unset;left:0}.show-if-badge .mat-icon{right:0;height:2.5rem;width:2.5rem;margin-top:-1rem;margin-right:-1.25rem}.show-if-badge .mat-icon ::ng-deep .svg-icon{fill: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%));width:1.75rem;height:1.75rem}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ShowIfBadgeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'pep-show-if-badge', template: "<div *ngIf=\"showIf\" class=\"show-if-badge\" [ngClass]=\"{ 'rtl-direction': isRtl }\">\n    <mat-icon class=\"mat-badge-content\">\n        <pep-icon [name]=\"iconName\"></pep-icon>\n    </mat-icon>\n</div>", styles: [".show-if-badge{position:relative;right:0}.show-if-badge .mat-badge-content{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color: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%));background-color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))!important;box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.32)}.show-if-badge .mat-badge-content .svg-icon{fill: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%))}.show-if-badge .mat-badge-content .svg-icon.stroke{fill:unset;stroke: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%))}.show-if-badge.rtl-direction{right:unset;left:0}.show-if-badge .mat-icon{right:0;height:2.5rem;width:2.5rem;margin-top:-1rem;margin-right:-1.25rem}.show-if-badge .mat-icon ::ng-deep .svg-icon{fill: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%));width:1.75rem;height:1.75rem}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.PepLayoutService }]; }, propDecorators: { showIf: [{
-                type: Input
-            }], iconName: [{
-                type: Input
-            }], backgroundColor: [{
-                type: Input
-            }] } });
-
-const pepIcons = [
-    pepIconSystemView
-];
-class PepShowIfBadgeModule {
-    constructor(pepIconRegistry) {
-        this.pepIconRegistry = pepIconRegistry;
-        this.pepIconRegistry.registerIcons(pepIcons);
-    }
-}
-PepShowIfBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepShowIfBadgeModule, deps: [{ token: i1$1.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
-PepShowIfBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepShowIfBadgeModule, declarations: [ShowIfBadgeComponent], imports: [CommonModule,
-        PepNgxLibModule,
-        PepIconModule,
-        MatIconModule,
-        MatBadgeModule, i2$1.TranslateModule], exports: [ShowIfBadgeComponent] });
-PepShowIfBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepShowIfBadgeModule, imports: [CommonModule,
-        PepNgxLibModule,
-        PepIconModule,
-        MatIconModule,
-        MatBadgeModule,
-        TranslateModule.forChild()] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepShowIfBadgeModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        ShowIfBadgeComponent
-                    ],
-                    imports: [
-                        CommonModule,
-                        PepNgxLibModule,
-                        PepIconModule,
-                        MatIconModule,
-                        MatBadgeModule,
-                        TranslateModule.forChild(),
-                    ],
-                    exports: [ShowIfBadgeComponent]
-                }]
-        }], ctorParameters: function () { return [{ type: i1$1.PepIconRegistry }]; } });
-
-/*
- * Public API Surface of ngx-composite-lib/flow-picker-button
- */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { PepShowIfBadgeModule, ShowIfBadgeComponent };
-//# sourceMappingURL=pepperi-addons-ngx-composite-lib-show-if-badge.mjs.map

package/fesm2015/pepperi-addons-ngx-composite-lib-show-if-badge.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"pepperi-addons-ngx-composite-lib-show-if-badge.mjs","sources":["../../../projects/ngx-composite-lib/show-if-badge/show-if-badge.component.ts","../../../projects/ngx-composite-lib/show-if-badge/show-if-badge.component.html","../../../projects/ngx-composite-lib/show-if-badge/show-if-badge.module.ts","../../../projects/ngx-composite-lib/show-if-badge/public-api.ts","../../../projects/ngx-composite-lib/show-if-badge/pepperi-addons-ngx-composite-lib-show-if-badge.ts"],"sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\n\nimport { PepLayoutService } from '@pepperi-addons/ngx-lib';\nimport { PepIconType, pepIconSystemView } from '@pepperi-addons/ngx-lib/icon';\nimport { PepColorSettings } from '@pepperi-addons/ngx-composite-lib/color-settings';\n\n\n@Component({\n    selector: 'pep-show-if-badge',\n    templateUrl: './show-if-badge.component.html',\n    styleUrls: ['./show-if-badge.component.scss']\n})\n\nexport class ShowIfBadgeComponent {\n    @Input() showIf = false;\n   \n     /**\n     * If you want to show an icon in the button then select an icon form the provided icon list\n     *\n     * @type {PepIconType} See {@link PepIconType}\n     * @memberof PepButtonComponent\n     */\n   @Input() iconName: PepIconType = pepIconSystemView.name;\n   @Input() backgroundColor = 'hsl(0,0%,0%)';\n   \n    \n    protected isRtl = false;\n    \n    constructor(protected layoutService: PepLayoutService) { \n        this.isRtl = this.layoutService.isRtl();\n    }\n\n    ngOnInit(){\n        setTimeout(() => {\n            const badge = document.getElementsByClassName(\"mat-badge-content\")[0] as HTMLElement;\n                if(badge){\n                    badge.setAttribute('style', 'background-color:'+ this.backgroundColor + '!important');\n                }\n          }, 0);\n    }\n}\n","<div *ngIf=\"showIf\" class=\"show-if-badge\" [ngClass]=\"{ 'rtl-direction': isRtl }\">\n    <mat-icon class=\"mat-badge-content\">\n        <pep-icon [name]=\"iconName\"></pep-icon>\n    </mat-icon>\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { PepNgxLibModule, PepAddonService } from '@pepperi-addons/ngx-lib';\nimport { PepIconModule, PepIconRegistry, pepIconSystemView} from '@pepperi-addons/ngx-lib/icon';\n\nimport { TranslateModule } from '@ngx-translate/core';\n\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatBadgeModule } from '@angular/material/badge';\n\nimport { ShowIfBadgeComponent } from './show-if-badge.component';\n\nconst pepIcons = [\n    pepIconSystemView\n];\n\n@NgModule({\n    declarations: [\n        ShowIfBadgeComponent\n    ],\n    imports: [\n        CommonModule,\n        PepNgxLibModule,\n        PepIconModule,\n        MatIconModule,\n        MatBadgeModule,\n        TranslateModule.forChild(),\n    ],\n    exports: [ShowIfBadgeComponent]\n})\nexport class PepShowIfBadgeModule { \n\nconstructor(\n    private pepIconRegistry: PepIconRegistry\n    ) {\n        this.pepIconRegistry.registerIcons(pepIcons);\n    }\n}\n","/*\n * Public API Surface of ngx-composite-lib/flow-picker-button\n */\nexport * from './show-if-badge.module';\nexport * from './show-if-badge.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i3","i1"],"mappings":";;;;;;;;;;;;;;MAaa,oBAAoB,CAAA;AAe7B,IAAA,WAAA,CAAsB,aAA+B,EAAA;AAA/B,QAAA,IAAa,CAAA,aAAA,GAAb,aAAa,CAAkB;AAd5C,QAAA,IAAM,CAAA,MAAA,GAAG,KAAK,CAAC;AAEvB;;;;;AAKE;AACK,QAAA,IAAA,CAAA,QAAQ,GAAgB,iBAAiB,CAAC,IAAI,CAAC;AAC/C,QAAA,IAAe,CAAA,eAAA,GAAG,cAAc,CAAC;AAG/B,QAAA,IAAK,CAAA,KAAA,GAAG,KAAK,CAAC;QAGpB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;KAC3C;IAED,QAAQ,GAAA;QACJ,UAAU,CAAC,MAAK;YACZ,MAAM,KAAK,GAAG,QAAQ,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAgB,CAAC;AACjF,YAAA,IAAG,KAAK,EAAC;AACL,gBAAA,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,mBAAmB,GAAE,IAAI,CAAC,eAAe,GAAG,YAAY,CAAC,CAAC;AACzF,aAAA;SACN,EAAE,CAAC,CAAC,CAAC;KACX;;iHA1BQ,oBAAoB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,oBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,iJCbjC,iNAIM,EAAA,MAAA,EAAA,CAAA,soDAAA,CAAA,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,EAAAA,IAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,MAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;2FDSO,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBANhC,SAAS;+BACI,mBAAmB,EAAA,QAAA,EAAA,iNAAA,EAAA,MAAA,EAAA,CAAA,soDAAA,CAAA,EAAA,CAAA;uGAMpB,MAAM,EAAA,CAAA;sBAAd,KAAK;gBAQE,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBACG,eAAe,EAAA,CAAA;sBAAvB,KAAK;;;AEVT,MAAM,QAAQ,GAAG;IACb,iBAAiB;CACpB,CAAC;MAgBW,oBAAoB,CAAA;AAEjC,IAAA,WAAA,CACY,eAAgC,EAAA;AAAhC,QAAA,IAAe,CAAA,eAAA,GAAf,eAAe,CAAiB;AAEpC,QAAA,IAAI,CAAC,eAAe,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;KAChD;;iHANQ,oBAAoB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAAC,IAAA,CAAA,eAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;kHAApB,oBAAoB,EAAA,YAAA,EAAA,CAZzB,oBAAoB,CAAA,EAAA,OAAA,EAAA,CAGpB,YAAY;QACZ,eAAe;QACf,aAAa;QACb,aAAa;AACb,QAAA,cAAc,mCAGR,oBAAoB,CAAA,EAAA,CAAA,CAAA;AAErB,oBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,oBAAoB,YATzB,YAAY;QACZ,eAAe;QACf,aAAa;QACb,aAAa;QACb,cAAc;AACd,QAAA,eAAe,CAAC,QAAQ,EAAE,CAAA,EAAA,CAAA,CAAA;2FAIrB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAdhC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,YAAY,EAAE;wBACV,oBAAoB;AACvB,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACL,YAAY;wBACZ,eAAe;wBACf,aAAa;wBACb,aAAa;wBACb,cAAc;wBACd,eAAe,CAAC,QAAQ,EAAE;AAC7B,qBAAA;oBACD,OAAO,EAAE,CAAC,oBAAoB,CAAC;iBAClC,CAAA;;;AC9BD;;AAEG;;ACFH;;AAEG;;;;"}

package/fesm2015/pepperi-addons-ngx-composite-lib.mjs

@@ -1,329 +0,0 @@
-import * as i0 from '@angular/core';
-import { EventEmitter, Directive, Input, Injectable, NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { __awaiter } from 'tslib';
-import * as i1 from '@pepperi-addons/ngx-lib/icon';
-import { pepIconDeviceResponsive, PepIconModule } from '@pepperi-addons/ngx-lib/icon';
-import * as i2 from '@ngx-translate/core';
-import * as i1$1 from '@pepperi-addons/ngx-lib/remote-loader';
-import { PepRemoteLoaderModule } from '@pepperi-addons/ngx-lib/remote-loader';
-
-class PepResetConfigurationFieldDirective {
-    constructor(renderer, element, pepIconService, translate) {
-        this.renderer = renderer;
-        this.element = element;
-        this.pepIconService = pepIconService;
-        this.translate = translate;
-        this.resetFieldKey = '';
-        this.resetHostEvents = new EventEmitter();
-        this._disabled = false;
-        this._hideReset = false;
-        this._dir = 'ltr';
-        // styleType: PepStyleType = 'weak';
-        // styleStateType: PepStyleStateType = 'system';
-        this.sizeType = 'sm';
-        this.resetPosition = 'bottom-end';
-        // Create the buton container.
-        this.buttonContainer = this.renderer.createElement('div');
-        this.translate.get('GENERAL.RESET_HINT').toPromise().then(hint => {
-            this.renderer.setAttribute(this.buttonContainer, 'title', hint);
-        });
-    }
-    set disabled(value) {
-        this._disabled = value;
-        // this.renderer.setStyle(this.buttonContainer, 'visibility', this.getVisibility());
-        this.setButtonStyle(this.resetButton);
-    }
-    get disabled() {
-        return this._disabled;
-    }
-    set hideReset(value) {
-        this._hideReset = value;
-        // this.renderer.setStyle(this.buttonContainer, 'visibility', this.getVisibility());
-        this.setButtonStyle(this.resetButton);
-    }
-    get hideReset() {
-        return this._hideReset;
-    }
-    set dir(value) {
-        this._dir = value;
-        this.renderer.setStyle(this.buttonContainer, 'float', this.getFloat());
-    }
-    get dir() {
-        return this._dir;
-    }
-    getVisibility() {
-        return this.disabled || this.hideReset ? 'hidden' : 'visible';
-    }
-    getFloat() {
-        return this.dir === 'rtl' ? 'left' : 'right';
-    }
-    setButtonContainerStyle() {
-        const css = `
-            display: flex;
-            justify-content: flex-end;
-            `;
-        // This was removed.
-        // float: ${this.getFloat()};
-        // margin-bottom: 1rem;
-        this.buttonContainer.setAttribute("style", css);
-    }
-    setButtonStyle(button) {
-        if (button) {
-            const css = `
-                display: flex !important;
-                align-items: center !important;
-                height: 1rem !important;
-                line-height: unset !important;
-                padding: unset !important;
-                background: unset !important;
-                font-size: var(--pep-button-2xs-font-size) !important;
-                visibility: ${this.getVisibility()};
-            `;
-            button.setAttribute("style", css);
-        }
-    }
-    setSvgStyle(svg) {
-        const css = `
-            transform: rotate(270deg);
-            width: 0.75rem;
-        `;
-        svg.setAttribute('style', css);
-    }
-    getResetElement() {
-        return __awaiter(this, void 0, void 0, function* () {
-            this.setButtonContainerStyle();
-            this.renderer.addClass(this.buttonContainer, 'pep-reset-configuration-field-container');
-            // Append button
-            this.resetButton = this.renderer.createElement('button');
-            yield this.translate.get('ACTIONS.RESET').toPromise().then(resetText => {
-                const buttonText = this.renderer.createText(resetText);
-                this.renderer.appendChild(this.resetButton, buttonText);
-            });
-            this.renderer.addClass(this.resetButton, 'pep-button');
-            // this.renderer.addClass(button, this.styleType);
-            // this.renderer.addClass(button, this.styleStateType);
-            this.renderer.addClass(this.resetButton, 'color-link');
-            this.renderer.addClass(this.resetButton, this.sizeType);
-            this.setButtonStyle(this.resetButton);
-            // this.renderer.addClass(button, 'reset-configuration-field-button');
-            this.unlistener = this.renderer.listen(this.resetButton, 'click', () => this.onResetClicked());
-            this.renderer.appendChild(this.buttonContainer, this.resetButton);
-            // Append svg
-            const svgIcon = this.pepIconService.getSvgIcon(pepIconDeviceResponsive.name);
-            this.setSvgStyle(svgIcon);
-            this.renderer.appendChild(this.buttonContainer, svgIcon);
-            return this.buttonContainer;
-        });
-    }
-    ngAfterViewInit() {
-        this.getResetElement().then(element => {
-            var _a;
-            if (this.resetPosition === 'top-end' && ((_a = this.element.nativeElement.children) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-                this.renderer.insertBefore(this.element.nativeElement, element, this.element.nativeElement.children[0]);
-            }
-            else {
-                this.renderer.appendChild(this.element.nativeElement, element);
-            }
-        });
-    }
-    ngOnDestroy() {
-        if (this.unlistener) {
-            this.unlistener();
-        }
-    }
-    onResetClicked() {
-        this.resetHostEvents.emit({
-            action: 'set-configuration-field',
-            key: this.resetFieldKey,
-            value: undefined
-        });
-    }
-}
-PepResetConfigurationFieldDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepResetConfigurationFieldDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1.PepIconService }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Directive });
-PepResetConfigurationFieldDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.2", type: PepResetConfigurationFieldDirective, selector: "[pepResetConfigurationField]", inputs: { resetFieldKey: ["pepResetConfigurationField", "resetFieldKey"], resetHostEvents: "resetHostEvents", disabled: "disabled", hideReset: "hideReset", dir: "dir" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepResetConfigurationFieldDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[pepResetConfigurationField]',
-                }]
-        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i1.PepIconService }, { type: i2.TranslateService }]; }, propDecorators: { resetFieldKey: [{
-                type: Input,
-                args: ['pepResetConfigurationField']
-            }], resetHostEvents: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], hideReset: [{
-                type: Input
-            }], dir: [{
-                type: Input
-            }] } });
-
-/*
-    This service is for utillity usege.
-*/
-class PepCompositeLibUtilitiesService {
-    constructor() {
-        //
-    }
-}
-PepCompositeLibUtilitiesService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepCompositeLibUtilitiesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-PepCompositeLibUtilitiesService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepCompositeLibUtilitiesService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepCompositeLibUtilitiesService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: function () { return []; } });
-
-class PepDIMXHelperService {
-    constructor(addonBlockLoaderService) {
-        this.addonBlockLoaderService = addonBlockLoaderService;
-    }
-    register(viewContainerRef, dimxHostObject, onDIMXProcessDoneCallback) {
-        return this.addonBlockLoaderService.loadAddonBlockInContainer({
-            container: viewContainerRef,
-            name: 'DIMX',
-            hostObject: dimxHostObject,
-            hostEventsCallback: (event) => {
-                if (event.action === 'DIMXFunctionsRegister') {
-                    this.dimxFunctions = event.value;
-                }
-                else if (event.action === 'DIMXProcessDone') {
-                    onDIMXProcessDoneCallback(event.value);
-                }
-                else {
-                    console.error('Unknown event action: ' + event.action);
-                }
-            }
-        });
-    }
-    import(options) {
-        var _a;
-        if (typeof ((_a = this.dimxFunctions) === null || _a === void 0 ? void 0 : _a.DIMXImport) === 'function') {
-            this.dimxFunctions.DIMXImport(options);
-        }
-        else {
-            console.error('DIMXImport function not found, are you registered?');
-        }
-    }
-    recursive_import(options) {
-        var _a;
-        if (typeof ((_a = this.dimxFunctions) === null || _a === void 0 ? void 0 : _a.DIMXRecursiveImport) === 'function') {
-            this.dimxFunctions.DIMXRecursiveImport(options);
-        }
-        else {
-            console.error('DIMXRecursiveImport function not found, are you registered?');
-        }
-    }
-    export(options) {
-        var _a;
-        if (typeof ((_a = this.dimxFunctions) === null || _a === void 0 ? void 0 : _a.DIMXExport) === 'function') {
-            this.dimxFunctions.DIMXExport(options);
-        }
-        else {
-            console.error('DIMXExport function not found, are you registered?');
-        }
-    }
-    recursive_export(options) {
-        var _a;
-        if (typeof ((_a = this.dimxFunctions) === null || _a === void 0 ? void 0 : _a.DIMXRecursiveExport) === 'function') {
-            this.dimxFunctions.DIMXRecursiveExport(options);
-        }
-        else {
-            console.error('DIMXRecursiveExport function not found, are you registered?');
-        }
-    }
-}
-PepDIMXHelperService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDIMXHelperService, deps: [{ token: i1$1.PepAddonBlockLoaderService }], target: i0.ɵɵFactoryTarget.Injectable });
-PepDIMXHelperService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDIMXHelperService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDIMXHelperService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i1$1.PepAddonBlockLoaderService }]; } });
-
-/*
- * Public API Surface of ngx-composite-lib/core/common/services
- */
-
-/*
- * export from ngx-composite-lib/core/common/services
- */
-
-const utilitiesList = [
-    PepResetConfigurationFieldDirective
-];
-class PepNgxCompositeLibModule {
-    constructor(pepIconRegistry) {
-        this.pepIconRegistry = pepIconRegistry;
-        this.pepIconRegistry.registerIcons([
-            pepIconDeviceResponsive
-        ]);
-    }
-}
-PepNgxCompositeLibModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepNgxCompositeLibModule, deps: [{ token: i1.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
-PepNgxCompositeLibModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepNgxCompositeLibModule, declarations: [PepResetConfigurationFieldDirective], imports: [CommonModule,
-        PepIconModule,
-        PepRemoteLoaderModule], exports: [PepResetConfigurationFieldDirective] });
-PepNgxCompositeLibModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepNgxCompositeLibModule, providers: [
-        PepDIMXHelperService,
-        PepCompositeLibUtilitiesService
-    ], imports: [CommonModule,
-        PepIconModule,
-        PepRemoteLoaderModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepNgxCompositeLibModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        utilitiesList
-                    ],
-                    imports: [
-                        CommonModule,
-                        PepIconModule,
-                        PepRemoteLoaderModule,
-                    ],
-                    exports: [
-                        utilitiesList
-                        //TranslateModule
-                    ],
-                    providers: [
-                        PepDIMXHelperService,
-                        PepCompositeLibUtilitiesService
-                    ]
-                }]
-        }], ctorParameters: function () { return [{ type: i1.PepIconRegistry }]; } });
-
-/*
- * Public API Surface of ngx-composite-lib/core/common/directives
- */
-
-/*
- * export from ngx-composite-lib/core/common/directives
- */
-
-/*
- * Public API Surface of ngx-composite-lib/core/common
- */
-
-/*
- * export from ngx-composite-lib/core/common
- */
-
-/*
- * Public API Surface of ngx-composite-lib/core
- */
-
-/*
- * export from ngx-composite-lib/core
- */
-
-/*
- * Public API Surface of ngx-composite-lib
- */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { PepCompositeLibUtilitiesService, PepDIMXHelperService, PepNgxCompositeLibModule, PepResetConfigurationFieldDirective };
-//# sourceMappingURL=pepperi-addons-ngx-composite-lib.mjs.map