@pepperi-addons/ngx-lib 0.4.0-angular14.9 → 0.4.0-beta.3

package/fesm2020/pepperi-addons-ngx-lib.mjs

@@ -1,16 +1,17 @@
 import * as i0 from '@angular/core';
 import { Injectable, Directive, Optional, Pipe, Input, HostListener, Inject, PLATFORM_ID, NgModule } from '@angular/core';
-import { formatPercent, formatCurrency, formatNumber, DOCUMENT, isPlatformBrowser, CommonModule } from '@angular/common';
+import { DOCUMENT, isPlatformBrowser, CommonModule } from '@angular/common';
 import * as i3 from '@angular/common/http';
 import { HttpResponse, HTTP_INTERCEPTORS, HttpHeaders, HttpClientModule } from '@angular/common/http';
 import * as i3$1 from '@angular/forms';
 import { FormControl, Validators, ReactiveFormsModule, FormBuilder } from '@angular/forms';
 import { throwError, BehaviorSubject, Subject } from 'rxjs';
-import { catchError, distinctUntilChanged, finalize, tap } from 'rxjs/operators';
+import { catchError, filter, distinctUntilChanged, finalize, tap } from 'rxjs/operators';
 import * as i1 from '@ngx-translate/core';
 import { TranslateModule } from '@ngx-translate/core';
 import * as i1$1 from '@angular/platform-browser';
 import { _isNumberValue, coerceNumberProperty } from '@angular/cdk/coercion';
+import { createCustomElement } from '@angular/elements';
 import { MultiTranslateHttpLoader } from 'ngx-translate-multi-http-loader';
 import * as i6 from '@angular/router';
 
@@ -40,7 +41,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImpor
 class PepLoaderService {
     constructor() {
         this.counter = 0;
-        this.showLoaderSubject = new BehaviorSubject(false);
+        this.showLoaderSubject = new BehaviorSubject(undefined);
         // Raise custom event for showing the loader.
         this.onChanged$.subscribe((show) => {
             this.showLoaderChanged(show);
@@ -49,7 +50,7 @@ class PepLoaderService {
     get onChanged$() {
         return this.showLoaderSubject
             .asObservable()
-            .pipe(distinctUntilChanged());
+            .pipe(filter(v => v !== undefined), distinctUntilChanged());
     }
     showLoaderChanged(show) {
         const eventData = {
@@ -89,14 +90,13 @@ class PepLoaderInterceptor {
     }
     intercept(req, next) {
         // console.warn('LoaderInterceptor');
+        let newVer = 2;
         const loaderService = this.injector.get(PepLoaderService);
+        //  console.log('show', req.url);       
         loaderService.show();
         return next.handle(req).pipe(
         // delay(3000),
-        catchError((err) => {
-            loaderService.hide();
-            return throwError(err);
-        }), finalize(() => loaderService.hide()));
+        catchError((err) => throwError(err)), finalize(() => loaderService.hide()));
         // return next.handle(req).pipe(map(event => {
         //     if (event instanceof HttpResponse) {
         //        loaderService.hide();
@@ -689,6 +689,9 @@ class PepUtilitiesService {
         this.translate = translate;
         this.culture = 'en-US';
         this.culture = this.translate?.getBrowserCultureLang() || 'en-US';
+        // try {
+        //     import(`@angular/common/locales/global/${this.culture}`);
+        // } catch {}
     }
     changeDecimalSeperator(value, reverse = false) {
         // If the decimal separator is ','
@@ -729,6 +732,19 @@ class PepUtilitiesService {
         str = new Array(size).join('0').concat(str);
         return str;
     }
+    isCurrencyShouldBeOnRight(currencySymbol) {
+        let res = false;
+        if (currencySymbol == "€" ||
+            currencySymbol == "₪" ||
+            currencySymbol == "Ft" ||
+            currencySymbol == "Kč" ||
+            currencySymbol == "руб" ||
+            currencySymbol == "zł" ||
+            currencySymbol == "kr.") {
+            res = true;
+        }
+        return res;
+    }
     parseDate(dateStr, showTime = false) {
         let retVal = null;
         if (dateStr !== '') {
@@ -790,44 +806,80 @@ class PepUtilitiesService {
         const div = document.createElement('DIV');
         // div.className = 'svg-icon';
         // Add class svg-icon
-        div.innerHTML = svgContent.replace('<svg ', '<svg class="svg-icon" ');
+        if (svgContent?.length > 0) {
+            div.innerHTML = svgContent.replace('<svg ', '<svg class="svg-icon" ');
+        }
         return (div.querySelector('svg') ||
             document.createElementNS('http://www.w3.org/2000/svg', 'path'));
     }
-    formatPercent(value, digitsInfo = '1.0-2') {
+    // formatPercent(value: any, digitsInfo = '1.0-2') {
+    formatPercent(value, minFractionDigits = 0, maxFractionDigits = 2) {
+        minFractionDigits = this.coerceNumberProperty(minFractionDigits, null);
+        maxFractionDigits = this.coerceNumberProperty(maxFractionDigits, null);
         const number = this.coerceNumberProperty(value);
         if (number === 0) {
             return '0%';
         }
         else {
-            return formatPercent(number / 100, this.culture, digitsInfo);
-        }
-    }
-    formatCurrency(value, currencySign = '', digitsInfo = '1.2-2') {
+            // return formatPercent(number / 100, this.culture, digitsInfo);
+            return new Intl.NumberFormat(this.culture, {
+                style: 'percent',
+                minimumFractionDigits: minFractionDigits || 0,
+                maximumFractionDigits: maxFractionDigits || Math.max(2, minFractionDigits),
+            }).format(number / 100);
+        }
+    }
+    // formatCurrency(value: any, currencySign = '', digitsInfo = '1.2-2') {
+    formatCurrency(value, currencySign = '', minFractionDigits = 0, maxFractionDigits = 2) {
+        minFractionDigits = this.coerceNumberProperty(minFractionDigits, null);
+        maxFractionDigits = this.coerceNumberProperty(maxFractionDigits, null);
+        let res = '';
         const number = this.coerceNumberProperty(value);
+        const styleOptions = {
+            // style: 'currency',
+            // currencySign: currencySign,
+            minimumFractionDigits: minFractionDigits || 0,
+            maximumFractionDigits: maxFractionDigits || Math.max(2, minFractionDigits),
+        };
         if (number === 0) {
-            return formatCurrency(0, this.culture, currencySign, undefined, digitsInfo);
+            // return formatCurrency(0, this.culture, currencySign, undefined, digitsInfo);
+            res = new Intl.NumberFormat(this.culture, styleOptions).format(0);
         }
         else {
-            return formatCurrency(value, this.culture, currencySign, undefined, digitsInfo);
+            // return formatCurrency(value, this.culture, currencySign, undefined, digitsInfo);
+            res = new Intl.NumberFormat(this.culture, styleOptions).format(number);
         }
+        res = this.isCurrencyShouldBeOnRight(currencySign) ? `${res} ${currencySign}` : `${currencySign} ${res}`;
+        return res;
     }
-    formatDecimal(value, digitsInfo = '1.2-2') {
+    // formatDecimal(value: any, digitsInfo = '1.2-2') {
+    formatDecimal(value, minFractionDigits = 2, maxFractionDigits = 2) {
+        minFractionDigits = this.coerceNumberProperty(minFractionDigits, null);
+        maxFractionDigits = this.coerceNumberProperty(maxFractionDigits, null);
         const number = this.coerceNumberProperty(value);
         if (number === 0) {
             return '0';
         }
         else {
-            return formatNumber(value, this.culture, digitsInfo);
+            // return formatNumber(value, this.culture, digitsInfo);
+            return new Intl.NumberFormat(this.culture, {
+                minimumFractionDigits: minFractionDigits || Math.min(2, maxFractionDigits),
+                maximumFractionDigits: maxFractionDigits || Math.max(2, minFractionDigits),
+            }).format(number);
         }
     }
-    formatNumber(value, digitsInfo = '1.0-0') {
+    // formatNumber(value: any, digitsInfo = '1.0-0'): string {
+    formatNumber(value) {
         const number = this.coerceNumberProperty(value);
         if (number === 0) {
             return '0';
         }
         else {
-            return formatNumber(value, this.culture, digitsInfo);
+            // return formatNumber(value, this.culture, digitsInfo);
+            return new Intl.NumberFormat(this.culture, {
+                minimumFractionDigits: 0,
+                maximumFractionDigits: 0,
+            }).format(number);
         }
     }
     /**
@@ -874,7 +926,9 @@ class PepUtilitiesService {
     }
     coerceNumberProperty(value, fallbackValue = 0) {
         // If the decimal separator is ',' change it to '.'
-        value = this.changeDecimalSeperator(value);
+        if (value?.length > 0) {
+            value = this.changeDecimalSeperator(value);
+        }
         return coerceNumberProperty(value, fallbackValue);
     }
 }
@@ -2314,38 +2368,36 @@ class PepAddonService {
         this.fileService = fileService;
         this.route = route;
         this.PAGES_ADDON_UUID = '50062e0c-9967-4ed4-9102-f2bc50602d41';
-        this.ADDON_ASSETS_PATH_KEY = 'AddonAssetsPath';
+        // private readonly ADDON_ASSETS_PATH_KEY = 'AddonAssetsPath';
         this.ADDONS_DICTIONARY_ASSETS_PATH_KEY = 'AddonsDictionaryAssetsPath';
         this.ADDON_API_RELATIVE_PATH = '/addons/api';
         this.ADDON_API_ASYNC_RELATIVE_PATH = `${this.ADDON_API_RELATIVE_PATH}/async`;
         //
     }
     get devServer() {
-        return this.route.snapshot.queryParamMap.get('devServer') === 'true';
+        return this.route ? this.route.snapshot.queryParamMap.get('devServer') === 'true' : false;
     }
     getAddonBaseRelativePath(isAsync = false) {
         return isAsync
             ? this.ADDON_API_ASYNC_RELATIVE_PATH
             : this.ADDON_API_RELATIVE_PATH;
     }
-    getAddonStaticFolder(subAddonUUID = '') {
-        if (subAddonUUID.length > 0) {
-            const addonsDictionary = this.sessionService.getObject(this.ADDONS_DICTIONARY_ASSETS_PATH_KEY);
-            return addonsDictionary && addonsDictionary[subAddonUUID] ? addonsDictionary[subAddonUUID] : '';
-        }
-        else {
-            return this.sessionService.getObject(this.ADDON_ASSETS_PATH_KEY) || '';
-        }
-    }
-    setAddonStaticFolder(path, subAddonUUID = '') {
-        if (subAddonUUID.length > 0) {
-            const addonsDictionary = this.sessionService.getObject(this.ADDONS_DICTIONARY_ASSETS_PATH_KEY) ?? {};
-            addonsDictionary[subAddonUUID] = path;
-            this.sessionService.setObject(this.ADDONS_DICTIONARY_ASSETS_PATH_KEY, addonsDictionary);
-        }
-        else {
-            return this.sessionService.setObject(this.ADDON_ASSETS_PATH_KEY, path);
-        }
+    getAddonStaticFolder(addonUUID) {
+        // if (addonUUID.length > 0) {
+        const addonsDictionary = this.sessionService.getObject(this.ADDONS_DICTIONARY_ASSETS_PATH_KEY);
+        return addonsDictionary && addonsDictionary[addonUUID] ? addonsDictionary[addonUUID] : '';
+        // } else {
+        // return this.sessionService.getObject(this.ADDON_ASSETS_PATH_KEY) || '';
+        // }
+    }
+    setAddonStaticFolder(path, addonUUID) {
+        // if (addonUUID.length > 0) {
+        const addonsDictionary = this.sessionService.getObject(this.ADDONS_DICTIONARY_ASSETS_PATH_KEY) ?? {};
+        addonsDictionary[addonUUID] = path;
+        this.sessionService.setObject(this.ADDONS_DICTIONARY_ASSETS_PATH_KEY, addonsDictionary);
+        // } else {
+        //     return this.sessionService.setObject(this.ADDON_ASSETS_PATH_KEY, path);
+        // }
     }
     getServerBaseUrl(addonUUID, fileName = '', isAsync = false, localhostPort = 4500) {
         const fileToAdd = fileName.length > 0 ? `/${fileName}` : '';
@@ -2386,8 +2438,8 @@ class PepAddonService {
             this.loaderService.hide();
         });
     }
-    getNgxLibTranslationResource(subAddonUUID = '', libName = 'ngx-lib') {
-        const addonStaticFolder = this.getAddonStaticFolder(subAddonUUID);
+    getNgxLibTranslationResource(addonUUID, libName = 'ngx-lib') {
+        const addonStaticFolder = this.getAddonStaticFolder(addonUUID);
         const translationsPath = this.fileService.getAssetsTranslationsPath(addonStaticFolder, libName);
         const translationsSuffix = this.fileService.getAssetsTranslationsSuffix(libName);
         return {
@@ -2395,8 +2447,8 @@ class PepAddonService {
             suffix: translationsSuffix,
         };
     }
-    getAddonTranslationResource(subAddonUUID = '') {
-        const addonStaticFolder = this.getAddonStaticFolder(subAddonUUID);
+    getAddonTranslationResource(addonUUID) {
+        const addonStaticFolder = this.getAddonStaticFolder(addonUUID);
         const defaultSubFolder = 'assets/i18n/';
         return {
             prefix: addonStaticFolder.length > 0 ? `${addonStaticFolder}${defaultSubFolder}` : `/${defaultSubFolder}`,
@@ -2409,38 +2461,44 @@ class PepAddonService {
     getPagesAddonUUID() {
         return this.PAGES_ADDON_UUID;
     }
-    // Deprecated need to delete in next major.
-    static createDefaultMultiTranslateLoader(http, fileService, addonService, subAddonUUID = '') {
-        const ngxLibTranslationResource = addonService.getNgxLibTranslationResource(subAddonUUID);
-        const addonTranslationResource = addonService.getAddonTranslationResource(subAddonUUID);
-        return addonService.translateService.createMultiTranslateLoader([
-            ngxLibTranslationResource,
-            addonTranslationResource
-        ]);
+    setShellRouterData(data) {
+        const eventData = {
+            detail: data,
+        };
+        const customEvent = new CustomEvent('set-router-data', eventData);
+        window.dispatchEvent(customEvent);
+    }
+    defineCustomElement(elementName, component, injector) {
+        customElements.upgrade;
+        if (!customElements.get(elementName)) {
+            customElements.define(elementName, createCustomElement(component, { injector: injector }));
+        }
     }
-    static createMultiTranslateLoader(addonService, libsName = ['ngx-lib'], subAddonUUID = '') {
+    static createMultiTranslateLoader(addonUUID, addonService, libsName = ['ngx-lib']) {
         const ngxLibTranslationResources = [];
         if (libsName?.length > 0) {
             for (let index = 0; index < libsName.length; index++) {
                 const libName = libsName[index];
-                ngxLibTranslationResources.push(addonService.getNgxLibTranslationResource(subAddonUUID, libName));
+                ngxLibTranslationResources.push(addonService.getNgxLibTranslationResource(addonUUID, libName));
             }
         }
-        const addonTranslationResource = addonService.getAddonTranslationResource(subAddonUUID);
+        const addonTranslationResource = addonService.getAddonTranslationResource(addonUUID);
         return addonService.translateService.createMultiTranslateLoader([
             ...ngxLibTranslationResources,
             addonTranslationResource
         ]);
     }
 }
-PepAddonService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepAddonService, deps: [{ token: PepSessionService }, { token: PepHttpService }, { token: PepLoaderService }, { token: PepTranslateService }, { token: PepFileService }, { token: i6.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Injectable });
+PepAddonService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepAddonService, deps: [{ token: PepSessionService }, { token: PepHttpService }, { token: PepLoaderService }, { token: PepTranslateService }, { token: PepFileService }, { token: i6.ActivatedRoute, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
 PepAddonService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepAddonService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepAddonService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: PepSessionService }, { type: PepHttpService }, { type: PepLoaderService }, { type: PepTranslateService }, { type: PepFileService }, { type: i6.ActivatedRoute }]; } });
+        }], ctorParameters: function () { return [{ type: PepSessionService }, { type: PepHttpService }, { type: PepLoaderService }, { type: PepTranslateService }, { type: PepFileService }, { type: i6.ActivatedRoute, decorators: [{
+                    type: Optional
+                }] }]; } });
 
 class PepColorService {
     constructor() {
@@ -3320,11 +3378,14 @@ class PepTextboxField extends PepFieldBase {
         super(options);
         this.controlType = 'textbox';
         this.type = 'text';
+        this.digitsNumberAfterDecimalPoint = NaN;
         this.type = options.type || 'text';
+        this.regex = options.regex;
         this.update(options);
     }
     update(options) {
         super.update(options);
+        this.digitsNumberAfterDecimalPoint = options.digitsNumberAfterDecimalPoint ?? NaN;
         if (this.type === 'link') {
             // DI-11292 - add changes for link field for the "Read Only display value" prop
             this.formattedValue =
@@ -3350,6 +3411,9 @@ class PepTextboxField extends PepFieldBase {
                 validators.push(Validators.max(this.maxValue));
             }
         }
+        if (this.type === 'text' && this.regex) {
+            validators.push(Validators.pattern(this.regex));
+        }
         return validators;
     }
 }
@@ -3420,12 +3484,14 @@ class PepQuantitySelectorField extends PepFieldBase {
         super(options);
         this.controlType = 'qs';
         this.notificationInfo = {};
+        this.digitsNumberAfterDecimalPoint = NaN;
         this.updatedDataCount = 0;
         this.type = options.type || 'qs';
         this.update(options);
     }
     update(options) {
         super.update(options);
+        this.digitsNumberAfterDecimalPoint = options.digitsNumberAfterDecimalPoint ?? NaN;
         this.allowDecimal = options.allowDecimal || false;
         this.notificationInfo = options.notificationInfo;
         this.updatedDataCount += 1;
@@ -3455,6 +3521,7 @@ class PepSelectField extends PepFieldBase {
         this.controlType = 'select';
         this.options = [];
         this.type = options.type || 'select';
+        this.emptyOption = options.emptyOption;
         this.update(options);
     }
     update(options) {