@pepperi-addons/ngx-lib 0.2.53 → 0.2.57-beta.1

package/fesm2015/pepperi-addons-ngx-lib-slider.js

@@ -25,7 +25,7 @@ class PepSliderComponent {
         this.step = 1;
         this.minValue = NaN;
         this.maxValue = NaN;
-        this._value = null;
+        this._value = NaN;
         this.valueChange = new EventEmitter();
         this.inputChange = new EventEmitter();
         this.xAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;

package/fesm2015/pepperi-addons-ngx-lib-slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"pepperi-addons-ngx-lib-slider.js","sources":["../../../projects/ngx-lib/slider/slider.component.ts","../../../projects/ngx-lib/slider/slider.module.ts","../../../projects/ngx-lib/slider/public-api.ts","../../../projects/ngx-lib/slider/pepperi-addons-ngx-lib-slider.ts"],"sourcesContent":["import {\n    Component,\n    OnDestroy,\n    Input,\n    Output,\n    EventEmitter,\n    Renderer2,\n    ElementRef,\n    OnInit,\n    ViewChild,\n} from '@angular/core';\nimport { PepLayoutService, DEFAULT_HORIZONTAL_ALIGNMENT, PepHorizontalAlignment } from '@pepperi-addons/ngx-lib';\n\n/**\n * This is a slider component that support pepperi theme\n * style & state & sizes\n *\n * @export\n * @class PepSliderComponent\n * @implements {OnDestroy}\n */\n@Component({\n    selector: 'pep-slider',\n    templateUrl: './slider.component.html',\n    styleUrls: ['./slider.component.scss'],\n})\nexport class PepSliderComponent implements OnInit {\n    @Input() label = '';\n    @Input() disabled = false;\n    @Input() hint = '';\n\n    private _background = '';\n    @Input()\n    set background(background: string) {\n        if (!background) {\n            background = '';\n        }\n\n        this._background = background;\n        this.setBackground();\n    }\n    get background(): string {\n        return this._background;\n    }\n\n    @Input() step = 1;\n    @Input() minValue = NaN;\n    @Input() maxValue = NaN;\n\n    private _value: number | null = null;\n    @Input()\n    set value(value: number | null) {\n        this._value = value;\n    }\n    get value(): number | null {\n        return this._value;\n    }\n\n    @Output()\n    valueChange: EventEmitter<number | null> = new EventEmitter<number | null>();\n\n    @Output()\n    inputChange: EventEmitter<number | null> = new EventEmitter<number | null>();\n\n    xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\n    sliderWrapper: any = null;\n\n    constructor(private renderer: Renderer2, private element: ElementRef, private pepLayoutService: PepLayoutService) { }\n\n    private setBackground(): void {\n        // Get the wrapper for set the background.\n        if (!this.sliderWrapper) {\n            this.sliderWrapper = this.element.nativeElement.querySelector('.mat-slider-wrapper');\n        }\n\n        if (this.sliderWrapper) {\n            this.renderer.setStyle(this.sliderWrapper, 'background', this.background?.length > 0 ? this.background : '');\n\n            if (this.background?.length > 0) {\n                this.renderer.removeClass(this.sliderWrapper, 'background-color-dimmed');\n            } else {\n                this.renderer.addClass(this.sliderWrapper, 'background-color-dimmed');\n            }\n        }\n    }\n\n    ngOnInit(): void {\n        this.xAlignment = this.pepLayoutService.isRtl() ? 'right' : 'left';\n        this.setBackground();\n    }\n\n    onValueChange(event) {\n        this.valueChange.emit(event.value);\n    }\n\n    onInputChange(event) {\n        this.inputChange.emit(event.value);\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { MatCommonModule } from '@angular/material/core';\nimport { MatSliderModule } from '@angular/material/slider';\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\n\nimport { PepSliderComponent } from './slider.component';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        // Material modules\n        MatCommonModule,\n        MatSliderModule,\n        // ngx-lib modules\n        PepNgxLibModule,\n        PepFieldTitleModule,\n    ],\n    exports: [PepSliderComponent],\n    declarations: [PepSliderComponent],\n})\nexport class PepSliderModule { }\n","/*\n * Public API Surface of ngx-lib/slider\n */\nexport * from './slider.module';\nexport * from './slider.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"pepperi-addons-ngx-lib-slider.js","sources":["../../../projects/ngx-lib/slider/slider.component.ts","../../../projects/ngx-lib/slider/slider.module.ts","../../../projects/ngx-lib/slider/public-api.ts","../../../projects/ngx-lib/slider/pepperi-addons-ngx-lib-slider.ts"],"sourcesContent":["import {\n    Component,\n    OnDestroy,\n    Input,\n    Output,\n    EventEmitter,\n    Renderer2,\n    ElementRef,\n    OnInit,\n    ViewChild,\n} from '@angular/core';\nimport { PepLayoutService, DEFAULT_HORIZONTAL_ALIGNMENT, PepHorizontalAlignment } from '@pepperi-addons/ngx-lib';\n\n/**\n * This is a slider component that support pepperi theme\n * style & state & sizes\n *\n * @export\n * @class PepSliderComponent\n * @implements {OnDestroy}\n */\n@Component({\n    selector: 'pep-slider',\n    templateUrl: './slider.component.html',\n    styleUrls: ['./slider.component.scss'],\n})\nexport class PepSliderComponent implements OnInit {\n    @Input() label = '';\n    @Input() disabled = false;\n    @Input() hint = '';\n\n    private _background = '';\n    @Input()\n    set background(background: string) {\n        if (!background) {\n            background = '';\n        }\n\n        this._background = background;\n        this.setBackground();\n    }\n    get background(): string {\n        return this._background;\n    }\n\n    @Input() step = 1;\n    @Input() minValue = NaN;\n    @Input() maxValue = NaN;\n\n    private _value = NaN;\n    @Input()\n    set value(value: number) {\n        this._value = value;\n    }\n    get value(): number {\n        return this._value;\n    }\n\n    @Output()\n    valueChange: EventEmitter<number> = new EventEmitter<number>();\n\n    @Output()\n    inputChange: EventEmitter<number> = new EventEmitter<number>();\n\n    xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\n    sliderWrapper: any = null;\n\n    constructor(private renderer: Renderer2, private element: ElementRef, private pepLayoutService: PepLayoutService) { }\n\n    private setBackground(): void {\n        // Get the wrapper for set the background.\n        if (!this.sliderWrapper) {\n            this.sliderWrapper = this.element.nativeElement.querySelector('.mat-slider-wrapper');\n        }\n\n        if (this.sliderWrapper) {\n            this.renderer.setStyle(this.sliderWrapper, 'background', this.background?.length > 0 ? this.background : '');\n\n            if (this.background?.length > 0) {\n                this.renderer.removeClass(this.sliderWrapper, 'background-color-dimmed');\n            } else {\n                this.renderer.addClass(this.sliderWrapper, 'background-color-dimmed');\n            }\n        }\n    }\n\n    ngOnInit(): void {\n        this.xAlignment = this.pepLayoutService.isRtl() ? 'right' : 'left';\n        this.setBackground();\n    }\n\n    onValueChange(event) {\n        this.valueChange.emit(event.value);\n    }\n\n    onInputChange(event) {\n        this.inputChange.emit(event.value);\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { MatCommonModule } from '@angular/material/core';\nimport { MatSliderModule } from '@angular/material/slider';\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\n\nimport { PepSliderComponent } from './slider.component';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        // Material modules\n        MatCommonModule,\n        MatSliderModule,\n        // ngx-lib modules\n        PepNgxLibModule,\n        PepFieldTitleModule,\n    ],\n    exports: [PepSliderComponent],\n    declarations: [PepSliderComponent],\n})\nexport class PepSliderModule { }\n","/*\n * Public API Surface of ngx-lib/slider\n */\nexport * from './slider.module';\nexport * from './slider.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2015/pepperi-addons-ngx-lib-top-bar.js

@@ -81,7 +81,7 @@ PepTopBarComponent.decorators = [
     { type: Component, args: [{
                 selector: 'pep-top-bar',
                 template: "<div pepRtlDirection [hidden]=\"isHidden\" class=\"pep-top-bar-container\" [ngClass]=\"{ inline: inline }\">\n    <div class=\"header-content\">\n        <div class=\"main-layout\">\n            <div class=\"content pep-border-bottom\">\n                <div class=\"left-container pep-spacing-element-negative\">\n                    <ng-container *ngTemplateOutlet=\"listActionsTemplate\"></ng-container>\n                    <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n                    <ng-container *ngTemplateOutlet=\"listChooserTemplate\"></ng-container>\n                    <ng-container *ngTemplateOutlet=\"leftContentTemplate\"></ng-container>\n                    <ng-container *ngTemplateOutlet=\"listTotalTemplate\"></ng-container>\n                </div>\n                <div class=\"pep-spacing-element\"></div>\n                <div class=\"right-container pep-spacing-element-negative\">\n                    <ng-container *ngTemplateOutlet=\"searchTemplate\"></ng-container>\n                    <ng-container *ngTemplateOutlet=\"sortingTemplate\"></ng-container>\n                    <ng-container *ngTemplateOutlet=\"viewsTemplate\"></ng-container>\n                    <ng-container *ngTemplateOutlet=\"rightContentTemplate\"></ng-container>\n                </div>\n            </div>\n        </div>\n    </div>\n\n    <!-- hasFooterContent === null is for the first load to see if there is data in the (footer-start-content || footer-end-content). -->\n    <div *ngIf=\"hasFooterContent === null || (hasFooterContent && footerState === 'visible')\" class=\"footer\"\n        [style.height.rem]=\"customizationService.footerHeight\">\n        <div class=\"content pep-border-top\">\n            <div #footerStartContent class=\"left-container pep-spacing-element-negative flex-wrapper\">\n                <ng-content select=\"[footer-start-content]\"></ng-content>\n            </div>\n            <div #footerEndContent class=\"right-container pep-spacing-element-negative flex-wrapper\">\n                <ng-content select=\"[footer-end-content]\"></ng-content>\n            </div>\n        </div>\n        <!-- <ng-container *ngIf=\"showFooter && screenSize >= PepScreenSizeType.MD; then footerBlock; else noFooterBlock\">\n        </ng-container>\n        <ng-template #footerBlock>\n            {{ customizationService.showFooter() }}\n        </ng-template>\n        <ng-template #noFooterBlock>\n            {{ customizationService.hideFooter() }}\n        </ng-template> -->\n    </div>\n\n</div>\n\n<!-- Left side templates -->\n<ng-template #listActionsTemplate>\n    <div class=\"list-actions-wrapper\">\n        <ng-content *ngIf=\"!searchIsOpenAndSmallDevice\" select=\"pep-list-actions\"></ng-content>\n    </div>\n</ng-template>\n\n<ng-template #titleTemplate>\n    <div *ngIf=\"title?.length > 0\" class=\"pep-spacing-element title {{ inline ? 'title-md' : 'title-lg' }}\">\n        <span [title]=\"title\">{{ title }}</span>\n    </div>\n</ng-template>\n\n<ng-template #listChooserTemplate>\n    <div *ngIf=\"!searchIsOpenAndSmallDevice\" [ngClass]=\"{ 'pep-spacing-element': listChooserComp }\">\n        <ng-content select=\"pep-list-chooser\"></ng-content>\n    </div>\n</ng-template>\n\n<ng-template #leftContentTemplate>\n    <div *ngIf=\"!searchIsOpenAndSmallDevice\" class=\"flex-wrapper\">\n        <ng-content select=\"[header-start-content]\"></ng-content>\n    </div>\n</ng-template>\n\n<ng-template #listTotalTemplate>\n    <div *ngIf=\"!searchIsOpenAndSmallDevice\" [ngClass]=\"{ 'pep-spacing-element': listTotalComp }\">\n        <ng-content select=\"pep-list-total\"></ng-content>\n    </div>\n</ng-template>\n\n<!-- Right side templates -->\n<ng-template #searchTemplate>\n    <div [ngClass]=\"{ 'pep-spacing-element': searchComp }\">\n        <ng-content select=\"pep-search\"></ng-content>\n    </div>\n</ng-template>\n\n<ng-template #sortingTemplate>\n    <div *ngIf=\"!searchIsOpenAndSmallDevice\" [ngClass]=\"{ 'pep-spacing-element': listSortingComp }\">\n        <ng-content select=\"pep-list-sorting\"></ng-content>\n    </div>\n</ng-template>\n\n<ng-template #viewsTemplate>\n    <div *ngIf=\"!searchIsOpenAndSmallDevice\" [ngClass]=\"{ 'pep-spacing-element': listViewsComp }\" class=\"flex-wrapper\">\n        <ng-content select=\"pep-list-views\"></ng-content>\n    </div>\n</ng-template>\n\n<ng-template #rightContentTemplate>\n    <div *ngIf=\"!searchIsOpenAndSmallDevice\" class=\"flex-wrapper\">\n        <ng-content select=\"[header-end-content]\"></ng-content>\n    </div>\n</ng-template>",
-                styles: [".pep-top-bar-container{display:grid;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));z-index:101}.pep-top-bar-container .title{display:inline-flex!important;align-items:center;justify-content:center}.pep-top-bar-container .header-content{height:calc(.5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));margin-top:1.5rem;margin-top:var(--pep-top-bar-spacing-top,1.5rem)}.pep-top-bar-container .header-content .main-layout{width:inherit;height:inherit;padding:0}.pep-top-bar-container .header-content .main-layout .content{display:flex;justify-content:space-between;height:inherit}.pep-top-bar-container .header-content .main-layout .content .left-container,.pep-top-bar-container .header-content .main-layout .content .right-container{height:inherit}.pep-top-bar-container .footer{position:fixed;bottom:0;left:0;right:0;height:4.5rem;height:var(--pep-footer-bar-height,4.5rem)}.pep-top-bar-container .footer .content{display:flex;justify-content:space-between;margin-inline:calc(1rem * 2);margin-inline:calc(var(--pep-spacing-lg, 1rem) * 2);padding-top:.75rem;padding-top:var(--pep-footer-bar-spacing-top,.75rem)}@media (max-width:599px){.pep-top-bar-container .footer .content{margin-inline:1rem;margin-inline:var(--pep-spacing-lg,1rem)}}.pep-top-bar-container .left-container{display:flex}.pep-top-bar-container .right-container{display:flex;justify-content:flex-end}.pep-top-bar-container .flex-wrapper ::ng-deep>*{display:flex}.pep-top-bar-container .list-actions-wrapper ::ng-deep.pep-button{margin-right:.25rem;margin-right:var(--pep-spacing-xs,.25rem);margin-left:.25rem;margin-left:var(--pep-spacing-xs,.25rem)}.pep-top-bar-container:not(.inline) .pep-button,.pep-top-bar-container:not(.inline) .pepperi-button,.pep-top-bar-container:not(.inline) ::ng-deep .pep-button,.pep-top-bar-container:not(.inline) ::ng-deep .pepperi-button{height:2.5rem;height:var(--pep-top-bar-field-height,2.5rem);line-height:2.5rem;line-height:var(--pep-top-bar-field-height,2.5rem)}.pep-top-bar-container.inline{position:inherit;height:calc(.5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));width:100%}.pep-top-bar-container.inline .header-content{margin-top:0;height:2.5rem;height:var(--pep-top-bar-field-height,2.5rem);padding:0;position:inherit;width:inherit}.pep-top-bar-container.inline .header-content .main-layout{width:inherit;height:inherit;padding:0}.pep-top-bar-container.inline .header-content .main-layout .content{height:inherit;margin:0}"]
+                styles: [".pep-top-bar-container{display:grid;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));z-index:101}.pep-top-bar-container .title{display:inline-flex!important;align-items:center;justify-content:center}.pep-top-bar-container .header-content{height:calc(.5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));margin-top:1.5rem;margin-top:var(--pep-top-bar-spacing-top,1.5rem)}.pep-top-bar-container .header-content .main-layout{width:inherit;height:inherit;padding:0}.pep-top-bar-container .header-content .main-layout .content{display:flex;justify-content:space-between;height:inherit}.pep-top-bar-container .header-content .main-layout .content .left-container,.pep-top-bar-container .header-content .main-layout .content .right-container{height:inherit}.pep-top-bar-container .footer{position:fixed;bottom:0;left:0;right:0;height:4.5rem;height:var(--pep-footer-bar-height,4.5rem)}.pep-top-bar-container .footer .content{display:flex;justify-content:space-between;margin-inline:calc(1rem * 2);margin-inline:calc(var(--pep-spacing-lg, 1rem) * 2);padding-top:.75rem;padding-top:var(--pep-footer-bar-spacing-top,.75rem)}@media (max-width:599px){.pep-top-bar-container .footer .content{margin-inline:1rem;margin-inline:var(--pep-spacing-lg,1rem)}}.pep-top-bar-container .left-container{display:flex;align-items:center}.pep-top-bar-container .right-container{display:flex;justify-content:flex-end;align-items:center}.pep-top-bar-container .flex-wrapper ::ng-deep>*{display:flex}.pep-top-bar-container .list-actions-wrapper ::ng-deep.pep-button{margin-right:.25rem;margin-right:var(--pep-spacing-xs,.25rem);margin-left:.25rem;margin-left:var(--pep-spacing-xs,.25rem)}.pep-top-bar-container:not(.inline) .pep-button,.pep-top-bar-container:not(.inline) .pepperi-button,.pep-top-bar-container:not(.inline) ::ng-deep .pep-button,.pep-top-bar-container:not(.inline) ::ng-deep .pepperi-button{height:2.5rem;height:var(--pep-top-bar-field-height,2.5rem);line-height:2.5rem;line-height:var(--pep-top-bar-field-height,2.5rem)}.pep-top-bar-container.inline{position:inherit;height:calc(.5rem + 2.5rem);height:calc(var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));width:100%}.pep-top-bar-container.inline .header-content{margin-top:0;height:2.5rem;height:var(--pep-top-bar-field-height,2.5rem);padding:0;position:inherit;width:inherit}.pep-top-bar-container.inline .header-content .main-layout{width:inherit;height:inherit;padding:0}.pep-top-bar-container.inline .header-content .main-layout .content{height:inherit;margin:0}"]
             },] }
 ];
 PepTopBarComponent.ctorParameters = () => [

package/fesm2015/pepperi-addons-ngx-lib.js

@@ -1593,6 +1593,216 @@ PepSessionService.ctorParameters = () => [
     { type: PepJwtHelperService }
 ];
 
+class PepFileService {
+    constructor() {
+        this.scripts = new Map();
+        this.styles = new Map();
+    }
+    loadFiles(files) {
+        const promises = [];
+        files.forEach((file) => {
+            if (file.type === 'style') {
+                promises.push(this.loadStyle(file.path));
+            }
+            else if (file.type === 'script') {
+                promises.push(this.loadScript(file.path));
+            }
+        });
+        return Promise.all(promises);
+    }
+    removeFiles(files) {
+        for (let index = 0; index < files.length &&
+            files[index].path &&
+            files[index].path.trim() !== ''; index++) {
+            const name = this.getFileName(files[index].path, true);
+            const element = document.getElementById(name);
+            element.parentNode.removeChild(element);
+            if (files[index].type === 'script' && this.scripts.has(name)) {
+                this.scripts.delete(name);
+            }
+            else if (files[index].type === 'style' && this.styles.has(name)) {
+                this.styles.delete(name);
+            }
+        }
+    }
+    loadScript(path) {
+        return new Promise((resolve, reject) => {
+            const name = this.getFileName(path, true);
+            // If the script isn't exist add it.
+            if (!this.scripts.has(name)) {
+                this.scripts.set(name, { loaded: false, src: path });
+            }
+            const scriptItem = this.scripts.get(name);
+            // Resolve if already loaded
+            if (scriptItem.loaded) {
+                resolve({
+                    script: name,
+                    loaded: true,
+                    status: 'Already Loaded',
+                });
+            }
+            else {
+                // Load script
+                const script = document.createElement('script');
+                script.type = 'text/javascript';
+                script.src = scriptItem.src;
+                script.setAttribute('id', name);
+                script.async = false;
+                if (script.readyState) {
+                    // IE
+                    script.onreadystatechange = () => {
+                        if (script.readyState === 'loaded' ||
+                            script.readyState === 'complete') {
+                            script.onreadystatechange = null;
+                            scriptItem.loaded = true;
+                            resolve({
+                                path,
+                                type: 'script',
+                                loaded: true,
+                                status: 'Loaded',
+                            });
+                        }
+                    };
+                }
+                else {
+                    // Others
+                    script.onload = () => {
+                        scriptItem.loaded = true;
+                        resolve({
+                            path,
+                            type: 'script',
+                            loaded: true,
+                            status: 'Loaded',
+                        });
+                    };
+                }
+                script.onerror = (error) => resolve({
+                    path,
+                    type: 'script',
+                    loaded: false,
+                    status: 'Loaded',
+                });
+                document.getElementsByTagName('head')[0].appendChild(script);
+            }
+        });
+    }
+    loadStyle(path) {
+        return new Promise((resolve, reject) => {
+            const name = this.getFileName(path, true);
+            // If the style isn't exist add it.
+            if (!this.styles.has(name)) {
+                this.styles.set(name, { loaded: false, src: path });
+            }
+            const styleItem = this.styles.get(name);
+            // Resolve if already loaded
+            if (styleItem.loaded) {
+                resolve({
+                    path,
+                    type: 'style',
+                    loaded: true,
+                    status: 'Already Loaded',
+                });
+            }
+            else {
+                // Load style
+                const style = document.createElement('link');
+                style.type = 'text/css';
+                style.rel = 'stylesheet';
+                style.href = styleItem.src;
+                style.media = 'all';
+                style.setAttribute('id', name);
+                styleItem.loaded = true;
+                resolve({
+                    path,
+                    type: 'style',
+                    loaded: true,
+                    status: 'Loaded',
+                });
+                document.getElementsByTagName('head')[0].appendChild(style);
+            }
+        });
+    }
+    loadFontStyle(styleId, href) {
+        const head = document.getElementsByTagName('head')[0];
+        const styleElement = document.getElementById(styleId);
+        if (styleElement) {
+            styleElement.href = href;
+        }
+        else {
+            const style = document.createElement('link');
+            style.id = styleId;
+            style.rel = 'stylesheet';
+            style.href = `${href}`;
+            head.appendChild(style);
+        }
+    }
+    getFileName(filePath, withExtenstion = false) {
+        const lastIndex = withExtenstion
+            ? filePath.length - 1
+            : filePath.lastIndexOf('.');
+        return filePath.substr(filePath.lastIndexOf('/') + 1, lastIndex);
+    }
+    getFileExtension(filePath) {
+        const fileSplit = filePath.split('.');
+        let fileExt = '';
+        if (fileSplit.length > 1) {
+            fileExt = fileSplit[fileSplit.length - 2];
+        }
+        return fileExt;
+    }
+    /* Returns true if url is valid */
+    isValidUrl(url) {
+        /* Try creating a valid URL */
+        try {
+            const tmp = new URL(url);
+            return true;
+        }
+        catch (e) {
+            return false;
+        }
+    }
+    convertFromb64toBlob(b64Data, contentType = '', sliceSize = 512) {
+        const byteCharacters = atob(b64Data);
+        const byteArrays = [];
+        for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
+            const slice = byteCharacters.slice(offset, offset + sliceSize);
+            const byteNumbers = new Array(slice.length);
+            for (let i = 0; i < slice.length; i++) {
+                byteNumbers[i] = slice.charCodeAt(i);
+            }
+            const byteArray = new Uint8Array(byteNumbers);
+            byteArrays.push(byteArray);
+        }
+        const blob = new Blob(byteArrays, { type: contentType });
+        return blob;
+    }
+    getAssetsPath(assetsDomain = '') {
+        const concatChar = assetsDomain === '' || assetsDomain.endsWith('/') ? '' : '/';
+        return `${assetsDomain}${concatChar}assets/ngx-lib/`;
+    }
+    getAssetsTranslationsSuffix() {
+        return '.ngx-lib.json';
+    }
+    getAssetsTranslationsPath(assetsDomain = '') {
+        return `${this.getAssetsPath(assetsDomain)}i18n/`;
+    }
+    getAssetsImagesPath(assetsDomain = '', image = '') {
+        return `${this.getAssetsPath(assetsDomain)}images/${image}`;
+    }
+    getSvgAsImageSrc(svg) {
+        const blob = new Blob([svg], { type: 'image/svg+xml' });
+        const url = URL.createObjectURL(blob);
+        return url;
+    }
+}
+PepFileService.ɵprov = i0.ɵɵdefineInjectable({ factory: function PepFileService_Factory() { return new PepFileService(); }, token: PepFileService, providedIn: "root" });
+PepFileService.decorators = [
+    { type: Injectable, args: [{
+                providedIn: 'root',
+            },] }
+];
+PepFileService.ctorParameters = () => [];
+
 class PepCookieService {
     constructor(document, platformId) {
         this.document = document;
@@ -1888,14 +2098,59 @@ PepHttpService.ctorParameters = () => [
     { type: HttpClient }
 ];
 
+/*
+    This service is the webapp api for addon usege.
+*/
+class PepTranslateService {
+    constructor(http
+    // private sessionService: PepSessionService,
+    // private httpService: PepHttpService,
+    // private loaderService: PepLoaderService
+    ) {
+        this.http = http;
+        //
+    }
+    createMultiTranslateLoader(resources) {
+        return new MultiTranslateHttpLoader(this.http, resources);
+    }
+    setDefaultTranslateLang(translate, urlLangParam = 'userLang') {
+        let userLang = 'en';
+        translate.setDefaultLang(userLang);
+        userLang = translate.getBrowserLang().split('-')[0]; // use navigator lang if available
+        if (urlLangParam.length > 0) {
+            const index = location.href.indexOf(urlLangParam);
+            if (index > -1) {
+                // urlLangParam=XX
+                const startIndex = index + urlLangParam.length + '='.length;
+                userLang = location.href.substring(startIndex, startIndex + 2);
+            }
+        }
+        // the lang to use, if the lang isn't available, it will use the current loader to get them
+        translate.use(userLang).subscribe((res) => {
+            // In here you can put the code you want. At this point the lang will be loaded
+        });
+    }
+}
+PepTranslateService.ɵprov = i0.ɵɵdefineInjectable({ factory: function PepTranslateService_Factory() { return new PepTranslateService(i0.ɵɵinject(i3.HttpClient)); }, token: PepTranslateService, providedIn: "root" });
+PepTranslateService.decorators = [
+    { type: Injectable, args: [{
+                providedIn: 'root',
+            },] }
+];
+PepTranslateService.ctorParameters = () => [
+    { type: HttpClient }
+];
+
 /*
     This service is the webapp api for addon usege.
 */
 class PepAddonService {
-    constructor(sessionService, httpService, loaderService) {
+    constructor(sessionService, httpService, loaderService, translateService, fileService) {
         this.sessionService = sessionService;
         this.httpService = httpService;
         this.loaderService = loaderService;
+        this.translateService = translateService;
+        this.fileService = fileService;
         this.ADDON_ASSETS_PATH_KEY = 'AddonAssetsPath';
         this.ADDONS_DICTIONARY_ASSETS_PATH_KEY = 'AddonsDictionaryAssetsPath';
         this.ADDON_API_RELATIVE_PATH = '/addons/api';
@@ -1940,41 +2195,36 @@ class PepAddonService {
             this.loaderService.hide();
         });
     }
-    static createDefaultMultiTranslateLoader(http, fileService, addonService, subAddonUUID = '') {
-        const addonStaticFolder = addonService.getAddonStaticFolder(subAddonUUID);
-        const translationsPath = fileService.getAssetsTranslationsPath(addonStaticFolder);
-        const translationsSuffix = fileService.getAssetsTranslationsSuffix();
+    getNgxLibTranslationResource(subAddonUUID = '') {
+        const addonStaticFolder = this.getAddonStaticFolder(subAddonUUID);
+        const translationsPath = this.fileService.getAssetsTranslationsPath(addonStaticFolder);
+        const translationsSuffix = this.fileService.getAssetsTranslationsSuffix();
+        return {
+            prefix: translationsPath,
+            suffix: translationsSuffix,
+        };
+    }
+    getAddonTranslationResource(subAddonUUID = '') {
+        const addonStaticFolder = this.getAddonStaticFolder(subAddonUUID);
         const defaultSubFolder = 'assets/i18n/';
-        return new MultiTranslateHttpLoader(http, [
-            {
-                prefix: translationsPath,
-                suffix: translationsSuffix,
-            },
-            {
-                prefix: addonStaticFolder.length > 0 ? `${addonStaticFolder}${defaultSubFolder}` : `/${defaultSubFolder}`,
-                suffix: '.json',
-            },
-        ]);
+        return {
+            prefix: addonStaticFolder.length > 0 ? `${addonStaticFolder}${defaultSubFolder}` : `/${defaultSubFolder}`,
+            suffix: '.json',
+        };
     }
     setDefaultTranslateLang(translate, urlLangParam = 'userLang') {
-        let userLang = 'en';
-        translate.setDefaultLang(userLang);
-        userLang = translate.getBrowserLang().split('-')[0]; // use navigator lang if available
-        if (urlLangParam.length > 0) {
-            const index = location.href.indexOf(urlLangParam);
-            if (index > -1) {
-                // urlLangParam=XX
-                const startIndex = index + urlLangParam.length + '='.length;
-                userLang = location.href.substring(startIndex, startIndex + 2);
-            }
-        }
-        // the lang to use, if the lang isn't available, it will use the current loader to get them
-        translate.use(userLang).subscribe((res) => {
-            // In here you can put the code you want. At this point the lang will be loaded
-        });
+        this.translateService.setDefaultTranslateLang(translate, urlLangParam);
+    }
+    static createDefaultMultiTranslateLoader(http, fileService, addonService, subAddonUUID = '') {
+        const ngxLibTranslationResource = addonService.getNgxLibTranslationResource(subAddonUUID);
+        const addonTranslationResource = addonService.getAddonTranslationResource(subAddonUUID);
+        return addonService.translateService.createMultiTranslateLoader([
+            ngxLibTranslationResource,
+            addonTranslationResource
+        ]);
     }
 }
-PepAddonService.ɵprov = i0.ɵɵdefineInjectable({ factory: function PepAddonService_Factory() { return new PepAddonService(i0.ɵɵinject(PepSessionService), i0.ɵɵinject(PepHttpService), i0.ɵɵinject(PepLoaderService)); }, token: PepAddonService, providedIn: "root" });
+PepAddonService.ɵprov = i0.ɵɵdefineInjectable({ factory: function PepAddonService_Factory() { return new PepAddonService(i0.ɵɵinject(PepSessionService), i0.ɵɵinject(PepHttpService), i0.ɵɵinject(PepLoaderService), i0.ɵɵinject(PepTranslateService), i0.ɵɵinject(PepFileService)); }, token: PepAddonService, providedIn: "root" });
 PepAddonService.decorators = [
     { type: Injectable, args: [{
                 providedIn: 'root',
@@ -1983,7 +2233,9 @@ PepAddonService.decorators = [
 PepAddonService.ctorParameters = () => [
     { type: PepSessionService },
     { type: PepHttpService },
-    { type: PepLoaderService }
+    { type: PepLoaderService },
+    { type: PepTranslateService },
+    { type: PepFileService }
 ];
 
 class PepColorService {
@@ -2431,216 +2683,6 @@ PepDataConvertorService.decorators = [
             },] }
 ];
 
-class PepFileService {
-    constructor() {
-        this.scripts = new Map();
-        this.styles = new Map();
-    }
-    loadFiles(files) {
-        const promises = [];
-        files.forEach((file) => {
-            if (file.type === 'style') {
-                promises.push(this.loadStyle(file.path));
-            }
-            else if (file.type === 'script') {
-                promises.push(this.loadScript(file.path));
-            }
-        });
-        return Promise.all(promises);
-    }
-    removeFiles(files) {
-        for (let index = 0; index < files.length &&
-            files[index].path &&
-            files[index].path.trim() !== ''; index++) {
-            const name = this.getFileName(files[index].path, true);
-            const element = document.getElementById(name);
-            element.parentNode.removeChild(element);
-            if (files[index].type === 'script' && this.scripts.has(name)) {
-                this.scripts.delete(name);
-            }
-            else if (files[index].type === 'style' && this.styles.has(name)) {
-                this.styles.delete(name);
-            }
-        }
-    }
-    loadScript(path) {
-        return new Promise((resolve, reject) => {
-            const name = this.getFileName(path, true);
-            // If the script isn't exist add it.
-            if (!this.scripts.has(name)) {
-                this.scripts.set(name, { loaded: false, src: path });
-            }
-            const scriptItem = this.scripts.get(name);
-            // Resolve if already loaded
-            if (scriptItem.loaded) {
-                resolve({
-                    script: name,
-                    loaded: true,
-                    status: 'Already Loaded',
-                });
-            }
-            else {
-                // Load script
-                const script = document.createElement('script');
-                script.type = 'text/javascript';
-                script.src = scriptItem.src;
-                script.setAttribute('id', name);
-                script.async = false;
-                if (script.readyState) {
-                    // IE
-                    script.onreadystatechange = () => {
-                        if (script.readyState === 'loaded' ||
-                            script.readyState === 'complete') {
-                            script.onreadystatechange = null;
-                            scriptItem.loaded = true;
-                            resolve({
-                                path,
-                                type: 'script',
-                                loaded: true,
-                                status: 'Loaded',
-                            });
-                        }
-                    };
-                }
-                else {
-                    // Others
-                    script.onload = () => {
-                        scriptItem.loaded = true;
-                        resolve({
-                            path,
-                            type: 'script',
-                            loaded: true,
-                            status: 'Loaded',
-                        });
-                    };
-                }
-                script.onerror = (error) => resolve({
-                    path,
-                    type: 'script',
-                    loaded: false,
-                    status: 'Loaded',
-                });
-                document.getElementsByTagName('head')[0].appendChild(script);
-            }
-        });
-    }
-    loadStyle(path) {
-        return new Promise((resolve, reject) => {
-            const name = this.getFileName(path, true);
-            // If the style isn't exist add it.
-            if (!this.styles.has(name)) {
-                this.styles.set(name, { loaded: false, src: path });
-            }
-            const styleItem = this.styles.get(name);
-            // Resolve if already loaded
-            if (styleItem.loaded) {
-                resolve({
-                    path,
-                    type: 'style',
-                    loaded: true,
-                    status: 'Already Loaded',
-                });
-            }
-            else {
-                // Load style
-                const style = document.createElement('link');
-                style.type = 'text/css';
-                style.rel = 'stylesheet';
-                style.href = styleItem.src;
-                style.media = 'all';
-                style.setAttribute('id', name);
-                styleItem.loaded = true;
-                resolve({
-                    path,
-                    type: 'style',
-                    loaded: true,
-                    status: 'Loaded',
-                });
-                document.getElementsByTagName('head')[0].appendChild(style);
-            }
-        });
-    }
-    loadFontStyle(styleId, href) {
-        const head = document.getElementsByTagName('head')[0];
-        const styleElement = document.getElementById(styleId);
-        if (styleElement) {
-            styleElement.href = href;
-        }
-        else {
-            const style = document.createElement('link');
-            style.id = styleId;
-            style.rel = 'stylesheet';
-            style.href = `${href}`;
-            head.appendChild(style);
-        }
-    }
-    getFileName(filePath, withExtenstion = false) {
-        const lastIndex = withExtenstion
-            ? filePath.length - 1
-            : filePath.lastIndexOf('.');
-        return filePath.substr(filePath.lastIndexOf('/') + 1, lastIndex);
-    }
-    getFileExtension(filePath) {
-        const fileSplit = filePath.split('.');
-        let fileExt = '';
-        if (fileSplit.length > 1) {
-            fileExt = fileSplit[fileSplit.length - 2];
-        }
-        return fileExt;
-    }
-    /* Returns true if url is valid */
-    isValidUrl(url) {
-        /* Try creating a valid URL */
-        try {
-            const tmp = new URL(url);
-            return true;
-        }
-        catch (e) {
-            return false;
-        }
-    }
-    convertFromb64toBlob(b64Data, contentType = '', sliceSize = 512) {
-        const byteCharacters = atob(b64Data);
-        const byteArrays = [];
-        for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
-            const slice = byteCharacters.slice(offset, offset + sliceSize);
-            const byteNumbers = new Array(slice.length);
-            for (let i = 0; i < slice.length; i++) {
-                byteNumbers[i] = slice.charCodeAt(i);
-            }
-            const byteArray = new Uint8Array(byteNumbers);
-            byteArrays.push(byteArray);
-        }
-        const blob = new Blob(byteArrays, { type: contentType });
-        return blob;
-    }
-    getAssetsPath(assetsDomain = '') {
-        const concatChar = assetsDomain === '' || assetsDomain.endsWith('/') ? '' : '/';
-        return `${assetsDomain}${concatChar}assets/ngx-lib/`;
-    }
-    getAssetsTranslationsSuffix() {
-        return '.ngx-lib.json';
-    }
-    getAssetsTranslationsPath(assetsDomain = '') {
-        return `${this.getAssetsPath(assetsDomain)}i18n/`;
-    }
-    getAssetsImagesPath(assetsDomain = '', image = '') {
-        return `${this.getAssetsPath(assetsDomain)}images/${image}`;
-    }
-    getSvgAsImageSrc(svg) {
-        const blob = new Blob([svg], { type: 'image/svg+xml' });
-        const url = URL.createObjectURL(blob);
-        return url;
-    }
-}
-PepFileService.ɵprov = i0.ɵɵdefineInjectable({ factory: function PepFileService_Factory() { return new PepFileService(); }, token: PepFileService, providedIn: "root" });
-PepFileService.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root',
-            },] }
-];
-PepFileService.ctorParameters = () => [];
-
 class PepValidatorService {
     constructor(translate = null) {
         var _a;
@@ -4185,5 +4227,5 @@ PepNgxLibModule.decorators = [
  * Generated bundle index. Do not edit.
  */
 
-export { DEFAULT_HORIZONTAL_ALIGNMENT, DEFAULT_VERTICAL_ALIGNMENT, FIELD_TYPE, FieldLayout, KeyValuePair, ObjectSingleData, ObjectsData, ObjectsDataRow, ObjectsDataRowCell, PepAddonService, PepAddressField, PepAttachDirective, PepAttachmentField, PepButtonBlurDirective, PepButtonLoaderDirective, PepCapitalizePipe, PepCheckboxField, PepClipboardDirective, PepClipboardService, PepColorService, PepCookieService, PepCustomizationService, PepDataConvertorService, PepDataQaDirective, PepDateField, PepDateFormatterPipe, PepDateStringFormatterPipe, PepEncodePipe, PepEscapePipe, PepFieldBase, PepFieldData, PepFileService, PepGuid, PepHttpService, PepImageField, PepImagesField, PepIndicatorsField, PepInputAutoWidthDirective, PepInternalButtonField, PepInternalCaruselField, PepInternalMenuField, PepInternalPageField, PepJwtHelperService, PepLayoutService, PepLoaderService, PepMenuBlurDirective, PepNgxLibModule, PepPlaceholderField, PepPortalService, PepPreventMultiClickDirective, PepPrintDirective, PepQuantitySelectorField, PepReplaceLineBreaksPipe, PepRichHtmlTextareaField, PepRowData, PepRtlClassDirective, PepRtlDirectionDirective, PepSafeHtmlPipe, PepSafePipe, PepScreenSizeType, PepScrollToService, PepSelectField, PepSeparatorField, PepSessionService, PepSignatureField, PepSplitUppercasePipe, PepTargetDirective, PepTextareaField, PepTextboxField, PepToNumberPipe, PepUtilitiesService, PepValidatorService, PepWindowScrollingService, SmartSearchResponse, SmartSearchValues, Test, UIControl, UIControlField, X_ALIGNMENT_TYPE, Y_ALIGNMENT_TYPE, httpInterceptorProviders as ɵa, PepErrorInterceptor as ɵb, PepLoaderInterceptor as ɵc, PepProfilerInterceptor as ɵd };
+export { DEFAULT_HORIZONTAL_ALIGNMENT, DEFAULT_VERTICAL_ALIGNMENT, FIELD_TYPE, FieldLayout, KeyValuePair, ObjectSingleData, ObjectsData, ObjectsDataRow, ObjectsDataRowCell, PepAddonService, PepAddressField, PepAttachDirective, PepAttachmentField, PepButtonBlurDirective, PepButtonLoaderDirective, PepCapitalizePipe, PepCheckboxField, PepClipboardDirective, PepClipboardService, PepColorService, PepCookieService, PepCustomizationService, PepDataConvertorService, PepDataQaDirective, PepDateField, PepDateFormatterPipe, PepDateStringFormatterPipe, PepEncodePipe, PepEscapePipe, PepFieldBase, PepFieldData, PepFileService, PepGuid, PepHttpService, PepImageField, PepImagesField, PepIndicatorsField, PepInputAutoWidthDirective, PepInternalButtonField, PepInternalCaruselField, PepInternalMenuField, PepInternalPageField, PepJwtHelperService, PepLayoutService, PepLoaderService, PepMenuBlurDirective, PepNgxLibModule, PepPlaceholderField, PepPortalService, PepPreventMultiClickDirective, PepPrintDirective, PepQuantitySelectorField, PepReplaceLineBreaksPipe, PepRichHtmlTextareaField, PepRowData, PepRtlClassDirective, PepRtlDirectionDirective, PepSafeHtmlPipe, PepSafePipe, PepScreenSizeType, PepScrollToService, PepSelectField, PepSeparatorField, PepSessionService, PepSignatureField, PepSplitUppercasePipe, PepTargetDirective, PepTextareaField, PepTextboxField, PepToNumberPipe, PepTranslateService, PepUtilitiesService, PepValidatorService, PepWindowScrollingService, SmartSearchResponse, SmartSearchValues, Test, UIControl, UIControlField, X_ALIGNMENT_TYPE, Y_ALIGNMENT_TYPE, httpInterceptorProviders as ɵa, PepErrorInterceptor as ɵb, PepLoaderInterceptor as ɵc, PepProfilerInterceptor as ɵd };
 //# sourceMappingURL=pepperi-addons-ngx-lib.js.map