turbogui-angular 15.2.0 → 15.3.0

package/fesm2022/turbogui-angular.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { EventEmitter, Directive, Output, HostListener, NgModule, inject, Injectable, Component, Inject, HostBinding, ViewContainerRef, Input, ViewChild } from '@angular/core';
 import { Subject } from 'rxjs';
-import { LocalizationManager, ArrayUtils, NumericUtils, HTTPManager, StringUtils, HTTPManagerGetRequest, HTTPManagerPostRequest, BrowserManager, ConversionUtils } from 'turbocommons-ts';
+import { ArrayUtils, NumericUtils, HTTPManager, StringUtils, HTTPManagerGetRequest, HTTPManagerPostRequest, BrowserManager, ConversionUtils } from 'turbocommons-ts';
 import * as i1 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA } from '@angular/material/dialog';
 import * as i3 from '@angular/material/button';
@@ -379,16 +379,483 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
 /**
  * Manages application text translations and languages
  */
-class LocalizationService extends LocalizationManager {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LocalizationService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LocalizationService, providedIn: 'root' }); }
+class LocalesService extends SingletoneStrictClass {
+    /**
+     * Fully featured translation manager to be used with any application that requires text internationalization.
+     */
+    constructor() {
+        super(LocalesService);
+        /**
+         * if the class has been correctly initialized and translations have been correctly loaded
+         */
+        this._isInitialized = false;
+        /**
+         * @see getLocales()
+         */
+        this._locales = [];
+        /**
+         * @see getLanguages()
+         */
+        this._languages = [];
+        /**
+         * Stores all the loaded localization data by library name, bundle name, key and locales
+         */
+        this._loadedTranslations = {};
+        /**
+         * Stores a memory cache to improve performance when outputing translations
+         */
+        this._keyValuesCache = {};
+        /**
+         * @see setWildCardsFormat()
+         */
+        this._wildCardsFormat = '{N}';
+        /**
+         * @see setMissingKeyFormat()
+         */
+        this._missingKeyFormat = '$exception';
+        /**
+         * Stores a hash value that is used to improve the performance for translation t() methods.
+         * This is computed based on _wildCardsFormat plus _missingKeyFormat plus the current primary locale
+         * Methods that change these values will recalculate the hash string, so when calling translation methods, the
+         * performance will be as fast as possible.
+         */
+        this._cacheHashBaseString = '';
+    }
+    /**
+     * Wildcards are string fragments that are placed inside the translated texts. Their main purpose is to be replaced at
+     * runtime by custom values like for example a user name, a date, a numeric value, etc..
+     *
+     * This class helps with this process by including a parameter called 'toReplace' on all ->t methods which allows us
+     * to specify a string or list of strings that will replace the respective wildcards on the translated text. Each wildcard
+     * must follow the format specified here, and contain a numeric digit that will be used to find the replacement text at the
+     * 'toReplace' list. For example, if we define $N as the wildcard format, and we have a translation that contains $0, $1, $2,
+     * $0 will be replaced with the first element on toReplace, $1 with the second and so.
+     *
+     * We usually set this before initializing the class translation data
+     *
+     * Notice that N is mandayory on the wildcards format and the first index value is 0.
+     *
+     * @param value The wildcards format we want to set
+     *
+     * @returns The value that's been set
+     */
+    setWildCardsFormat(value) {
+        if (!value.includes('N')) {
+            throw new Error("N is mandatory to replace wildcards");
+        }
+        this._cacheHashBaseString = value + this._missingKeyFormat + ((this._locales.length > 0) ? this._locales[0] : '');
+        this._wildCardsFormat = value;
+        return value;
+    }
+    /**
+     * Defines the behaviour for get(), getStartCase(), etc... methods when a key is not found on
+     * a bundle or the bundle does not exist
+     *
+     * If missingKeyFormat is an empty string, all missing keys will return an empty value (not recommended)
+     *
+     * If missingKeyFormat contains a string, that string will be always returned for missing keys
+     *
+     * If missingKeyFormat contains a string with one of the following predefined wildcards:<br>
+     *    - $key will be replaced with key name. Example: get("NAME") will output [NAME] if key is not found and missingKeyFormat = '[$key]'<br>
+     *    - $exception (default value) will throw an exception with the problem cause description.
+     *
+     * @param value The missing key format we want to set
+     *
+     * @returns The value that's been set
+     */
+    setMissingKeyFormat(value) {
+        this._cacheHashBaseString = this._wildCardsFormat + value + ((this._locales.length > 0) ? this._locales[0] : '');
+        this._missingKeyFormat = value;
+        return value;
+    }
+    /**
+     * @see setMissingKeyFormat()
+     */
+    getMissingKeyFormat() {
+        return this._missingKeyFormat;
+    }
+    /**
+     * Initializes the translation system by loading and parsing bundle files from the specified translations path.
+     *
+     * @param translationsPath - Url where the translations Json structure of libraries/bundles/locales/keys is available.
+     * @param locales An array of locale codes (e.g., ['en_US', 'es_ES', 'fr_FR']) to load. These will be added to the translation
+     *        path using the following format: translationsPath/en_US-es_ES-fr_FR. The order of this array will determine the
+     *        translation priority
+     * @param parameters Any extra parameters to be attached to the translationsPath after the locales like /param1/param2/ etc
+     *
+     * @return A promise that will resolve if the translations get correctly loaded, or reject with an error if load fails
+     */
+    initialize(translationsPath, locales, parameters) {
+        this._isInitialized = false;
+        this._loadedTranslations = {};
+        // Validate received locales are correct
+        for (const locale of locales) {
+            this._validateLocaleString(locale);
+        }
+        let translationsFullPath = translationsPath + '/' + locales.join('-') + '/' + parameters.join('/');
+        return new Promise((resolve, reject) => {
+            fetch(translationsFullPath).then(response => {
+                if (!response.ok) {
+                    throw new Error(`HTTP error! status: ${response.status}`);
+                }
+                return response.json();
+            }).then(data => {
+                this._loadedTranslations = data;
+                this._isInitialized = true;
+                this._locales = locales;
+                this._languages = locales.map((l) => l.substring(0, 2));
+                this._cacheHashBaseString = this._wildCardsFormat + this._missingKeyFormat + this._locales[0];
+                resolve(undefined);
+            }).catch(error => {
+                reject(new Error(`ERROR LOADING LOCALES FROM: ${translationsFullPath}\n` + error));
+            });
+        });
+    }
+    /**
+     * Check if the class has been correctly initialized and translations have been correctly loaded
+     */
+    isInitialized() {
+        return this._isInitialized;
+    }
+    /**
+     * Aux method to verify that this class is correctly initialized with translation data
+     */
+    _validateInitialized() {
+        if (!this._isInitialized) {
+            throw new Error('LocalesManager not initialized');
+        }
+    }
+    /**
+     * Checks if the specified locale is currently loaded for the currently defined bundles and paths.
+     *
+     * @param locale A locale to check. For example 'en_US'
+     *
+     * @return True if the locale is currently loaded on the class, false if not.
+     */
+    isLocaleLoaded(locale) {
+        this._validateLocaleString(locale);
+        return this._locales.includes(locale);
+    }
+    /**
+     * Aux method to validate that a locale string is correctly formatted
+     *
+     * @param string $locale A locale string
+     */
+    _validateLocaleString(locale) {
+        if (!/^[a-z]{2}_[A-Z]{2}$/.test(locale)) {
+            throw new Error('locale must be a valid xx_XX value');
+        }
+    }
+    /**
+     * Checks if the specified 2 digit language is currently loaded for the currently defined bundles and paths.
+     *
+     * @param language A language to check. For example 'en'
+     *
+     * @return True if the language is currently loaded on the class, false if not.
+     */
+    isLanguageLoaded(language) {
+        this._validateLanguageString(language);
+        return this._languages.includes(language);
+    }
+    /**
+     * Aux method to validate that a language string is correctly formatted
+     *
+     * @param language A 2 digit language string
+     */
+    _validateLanguageString(language) {
+        if (!/^[a-z]{2}$/.test(language)) {
+            throw new Error('language must be a valid 2 digit value');
+        }
+    }
+    /**
+     * Get the translation to the current primary locale for the given key, library and bundle
+     *
+     * @param string key The key we want to read from the specified resource bundle
+     * @param string bundlePath A string with the format 'library_name/bundle_name' that is used to locate the bundle were the key to translate is found
+     * @param array replaceWildcards A list of values that will replace wildcards that may be found on the translated text. Each wildcard
+     *        will be replaced with the element whose index on toReplace matches it. Check the documentation for this.wildCardsFormat
+     *        property to know more about how to setup wildcards.
+     *
+     * @see setWildCardsFormat()
+     *
+     * @return The translated text
+     */
+    t(key, bundlePath, replaceWildcards = []) {
+        this._validateInitialized();
+        // Create a cache key to improve performance when requesting the same key translation several times
+        const cacheKey = `${this._cacheHashBaseString}${key}${bundlePath}${replaceWildcards.join('')}`;
+        if (!this._keyValuesCache[cacheKey]) {
+            this._forceNonEmptyString(key, '', 'key must be non empty string');
+            this._forceNonEmptyString(bundlePath, '', 'bundlePath must be non empty string');
+            const [library, bundle] = bundlePath.split('/');
+            this._forceNonEmptyString(library, '', 'no library specified on bundlePath');
+            this._forceNonEmptyString(bundle, '', 'no bundle specified on bundlePath');
+            const replacementsCount = replaceWildcards.length;
+            // Loop all the locales to find the first one with a value for the specified key
+            for (const locale of this._locales) {
+                if (this._loadedTranslations[library]?.[bundle]?.[locale]?.[key]) {
+                    let result = this._loadedTranslations[library][bundle][locale][key];
+                    // Replace all wildcards on the text with the specified replacements if any
+                    for (let i = 0; i < replacementsCount; i++) {
+                        result = this._replace(result, this._replace(this._wildCardsFormat, 'N', i.toString()), replaceWildcards[i]);
+                    }
+                    this._keyValuesCache[cacheKey] = result;
+                    return result;
+                }
+            }
+            // Check if an exception needs to be thrown if the specified key is not found on this bundle
+            if (this._missingKeyFormat.includes('$exception')) {
+                throw new Error(`key <${key}> not found on ${bundlePath}`);
+            }
+            this._keyValuesCache[cacheKey] = this._replace(this._missingKeyFormat, '$key', key);
+        }
+        return this._keyValuesCache[cacheKey];
+    }
+    /**
+     * Get the translation for the given key and bundle as a string with all words first character capitalized
+     * and all the rest of the word with lower case
+     *
+     * @see t()
+     *
+     * @returns The localized and case formatted text
+     */
+    tStartCase(key, bundlePath, replaceWildcards = []) {
+        return this.t(key, bundlePath, replaceWildcards).split(' ')
+            .map((word) => word ? word[0].toUpperCase() + word.slice(1).toLowerCase() : '').join(' ');
+    }
+    /**
+     * Get the translation for the given key and bundle as an all upper case string
+     *
+     * @see t()
+     *
+     * @returns The localized and case formatted text
+     */
+    tAllUpperCase(key, bundlePath, replaceWildcards = []) {
+        return this.t(key, bundlePath, replaceWildcards).toUpperCase();
+    }
+    /**
+     * Get the translation for the given key and bundle as an all lower case string
+     *
+     * @see t()
+     *
+     * @returns The localized and case formatted text
+     */
+    tAllLowerCase(key, bundlePath, replaceWildcards = []) {
+        return this.t(key, bundlePath, replaceWildcards).toLowerCase();
+    }
+    /**
+     * Get the translation for the given key and bundle as a string with the first character as Upper case
+     * and all the rest as lower case
+     *
+     * @see t()
+     *
+     * @returns The localized and case formatted text
+     */
+    tFirstUpperRestLower(key, bundlePath, replaceWildcards = []) {
+        const string = this.t(key, bundlePath, replaceWildcards);
+        return string.charAt(0).toUpperCase() + string.slice(1).toLowerCase();
+    }
+    /**
+     * A list of strings containing the locales that are used by this class to translate the given keys, sorted by preference.
+     * Each string is formatted as a standard locale code with language and country joined by an underscore, like: en_US, fr_FR
+     *
+     * When a key and bundle are requested for translation, the class will check on the first language of this
+     * list for a translated text. If missing, the next one will be used, and so. This list is constructed after initialize
+     * methods is called.
+     *
+     * @example: After loading the following list of locales ['en_US', 'es_ES', 'fr_FR'] if we call LocalesManager.t('HELLO', 'lib1/greetings')
+     * the localization manager will try to locate the en_US value for the HELLO tag on the greetings bundle for the library lib1.
+     * If the tag is not found for the specified locale and bundle, the same search will be performed for the es_ES locale, and so, till a
+     * value is found or no more locales are defined.
+     */
+    getLocales() {
+        return this._locales;
+    }
+    /**
+     * A list of strings containing the languages that are used by this class to translate the given keys, sorted by preference.
+     * Each string is formatted as a 2 digit language code, like: en, fr
+     *
+     * This list is the same as the locales() one, but containing only the language part of each locale (the first two digits)
+     *
+     * @see getLocales()
+     */
+    getLanguages() {
+        return this._languages;
+    }
+    /**
+     * Get the first locale from the list of loaded locales, which is the currently used to search for translated texts.
+     *
+     * @returns The locale that is defined as the primary one. For example: en_US, es_ES, ..
+     */
+    getPrimaryLocale() {
+        this._validateInitialized();
+        return this._locales[0];
+    }
+    /**
+     * Get the first language from the list of loaded locales, which is the currently used to search for translated texts.
+     *
+     * @returns The 2 digit language code that is defined as the primary one. For example: en, es, ..
+     */
+    getPrimaryLanguage() {
+        this._validateInitialized();
+        return this._languages[0];
+    }
+    /**
+     * Define the locale that will be placed at the front of the currently loaded locales list (moving all the others one position to the right).
+     *
+     * This will be the first locale to use when trying to get a translation.
+     *
+     * @param locale A currently loaded locale that will be moved to the first position of the loaded locales list. If the specified locale
+     *        is not currently loaded, an exception will happen.
+     *
+     * @returns void
+     */
+    setPrimaryLocale(locale) {
+        this._validateInitialized();
+        if (!this.isLocaleLoaded(locale)) {
+            throw new Error(locale + ' not loaded');
+        }
+        let result = [locale];
+        for (let l of this._locales) {
+            if (l !== locale) {
+                result.push(l);
+            }
+        }
+        this._locales = result;
+        this._languages = this._locales.map((l) => l.substring(0, 2));
+        this._cacheHashBaseString = this._wildCardsFormat + this._missingKeyFormat + this._locales[0];
+    }
+    /**
+     * Moves the specified locales to the beginning of the locales list. This also alters the translation priority by setting the first
+     * provided locale as the most prioritary, the second as the next one and so.
+     *
+     * This method basically works exactly the same way as setPrimaryLocale but letting us add many locales at once.
+     *
+     * @see setPrimaryLocale()
+     *
+     * @param locales A list of locales to be moved to the beginning of the translation priority. First locales item will be the prefered
+     *        locale for translation, second will be the next one in case some key is not translated for the first one and so. If any of the
+     *        specified locales is not currently loaded, an exception will happen.
+     *
+     * @returns void
+     */
+    setPrimaryLocales(locales) {
+        if (!Array.isArray(locales) ||
+            (new Set(locales).size !== locales.length) ||
+            locales.length === 0) {
+            throw new Error('locales must be non empty string array with no duplicate elements');
+        }
+        for (let i = locales.length - 1; i >= 0; i--) {
+            this.setPrimaryLocale(locales[i]);
+        }
+    }
+    /**
+     * Define the 2 digit language that will be placed at the front of the currently loaded locales list (moving all the others one position to the right).
+     *
+     * This will be the first language to use when trying to get a translation.
+     *
+     * @param language A 2 digit language code that matches with any of the currently loaded locales, which will
+     *        be moved to the first position of the loaded locales list. If the specified language does not match with
+     *        a locale that is currently loaded, an exception will happen.
+     *
+     * @returns void
+     */
+    setPrimaryLanguage(language) {
+        for (let locale of this._locales) {
+            if (locale.substring(0, 2) === language) {
+                this.setPrimaryLocale(locale);
+                return;
+            }
+        }
+        throw new Error(language + ' not loaded');
+    }
+    /**
+     * Moves the locales that match the specified languages to the beginning of the locales list.
+     * Works the same as setPrimaryLocales() but with a list of the 2 digit language codes that match the respective locales.
+     *
+     * @see setPrimaryLocale()
+     * @see setPrimaryLanguage()
+     *
+     * @param languages A list of 2 digit language codes to be moved to the beginning of the translation priority. If any of the
+     *        specified languages does not match with a locale that is currently loaded, an exception will happen.
+     *
+     * @returns void
+     */
+    setPrimaryLanguages(languages) {
+        if (!Array.isArray(languages) ||
+            (new Set(languages).size !== languages.length) ||
+            languages.length === 0) {
+            throw new Error('languages must be non empty string array with no duplicate elements');
+        }
+        for (let i = languages.length - 1; i >= 0; i--) {
+            this.setPrimaryLanguage(languages[i]);
+        }
+    }
+    /**
+     * Change the loaded locales translation preference order. The same locales that are currently loaded must be passed
+     * but with a different order to change the translation priority.
+     *
+     * @param locales A list with the new locales translation priority
+     *
+     * @returns void
+     */
+    setLocalesOrder(locales) {
+        if (locales.length !== this._locales.length) {
+            throw new Error('locales must contain all the currently loaded locales');
+        }
+        this._validateInitialized();
+        for (let locale of locales) {
+            if (!this.isLocaleLoaded(locale)) {
+                throw new Error(locale + ' not loaded');
+            }
+        }
+        this._locales = locales;
+        this._languages = this._locales.map((l) => l.substring(0, 2));
+        this._cacheHashBaseString = this._wildCardsFormat + this._missingKeyFormat + this._locales[0];
+    }
+    /**
+     * This is an aux method to implement the TurboCommons StringUtils replace method.
+     * It is exactly the same as the one on the library, but we implement it here to avoid having a dependency with TurboCommons
+     */
+    _replace(string, search, replacement) {
+        const escapedSearch = search.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+        return string.replace(new RegExp(escapedSearch, 'g'), replacement);
+    }
+    /**
+     * This is an aux method to implement the TurboCommons StringUtils isEmpty method.
+     * It is exactly the same as the one on the library, but we implement it here to avoid having a dependency with TurboCommons
+     */
+    _isEmpty(string) {
+        let isString = (typeof string === 'string' || string instanceof String);
+        // Throw exception if non string value was received
+        if (!isString) {
+            // Empty or null value is considered empty
+            if (string == null || string == '') {
+                return true;
+            }
+            throw new Error("value is not a string");
+        }
+        return string.replace(/[ \n\r\t]/g, '') === '';
+    }
+    /**
+     * This is an aux method to implement the TurboCommons StringUtils forceNonEmptyString method.
+     * It is exactly the same as the one on the library, but we implement it here to avoid having a dependency with TurboCommons
+     */
+    _forceNonEmptyString(value, valueName = '', errorMessage = 'must be a non empty string') {
+        let isString = (typeof value === 'string' || value instanceof String);
+        if (!isString || this._isEmpty(value)) {
+            throw new Error(valueName + ' ' + errorMessage);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LocalesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LocalesService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LocalizationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LocalesService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }] });
+        }], ctorParameters: () => [] });
 
 /**
  * TurboGUI is A library that helps with the most common and generic UI elements and functionalities
@@ -811,8 +1278,8 @@ class DialogService extends SingletoneStrictClass {
      *            - viewContainerRef: This is important if we want to propagate providers from a parent component to this dialog. We must specify
      *              this reference to make sure the same services injected on the parent are available too at the child dialog
      *
-     * @param callback A function that will be called after the dialog is closed and will receive a selection object with the numeric index and value for
-     *        the option that's been selected by the user. if no option was selected, index will be -1 and value null
+     * @param callback A function that will be called after the dialog is closed. It will receive a selection object with two properties: index and value. Those
+     *        will contain the index and value from the options array that's selected by the user. if no option selected, index will be -1 and value null
      */
     addDialog(dialogComponentClass, properties, callback = null) {
         if (!this._isEnabled) {
@@ -1148,11 +1615,11 @@ class TurboApiCallerService extends SingletoneStrictClass {
         /**
          * The username that is currently defined and will be used by the login methods
          */
-        this.userName = '';
+        this._userName = '';
         /**
          * The password for the user that is currently defined and will be used by the login methods
          */
-        this.password = '';
+        this._password = '';
         /**
          * Contains the last email account that has been verified (or tried to verify) by this service, if any
          */
@@ -1173,6 +1640,34 @@ class TurboApiCallerService extends SingletoneStrictClass {
         this.httpManager = new HTTPManager();
         this._clearUserAndToken();
     }
+    /**
+     * The username that is currently defined and will be used by the login methods
+     */
+    set userName(v) {
+        this._isLogged = false;
+        this._token = '';
+        this._userName = v;
+    }
+    /**
+     * The username that is currently defined and will be used by the login methods
+     */
+    get userName() {
+        return this._userName;
+    }
+    /**
+     * The password for the user that is currently defined and will be used by the login methods
+     */
+    set password(v) {
+        this._isLogged = false;
+        this._token = '';
+        this._password = v;
+    }
+    /**
+     * The password for the user that is currently defined and will be used by the login methods
+     */
+    get password() {
+        return this._password;
+    }
     /**
      * Define the root url that will be used for all the API calls
      */
@@ -1252,10 +1747,13 @@ class TurboApiCallerService extends SingletoneStrictClass {
         ;
     }
     /**
-     * Authenticates the user by sending an encoded credentials request to the login web service.
+     * Authenticates the userName and password that are currently defined at the respective properties of this service.
      * Returns a promise that resolves with the server's response or rejects with an error if the login fails.
      * Path to the login service must be correctly defined at this.loginWebService
      *
+     * The authentication process is performed by sending an encoded credentials request to the login web service using the
+     * currently defined user name and psw.
+     *
      * Here's an example of a call:
      *
      *  login().then(response => {
@@ -1272,7 +1770,7 @@ class TurboApiCallerService extends SingletoneStrictClass {
         return new Promise((resolve, reject) => {
             const request = new HTTPManagerPostRequest(this.loginServiceURI);
             request.ignoreGlobalPostParams = true;
-            const encodedCredentials = ConversionUtils.stringToBase64(ConversionUtils.stringToBase64(this.userName) + ',' + ConversionUtils.stringToBase64(this.password));
+            const encodedCredentials = ConversionUtils.stringToBase64(ConversionUtils.stringToBase64(this._userName) + ',' + ConversionUtils.stringToBase64(this._password));
             request.parameters = { data: encodedCredentials };
             request.successCallback = (response) => {
                 if (response !== '') {
@@ -1303,10 +1801,11 @@ class TurboApiCallerService extends SingletoneStrictClass {
      * If any of the two values is empty, false will be returned
      */
     get isUserAndPswDefined() {
-        return !StringUtils.isEmpty(this.userName) && !StringUtils.isEmpty(this.password);
+        return !StringUtils.isEmpty(this._userName) && !StringUtils.isEmpty(this._password);
     }
     /**
-     * Tells if exists a user that is currently logged or not
+     * Tells if the user name and psw that are specified on this service are currently logged or not. This means
+     * also a token is active.
      */
     get isLogged() {
         return this._isLogged;
@@ -1486,8 +1985,8 @@ class TurboApiCallerService extends SingletoneStrictClass {
      * Aux methot to clear all the currently logged user data
      */
     _clearUserAndToken() {
-        this.userName = '';
-        this.password = '';
+        this._userName = '';
+        this._password = '';
         this._isLogged = false;
         this._token = '';
         this.httpManager.setGlobalPostParam('token', '-');
@@ -1529,6 +2028,10 @@ class ViewsService extends SingletoneStrictClass {
          * Contains the reference to the currently loaded view component
          */
         this._currentComponentRef = null;
+        /**
+         * Flag that stores if any view is in the process of being loaded
+         */
+        this._isLoadingView = false;
     }
     /**
      * Tells if there's any view currently loaded on the application views container
@@ -1550,20 +2053,25 @@ class ViewsService extends SingletoneStrictClass {
     }
     /**
      * Create a new view instance with the specified type and add it to the current application views container. Any currently loaded
-     * view will be removed
+     * view will be removed.
      *
-     * Make sure this method is called when all the visual components of the application have been created (ngAfterViewInit)
+     * If we push a view while another one is in the process of being loaded, the new push will be ignored.
      *
-     * @param view The classname for the view that we want to create and add to the views container (must extend View base class).
+     * Make sure this method is called when all the visual components of the application have been created (ngAfterViewInit)
      *
-     * @return The instance of the newly added and created view.
+     * @param view The classname for the view that we want to create (must extend View base class). A new angular object
+     *        will be instantiated and loaded into the views container.
      */
     async pushView(view) {
-        this.verifyViewsContainerExist();
         // If the loaded view is the same as the specified one, we will do nothing
         if (this._loadedViewClass === view) {
-            return this._currentComponentRef;
+            return;
         }
+        // If a view is already being loaded, nothing to do
+        if (this._isLoadingView) {
+            return;
+        }
+        this._isLoadingView = true;
         // If a view is already loaded, we will unload it first
         if (this._loadedViewClass !== null) {
             await this.removeCurrentView();
@@ -1582,18 +2090,17 @@ class ViewsService extends SingletoneStrictClass {
             fadeInPlayer.onDone(() => {
                 this._currentComponentRef = newComponentRef;
                 this._loadedViewClass = view;
+                this._isLoadingView = false;
                 resolve();
             });
             fadeInPlayer.play();
         });
-        return this._currentComponentRef;
     }
     /**
      * Delete the currently loaded view from the views container, and leave it empty.
      * If no view is currently loaded, this method will do nothing
      */
     async popView() {
-        this.verifyViewsContainerExist();
         if (this._loadedViewClass !== null && this._currentComponentRef) {
             await this.removeCurrentView();
         }
@@ -1602,6 +2109,9 @@ class ViewsService extends SingletoneStrictClass {
      * Aux method to remove the currently loaded view from the views container using a promise
      */
     removeCurrentView() {
+        if (this._viewContainerRef === null) {
+            throw new Error('Views container not defined. Please declare a <views-container> element in your application');
+        }
         return new Promise((resolve) => {
             if (this._currentComponentRef) {
                 const element = this._currentComponentRef.location.nativeElement;
@@ -1624,14 +2134,6 @@ class ViewsService extends SingletoneStrictClass {
             }
         });
     }
-    /**
-     * Auxiliary method to test if the views container instance is available on the application
-     */
-    verifyViewsContainerExist() {
-        if (this._viewContainerRef === null) {
-            throw new Error('Views container not defined. Please declare a <views-container> element in your application');
-        }
-    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ViewsService, deps: [{ token: i1$2.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ViewsService, providedIn: 'root' }); }
 }
@@ -1882,6 +2384,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
 /**
  * A dialog component with a single input element and an accept button, to be used with dialog service
  * It lets us easily ask the user for any arbitrary text we may need.
+ *
+ * 1st text is the dialog title
+ * 2nd text is the dialog subtitle (leave it empty to hide the subtitle)
+ * 3rd text is the input prompt caption
+ * 4rd text is the default value of the input contents
+ *
+ * 1st option will be the text on the unique save button that exists on the dialog
  */
 class DialogSingleInputComponent extends DialogBaseComponent {
     static { this.DIALOG_CLASS_NAME = 'DialogSingleInputComponent'; }
@@ -1894,28 +2403,37 @@ class DialogSingleInputComponent extends DialogBaseComponent {
          * Contains the text that the user types on the dialog input
          */
         this.inputText = '';
+        /**
+        * Contains the default text that's been specified for the input
+        */
+        this.defaultTextValue = '';
         if (data.texts.length < 1) {
-            throw new Error('DialogSingleInputComponent expects 2 texts: The title and optionally a description');
+            throw new Error('DialogSingleInputComponent expects 1 text: The dialog title');
         }
         if (data.options.length !== 1) {
             throw new Error('DialogSingleInputComponent expects only one option');
         }
+        if (data.texts.length > 3) {
+            this.inputText = data.texts[3];
+            this.defaultTextValue = data.texts[3];
+        }
     }
-    isInputEmpty() {
+    isButtonDisabled() {
+        if (this.defaultTextValue !== '' && this.inputText === this.defaultTextValue) {
+            return true;
+        }
         return StringUtils.isEmpty(this.inputText);
     }
     closeDialog() {
-        if (!this.isInputEmpty()) {
-            super.closeDialog(0, this.inputText);
-        }
+        super.closeDialog(0, this.inputText);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogSingleInputComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DialogSingleInputComponent, isStandalone: true, selector: "tg-dialog-single-input", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 2\">\r\n    {{data.texts[2]}}\r\n</p>\r\n\r\n<mat-form-field>\r\n\r\n    <mat-label>{{data.texts[1]}}</mat-label>\r\n    <input matInput autoFocusOnDisplay\r\n        (keyup.enter)=\"closeDialog()\"\r\n        [(ngModel)]=\"inputText\">\r\n        \r\n</mat-form-field>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    [disabled]=\"isInputEmpty()\"\r\n    (click)=\"closeDialog()\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-bottom:25px}p{margin-bottom:52px}button{float:right}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TurboGuiAngularModule }, { kind: "directive", type: AutoFocusOnDisplayDirective, selector: "[autoFocusOnDisplay]" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DialogSingleInputComponent, isStandalone: true, selector: "tg-dialog-single-input", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1 && data.texts[1] !== ''\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<mat-form-field>\r\n\r\n    <mat-label>{{data.texts[2]}}</mat-label>\r\n    <input matInput autoFocusOnDisplay autoSelectTextOnFocus\r\n        (keyup.enter)=\"closeDialog()\"\r\n        [(ngModel)]=\"inputText\">\r\n        \r\n</mat-form-field>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    [disabled]=\"isButtonDisabled()\"\r\n    (click)=\"closeDialog()\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-top:1vh;margin-bottom:3vh}p{margin-top:0;margin-bottom:5vh}button{min-height:5vh}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TurboGuiAngularModule }, { kind: "directive", type: AutoFocusOnDisplayDirective, selector: "[autoFocusOnDisplay]" }, { kind: "directive", type: AutoSelectTextOnFocusDirective, selector: "[autoSelectTextOnFocus]" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogSingleInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tg-dialog-single-input', standalone: true, imports: [CommonModule, MatButtonModule, MatInputModule, FormsModule,
-                        TurboGuiAngularModule], providers: [], template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 2\">\r\n    {{data.texts[2]}}\r\n</p>\r\n\r\n<mat-form-field>\r\n\r\n    <mat-label>{{data.texts[1]}}</mat-label>\r\n    <input matInput autoFocusOnDisplay\r\n        (keyup.enter)=\"closeDialog()\"\r\n        [(ngModel)]=\"inputText\">\r\n        \r\n</mat-form-field>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    [disabled]=\"isInputEmpty()\"\r\n    (click)=\"closeDialog()\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-bottom:25px}p{margin-bottom:52px}button{float:right}\n"] }]
+                        TurboGuiAngularModule], providers: [], template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1 && data.texts[1] !== ''\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<mat-form-field>\r\n\r\n    <mat-label>{{data.texts[2]}}</mat-label>\r\n    <input matInput autoFocusOnDisplay autoSelectTextOnFocus\r\n        (keyup.enter)=\"closeDialog()\"\r\n        [(ngModel)]=\"inputText\">\r\n        \r\n</mat-form-field>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    [disabled]=\"isButtonDisabled()\"\r\n    (click)=\"closeDialog()\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-top:1vh;margin-bottom:3vh}p{margin-top:0;margin-bottom:5vh}button{min-height:5vh}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -2281,7 +2799,7 @@ class GUINotification {
  */
 /**
  * Defines an application view.
- * Our View components must extend this class so they can be manipulated via ViewsService and be correctly linked to a view service.
+ * Our View components must extend this class so they can be manipulated via ViewsService and be correctly linked to a views-container.
  */
 class View {
     /**
@@ -2425,5 +2943,5 @@ class ValidatorsPlus extends Validators {
  * Generated bundle index. Do not edit.
  */
 
-export { AutoFocusOnDisplayDirective, AutoSelectTextOnFocusDirective, BrowserService, BusyStateBaseComponent, ButtonContainerComponent, ButtonImageComponent, DelayedMethodCallManager, DialogBaseComponent, DialogDateSelectionComponent, DialogErrorComponent, DialogMultipleOptionComponent, DialogService, DialogSingleInputComponent, DialogSingleOptionComponent, DialogSingleSelectionListComponent, DialogTwoOptionComponent, ElementCreatedDirective, ElementDestroyedDirective, FadeAnimationClass, GUINotification, GlobalErrorService, HTTPService, HTTPServiceGetRequest, HTTPServicePostRequest, LocalizationService, NotificationService, SingletoneStrictClass, TurboApiCallerService, TurboGuiAngularModule, ValidatorsPlus, View, ViewService, ViewsContainerComponent, ViewsService };
+export { AutoFocusOnDisplayDirective, AutoSelectTextOnFocusDirective, BrowserService, BusyStateBaseComponent, ButtonContainerComponent, ButtonImageComponent, DelayedMethodCallManager, DialogBaseComponent, DialogDateSelectionComponent, DialogErrorComponent, DialogMultipleOptionComponent, DialogService, DialogSingleInputComponent, DialogSingleOptionComponent, DialogSingleSelectionListComponent, DialogTwoOptionComponent, ElementCreatedDirective, ElementDestroyedDirective, FadeAnimationClass, GUINotification, GlobalErrorService, HTTPService, HTTPServiceGetRequest, HTTPServicePostRequest, LocalesService, NotificationService, SingletoneStrictClass, TurboApiCallerService, TurboGuiAngularModule, ValidatorsPlus, View, ViewService, ViewsContainerComponent, ViewsService };
 //# sourceMappingURL=turbogui-angular.mjs.map