@sumaris-net/ngx-components 18.22.25 → 18.22.27

package/esm2022/src/app/shared/regexps.mjs

@@ -2,7 +2,7 @@ export class RegExpUtils {
     static _cachedSearchRegexps = {};
     static _cachedSearchTexts = [];
     static MAX_CACHE_SIZE = 100;
-    static SPECIAL_CHARACTERS_REGEXP = /[.\[\](){}\\$^|+*?]/;
+    static SPECIAL_CHARACTERS_REGEXP = /[.\[\](){}\\$^|+*?]/g;
     static SPECIAL_CHARACTERS_REPLACEMENT_MAP = {
         // Escape some characters
         '.': '[.]', // Escape point
@@ -61,26 +61,26 @@ export class RegExpUtils {
             return null;
         // Use cached regexp if exists
         const cacheKey = searchText + '|' + flags;
-        const cachedRegexp = this._cachedSearchRegexps[cacheKey];
+        const cachedRegexp = RegExpUtils._cachedSearchRegexps[cacheKey];
         if (cachedRegexp)
             return cachedRegexp;
-        const searchRegexpText = searchText.replace(this.SPECIAL_CHARACTERS_REGEXP, (match) => this.SPECIAL_CHARACTERS_REPLACEMENT_MAP[match] || match);
+        const searchRegexpText = searchText.replace(RegExpUtils.SPECIAL_CHARACTERS_REGEXP, (match) => RegExpUtils.SPECIAL_CHARACTERS_REPLACEMENT_MAP[match] || match);
         // DEBUG
         //console.debug(`[regexp-utils] Computing new regexp '${searchRegexpText}' from searchText '${searchText}'`);
         const regexp = new RegExp(`[ ]*${searchRegexpText}`, flags);
         // If cache is full: remove older cache element
-        if (this._cachedSearchTexts.length >= this.MAX_CACHE_SIZE) {
+        if (RegExpUtils._cachedSearchTexts.length >= RegExpUtils.MAX_CACHE_SIZE) {
             // DEBUG
             //console.debug('[regexp-utils] Removing older cached regexp');
             // Clear half cache's elements
-            while (this._cachedSearchTexts.length > this.MAX_CACHE_SIZE / 2) {
-                const cacheKeyToEvict = this._cachedSearchTexts.shift();
-                delete this._cachedSearchRegexps[cacheKeyToEvict];
+            while (RegExpUtils._cachedSearchTexts.length > RegExpUtils.MAX_CACHE_SIZE / 2) {
+                const cacheKeyToEvict = RegExpUtils._cachedSearchTexts.shift();
+                delete RegExpUtils._cachedSearchRegexps[cacheKeyToEvict];
             }
         }
         // Add to static cache
-        this._cachedSearchRegexps[cacheKey] = regexp;
-        this._cachedSearchTexts.push(cacheKey);
+        RegExpUtils._cachedSearchRegexps[cacheKey] = regexp;
+        RegExpUtils._cachedSearchTexts.push(cacheKey);
         return regexp;
     }
     static match(input, regexp) {
@@ -100,4 +100,4 @@ export class RegExpUtils {
         return (input && (input.includes('*') || input.includes('?'))) || false;
     }
 }
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmVnZXhwcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9hcHAvc2hhcmVkL3JlZ2V4cHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsTUFBTSxPQUFnQixXQUFXO0lBQ3ZCLE1BQU0sQ0FBQyxvQkFBb0IsR0FBOEIsRUFBRSxDQUFDO0lBQzVELE1BQU0sQ0FBQyxrQkFBa0IsR0FBYSxFQUFFLENBQUM7SUFFekMsTUFBTSxDQUFDLGNBQWMsR0FBRyxHQUFHLENBQUM7SUFDNUIsTUFBTSxDQUFDLHlCQUF5QixHQUFHLHFCQUFxQixDQUFDO0lBQ3pELE1BQU0sQ0FBQyxrQ0FBa0MsR0FBRztRQUNsRCx5QkFBeUI7UUFDekIsR0FBRyxFQUFFLEtBQUssRUFBRSxlQUFlO1FBQzNCLEdBQUcsRUFBRSxLQUFLLEVBQUUscUJBQXFCO1FBQ2pDLEdBQUcsRUFBRSxLQUFLLEVBQUUscUJBQXFCO1FBQ2pDLEdBQUcsRUFBRSxLQUFLLEVBQUUseUNBQXlDO1FBQ3JELEdBQUcsRUFBRSxLQUFLLEVBQUUseUNBQXlDO1FBQ3JELEdBQUcsRUFBRSxLQUFLLEVBQUUsa0NBQWtDO1FBQzlDLEdBQUcsRUFBRSxLQUFLLEVBQUUsa0NBQWtDO1FBQzlDLElBQUksRUFBRSxNQUFNLEVBQUUsMEJBQTBCO1FBQ3hDLENBQUMsRUFBRSxLQUFLLEVBQUUscUJBQXFCO1FBQy9CLEdBQUcsRUFBRSxLQUFLLEVBQUUsZUFBZTtRQUMzQixHQUFHLEVBQUUsS0FBSyxFQUFFLDRCQUE0QjtRQUN4QyxHQUFHLEVBQUUsS0FBSyxFQUFFLGNBQWM7UUFFMUIsMENBQTBDO1FBQzFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsd0JBQXdCO1FBQ2xDLEdBQUcsRUFBRSxJQUFJLEVBQUUseUJBQXlCO0tBQ3JDLENBQUM7SUFFRjs7Ozs7Ozs7O09BU0c7SUFDSCxNQUFNLENBQUMsZUFBZSxDQUFDLFVBQWtCLEVBQUUsT0FBMkIsRUFBRSxJQUFJLEVBQUUsSUFBSSxFQUFFO1FBQ2xGLElBQUksQ0FBQyxVQUFVLEVBQUUsTUFBTTtZQUFFLE9BQU8sVUFBVSxDQUFDO1FBRTNDLFFBQVE7UUFDUixzRUFBc0U7UUFFdEUsVUFBVSxHQUFHLFVBQVUsQ0FBQyxPQUFPLENBQUMsVUFBVSxFQUFFLEdBQUcsQ0FBQyxDQUFDLENBQUMsaUNBQWlDO1FBRW5GLGtCQUFrQjtRQUNsQixJQUFJLElBQUksRUFBRSxJQUFJLEtBQUssS0FBSyxFQUFFLENBQUM7WUFDekIsVUFBVSxHQUFHLFVBQVUsQ0FBQyxJQUFJLEVBQUUsQ0FBQztRQUNqQyxDQUFDO1FBRUQsc0NBQXNDO1FBQ3RDLFVBQVUsR0FBRyxVQUFVLENBQUMsT0FBTyxDQUFDLFNBQVMsRUFBRSxFQUFFLENBQUMsQ0FBQztRQUUvQyw2QkFBNkI7UUFDN0IsSUFBSSxVQUFVLEtBQUssR0FBRztZQUFFLE9BQU8sRUFBRSxDQUFDO1FBRWxDLE9BQU8sVUFBVSxDQUFDO0lBQ3BCLENBQUM7SUFFRDs7Ozs7OztPQU9HO0lBQ0gsTUFBTSxDQUFDLG1CQUFtQixDQUFDLFVBQWtCLEVBQUUsS0FBSyxHQUFHLElBQUk7UUFDekQsSUFBSSxDQUFDLFVBQVUsRUFBRSxNQUFNO1lBQUUsT0FBTyxJQUFJLENBQUM7UUFFckMsOEJBQThCO1FBQzlCLE1BQU0sUUFBUSxHQUFHLFVBQVUsR0FBRyxHQUFHLEdBQUcsS0FBSyxDQUFDO1FBQzFDLE1BQU0sWUFBWSxHQUFHLElBQUksQ0FBQyxvQkFBb0IsQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUN6RCxJQUFJLFlBQVk7WUFBRSxPQUFPLFlBQVksQ0FBQztRQUV0QyxNQUFNLGdCQUFnQixHQUFHLFVBQVUsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLHlCQUF5QixFQUFFLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxJQUFJLENBQUMsa0NBQWtDLENBQUMsS0FBSyxDQUFDLElBQUksS0FBSyxDQUFDLENBQUM7UUFFaEosUUFBUTtRQUNSLDZHQUE2RztRQUU3RyxNQUFNLE1BQU0sR0FBRyxJQUFJLE1BQU0sQ0FBQyxPQUFPLGdCQUFnQixFQUFFLEVBQUUsS0FBSyxDQUFDLENBQUM7UUFFNUQsK0NBQStDO1FBQy9DLElBQUksSUFBSSxDQUFDLGtCQUFrQixDQUFDLE1BQU0sSUFBSSxJQUFJLENBQUMsY0FBYyxFQUFFLENBQUM7WUFDMUQsUUFBUTtZQUNSLCtEQUErRDtZQUUvRCw4QkFBOEI7WUFDOUIsT0FBTyxJQUFJLENBQUMsa0JBQWtCLENBQUMsTUFBTSxHQUFHLElBQUksQ0FBQyxjQUFjLEdBQUcsQ0FBQyxFQUFFLENBQUM7Z0JBQ2hFLE1BQU0sZUFBZSxHQUFHLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxLQUFLLEVBQUUsQ0FBQztnQkFDeEQsT0FBTyxJQUFJLENBQUMsb0JBQW9CLENBQUMsZUFBZSxDQUFDLENBQUM7WUFDcEQsQ0FBQztRQUNILENBQUM7UUFFRCxzQkFBc0I7UUFDdEIsSUFBSSxDQUFDLG9CQUFvQixDQUFDLFFBQVEsQ0FBQyxHQUFHLE1BQU0sQ0FBQztRQUM3QyxJQUFJLENBQUMsa0JBQWtCLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1FBRXZDLE9BQU8sTUFBTSxDQUFDO0lBQ2hCLENBQUM7SUFFRCxNQUFNLENBQUMsS0FBSyxDQUFDLEtBQWEsRUFBRSxNQUF1QjtRQUNqRCxJQUFJLENBQUMsS0FBSztZQUFFLE9BQU8sS0FBSyxDQUFDO1FBQ3pCLElBQUksTUFBTSxZQUFZLE1BQU0sRUFBRSxDQUFDO1lBQzdCLE9BQU8sTUFBTSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUM1QixDQUFDO1FBQ0QsdUVBQXVFO1FBQ3ZFLHNEQUFzRDtRQUN0RCxPQUFPLENBQUMsQ0FBQyxLQUFLLENBQUMsS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDO0lBQy9CLENBQUM7SUFFRCxNQUFNLENBQUMsY0FBYyxDQUFDLEtBQWEsRUFBRSxNQUF1QjtRQUMxRCxPQUFPLFdBQVcsQ0FBQyxLQUFLLENBQUMsS0FBSyxFQUFFLFdBQVcsRUFBRSxFQUFFLE1BQU0sQ0FBQyxDQUFDO0lBQ3pELENBQUM7SUFFRCxNQUFNLENBQUMsb0JBQW9CLENBQUMsS0FBYTtRQUN2QyxPQUFPLENBQUMsS0FBSyxJQUFJLENBQUMsS0FBSyxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsSUFBSSxLQUFLLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsSUFBSSxLQUFLLENBQUM7SUFDMUUsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBhYnN0cmFjdCBjbGFzcyBSZWdFeHBVdGlscyB7XG4gIHByaXZhdGUgc3RhdGljIF9jYWNoZWRTZWFyY2hSZWdleHBzOiB7IFtrZXk6IHN0cmluZ106IFJlZ0V4cCB9ID0ge307XG4gIHByaXZhdGUgc3RhdGljIF9jYWNoZWRTZWFyY2hUZXh0czogc3RyaW5nW10gPSBbXTtcblxuICBwcml2YXRlIHN0YXRpYyBNQVhfQ0FDSEVfU0laRSA9IDEwMDtcbiAgcHJpdmF0ZSBzdGF0aWMgU1BFQ0lBTF9DSEFSQUNURVJTX1JFR0VYUCA9IC9bLlxcW1xcXSgpe31cXFxcJF58Kyo/XS87XG4gIHByaXZhdGUgc3RhdGljIFNQRUNJQUxfQ0hBUkFDVEVSU19SRVBMQUNFTUVOVF9NQVAgPSB7XG4gICAgLy8gRXNjYXBlIHNvbWUgY2hhcmFjdGVyc1xuICAgICcuJzogJ1suXScsIC8vIEVzY2FwZSBwb2ludFxuICAgICcoJzogJ1xcXFwoJywgLy8gRXNjYXBlIHBhcmVudGhlc2lzXG4gICAgJyknOiAnXFxcXCknLCAvLyBFc2NhcGUgcGFyZW50aGVzaXNcbiAgICAnWyc6ICdcXFxcWycsIC8vIEVzY2FwZSBjaGFyYWN0ZXIgY2xhc3Mgb3BlbmluZyBicmFja2V0XG4gICAgJ10nOiAnXFxcXF0nLCAvLyBFc2NhcGUgY2hhcmFjdGVyIGNsYXNzIGNsb3NpbmcgYnJhY2tldFxuICAgICd7JzogJ1xcXFx7JywgLy8gRXNjYXBlIHF1YW50aWZpZXIgb3BlbmluZyBicmFjZVxuICAgICd9JzogJ1xcXFx9JywgLy8gRXNjYXBlIHF1YW50aWZpZXIgY2xvc2luZyBicmFjZVxuICAgICdcXFxcJzogJ1xcXFxcXFxcJywgLy8gRXNjYXBlIGJhY2tzbGFzaCBpdHNlbGZcbiAgICAkOiAnXFxcXCQnLCAvLyBFc2NhcGUgZG9sbGFyIHNpZ25cbiAgICAnXic6ICdcXFxcXicsIC8vIEVzY2FwZSBjYXJldFxuICAgICd8JzogJ1xcXFx8JywgLy8gRXNjYXBlIHBpcGUgKGFsdGVybmF0aW9uKVxuICAgICcrJzogJ1xcXFwrJywgLy8gRXNjYXBlIHBsdXNcblxuICAgIC8vIFRyYW5zZm9ybSB3aWxkY2FyZCBjaGFyYWN0ZXJzIHRvIHJlZ2V4cFxuICAgICc/JzogJy4nLCAvLyBFeGFjdGx5IG9uZSBjaGFyYWN0ZXJcbiAgICAnKic6ICcuKicsIC8vIFplcm8gb3IgbW9yZSBjaGFyYWN0ZXJcbiAgfTtcblxuICAvKipcbiAgICogQ2xlYW5zIHRoZSBwcm92aWRlZCBzZWFyY2ggdGV4dCBieSB0cmltbWluZyB3aGl0ZXNwYWNlIGFuZCByZW1vdmluZyBvciBjb25kZW5zaW5nXG4gICAqIHdpbGRjYXJkIGNoYXJhY3RlcnMgYmFzZWQgb24gdGhlIHNwZWNpZmllZCBvcHRpb25zLlxuICAgKiAoZS5nLiAnYSoqJyBiZWNvbWVzICdhJywgJyonIGJlY29tZXMgJycsIGV0Yy4pXG4gICAqXG4gICAqIEBwYXJhbSB7c3RyaW5nfSBzZWFyY2hUZXh0IC0gVGhlIHNlYXJjaCB0ZXh0IHRvIGJlIGNsZWFuZWQuXG4gICAqIEBwYXJhbSB7T2JqZWN0fSBbb3B0c10gLSBPcHRpb25hbCBzZXR0aW5ncyBmb3IgY2xlYW5pbmcgdGhlIHNlYXJjaCB0ZXh0LlxuICAgKiBAcGFyYW0ge2Jvb2xlYW59IFtvcHRzLmFueVNlYXJjaF0gLSBJZiB0cnVlLCB0aGUgc2VhcmNoIHRleHQgaXMgY2xlYW5lZCBmb3IgYW55IG1hdGNoLiBJZiBmYWxzZSwgc2VhcmNoIGFzIGEgcHJlZml4XG4gICAqIEByZXR1cm4ge3N0cmluZ30gLSBUaGUgY2xlYW5lZCBzZWFyY2ggdGV4dC5cbiAgICovXG4gIHN0YXRpYyBjbGVhblNlYXJjaFRleHQoc2VhcmNoVGV4dDogc3RyaW5nLCBvcHRzOiB7IHRyaW0/OiBib29sZWFuIH0gPSB7IHRyaW06IHRydWUgfSk6IHN0cmluZyB7XG4gICAgaWYgKCFzZWFyY2hUZXh0Py5sZW5ndGgpIHJldHVybiBzZWFyY2hUZXh0O1xuXG4gICAgLy8gREVCVUdcbiAgICAvL2NvbnNvbGUuZGVidWcoYFtyZWdleHAtdXRpbHNdIENsZWFuaW5nIHNlYXJjaFRleHQgJyR7c2VhcmNoVGV4dH0nYCk7XG5cbiAgICBzZWFyY2hUZXh0ID0gc2VhcmNoVGV4dC5yZXBsYWNlKC9bKl17Mix9L2csICcqJyk7IC8vIFJlcGxhY2UgbWFueSAnKicgaW50byBvbmx5IG9uZVxuXG4gICAgLy8gVHJpbSB3aGl0ZXNwYWNlXG4gICAgaWYgKG9wdHM/LnRyaW0gIT09IGZhbHNlKSB7XG4gICAgICBzZWFyY2hUZXh0ID0gc2VhcmNoVGV4dC50cmltKCk7XG4gICAgfVxuXG4gICAgLy8gUmVtb3ZlIHRyYWlsaW5nIHdpbGRjYXJkIGNoYXJhY3RlcnNcbiAgICBzZWFyY2hUZXh0ID0gc2VhcmNoVGV4dC5yZXBsYWNlKC9eWypdKyQvZywgJycpO1xuXG4gICAgLy8gQ2xlYW4gYW55IG1hdGNoIGV4cHJlc3Npb25cbiAgICBpZiAoc2VhcmNoVGV4dCA9PT0gJyonKSByZXR1cm4gJyc7XG5cbiAgICByZXR1cm4gc2VhcmNoVGV4dDtcbiAgfVxuXG4gIC8qKlxuICAgKiBDb21waWxlcyBhIHJlZ3VsYXIgZXhwcmVzc2lvbiBmcm9tIHRoZSBwcm92aWRlZCBzZWFyY2ggdGV4dCwgdXNpbmcgYSBzdGF0aWMgY2FjaGUgdG8gc3RvcmVcbiAgICogcHJldmlvdXNseSBjb21waWxlZCByZWd1bGFyIGV4cHJlc3Npb25zIGZvciBmYXN0ZXIgcmV0cmlldmFsLlxuICAgKlxuICAgKiBAcGFyYW0ge3N0cmluZ30gc2VhcmNoVGV4dCAtIFRoZSB0ZXh0IHRvIGNvbXBpbGUgaW50byBhIHJlZ3VsYXIgZXhwcmVzc2lvbi5cbiAgICogQHBhcmFtIGZsYWdzXG4gICAqIEByZXR1cm4ge1JlZ0V4cH0gLSBUaGUgY29tcGlsZWQgcmVndWxhciBleHByZXNzaW9uLlxuICAgKi9cbiAgc3RhdGljIGNvbXBpbGVTZWFyY2hSZWdleHAoc2VhcmNoVGV4dDogc3RyaW5nLCBmbGFncyA9ICdnaScpOiBSZWdFeHAge1xuICAgIGlmICghc2VhcmNoVGV4dD8ubGVuZ3RoKSByZXR1cm4gbnVsbDtcblxuICAgIC8vIFVzZSBjYWNoZWQgcmVnZXhwIGlmIGV4aXN0c1xuICAgIGNvbnN0IGNhY2hlS2V5ID0gc2VhcmNoVGV4dCArICd8JyArIGZsYWdzO1xuICAgIGNvbnN0IGNhY2hlZFJlZ2V4cCA9IHRoaXMuX2NhY2hlZFNlYXJjaFJlZ2V4cHNbY2FjaGVLZXldO1xuICAgIGlmIChjYWNoZWRSZWdleHApIHJldHVybiBjYWNoZWRSZWdleHA7XG5cbiAgICBjb25zdCBzZWFyY2hSZWdleHBUZXh0ID0gc2VhcmNoVGV4dC5yZXBsYWNlKHRoaXMuU1BFQ0lBTF9DSEFSQUNURVJTX1JFR0VYUCwgKG1hdGNoKSA9PiB0aGlzLlNQRUNJQUxfQ0hBUkFDVEVSU19SRVBMQUNFTUVOVF9NQVBbbWF0Y2hdIHx8IG1hdGNoKTtcblxuICAgIC8vIERFQlVHXG4gICAgLy9jb25zb2xlLmRlYnVnKGBbcmVnZXhwLXV0aWxzXSBDb21wdXRpbmcgbmV3IHJlZ2V4cCAnJHtzZWFyY2hSZWdleHBUZXh0fScgZnJvbSBzZWFyY2hUZXh0ICcke3NlYXJjaFRleHR9J2ApO1xuXG4gICAgY29uc3QgcmVnZXhwID0gbmV3IFJlZ0V4cChgWyBdKiR7c2VhcmNoUmVnZXhwVGV4dH1gLCBmbGFncyk7XG5cbiAgICAvLyBJZiBjYWNoZSBpcyBmdWxsOiByZW1vdmUgb2xkZXIgY2FjaGUgZWxlbWVudFxuICAgIGlmICh0aGlzLl9jYWNoZWRTZWFyY2hUZXh0cy5sZW5ndGggPj0gdGhpcy5NQVhfQ0FDSEVfU0laRSkge1xuICAgICAgLy8gREVCVUdcbiAgICAgIC8vY29uc29sZS5kZWJ1ZygnW3JlZ2V4cC11dGlsc10gUmVtb3Zpbmcgb2xkZXIgY2FjaGVkIHJlZ2V4cCcpO1xuXG4gICAgICAvLyBDbGVhciBoYWxmIGNhY2hlJ3MgZWxlbWVudHNcbiAgICAgIHdoaWxlICh0aGlzLl9jYWNoZWRTZWFyY2hUZXh0cy5sZW5ndGggPiB0aGlzLk1BWF9DQUNIRV9TSVpFIC8gMikge1xuICAgICAgICBjb25zdCBjYWNoZUtleVRvRXZpY3QgPSB0aGlzLl9jYWNoZWRTZWFyY2hUZXh0cy5zaGlmdCgpO1xuICAgICAgICBkZWxldGUgdGhpcy5fY2FjaGVkU2VhcmNoUmVnZXhwc1tjYWNoZUtleVRvRXZpY3RdO1xuICAgICAgfVxuICAgIH1cblxuICAgIC8vIEFkZCB0byBzdGF0aWMgY2FjaGVcbiAgICB0aGlzLl9jYWNoZWRTZWFyY2hSZWdleHBzW2NhY2hlS2V5XSA9IHJlZ2V4cDtcbiAgICB0aGlzLl9jYWNoZWRTZWFyY2hUZXh0cy5wdXNoKGNhY2hlS2V5KTtcblxuICAgIHJldHVybiByZWdleHA7XG4gIH1cblxuICBzdGF0aWMgbWF0Y2goaW5wdXQ6IHN0cmluZywgcmVnZXhwOiBzdHJpbmcgfCBSZWdFeHApOiBib29sZWFuIHtcbiAgICBpZiAoIWlucHV0KSByZXR1cm4gZmFsc2U7XG4gICAgaWYgKHJlZ2V4cCBpbnN0YW5jZW9mIFJlZ0V4cCkge1xuICAgICAgcmV0dXJuIHJlZ2V4cC50ZXN0KGlucHV0KTtcbiAgICB9XG4gICAgLy8gU2kgYydlc3QgdW5lIHN0cmluZywgb24gZ2FyZGUgbWF0Y2ggcXVpIGZlcmEgbGEgY29udmVyc2lvbiBpbXBsaWNpdGVcbiAgICAvLyBvdSBvbiBwb3VycmFpdCBmYWlyZSBuZXcgUmVnRXhwKHJlZ2V4cCkudGVzdChpbnB1dClcbiAgICByZXR1cm4gISFpbnB1dC5tYXRjaChyZWdleHApO1xuICB9XG5cbiAgc3RhdGljIG1hdGNoVXBwZXJDYXNlKGlucHV0OiBzdHJpbmcsIHJlZ2V4cDogc3RyaW5nIHwgUmVnRXhwKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIFJlZ0V4cFV0aWxzLm1hdGNoKGlucHV0Py50b1VwcGVyQ2FzZSgpLCByZWdleHApO1xuICB9XG5cbiAgc3RhdGljIGhhc1dpbGRjYXJkQ2hhcmFjdGVyKGlucHV0OiBzdHJpbmcpOiBib29sZWFuIHtcbiAgICByZXR1cm4gKGlucHV0ICYmIChpbnB1dC5pbmNsdWRlcygnKicpIHx8IGlucHV0LmluY2x1ZGVzKCc/JykpKSB8fCBmYWxzZTtcbiAgfVxufVxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmVnZXhwcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9hcHAvc2hhcmVkL3JlZ2V4cHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsTUFBTSxPQUFnQixXQUFXO0lBQ3ZCLE1BQU0sQ0FBQyxvQkFBb0IsR0FBOEIsRUFBRSxDQUFDO0lBQzVELE1BQU0sQ0FBQyxrQkFBa0IsR0FBYSxFQUFFLENBQUM7SUFFekMsTUFBTSxDQUFDLGNBQWMsR0FBRyxHQUFHLENBQUM7SUFDNUIsTUFBTSxDQUFDLHlCQUF5QixHQUFHLHNCQUFzQixDQUFDO0lBQzFELE1BQU0sQ0FBQyxrQ0FBa0MsR0FBRztRQUNsRCx5QkFBeUI7UUFDekIsR0FBRyxFQUFFLEtBQUssRUFBRSxlQUFlO1FBQzNCLEdBQUcsRUFBRSxLQUFLLEVBQUUscUJBQXFCO1FBQ2pDLEdBQUcsRUFBRSxLQUFLLEVBQUUscUJBQXFCO1FBQ2pDLEdBQUcsRUFBRSxLQUFLLEVBQUUseUNBQXlDO1FBQ3JELEdBQUcsRUFBRSxLQUFLLEVBQUUseUNBQXlDO1FBQ3JELEdBQUcsRUFBRSxLQUFLLEVBQUUsa0NBQWtDO1FBQzlDLEdBQUcsRUFBRSxLQUFLLEVBQUUsa0NBQWtDO1FBQzlDLElBQUksRUFBRSxNQUFNLEVBQUUsMEJBQTBCO1FBQ3hDLENBQUMsRUFBRSxLQUFLLEVBQUUscUJBQXFCO1FBQy9CLEdBQUcsRUFBRSxLQUFLLEVBQUUsZUFBZTtRQUMzQixHQUFHLEVBQUUsS0FBSyxFQUFFLDRCQUE0QjtRQUN4QyxHQUFHLEVBQUUsS0FBSyxFQUFFLGNBQWM7UUFFMUIsMENBQTBDO1FBQzFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsd0JBQXdCO1FBQ2xDLEdBQUcsRUFBRSxJQUFJLEVBQUUseUJBQXlCO0tBQ3JDLENBQUM7SUFFRjs7Ozs7Ozs7O09BU0c7SUFDSCxNQUFNLENBQUMsZUFBZSxDQUFDLFVBQWtCLEVBQUUsT0FBMkIsRUFBRSxJQUFJLEVBQUUsSUFBSSxFQUFFO1FBQ2xGLElBQUksQ0FBQyxVQUFVLEVBQUUsTUFBTTtZQUFFLE9BQU8sVUFBVSxDQUFDO1FBRTNDLFFBQVE7UUFDUixzRUFBc0U7UUFFdEUsVUFBVSxHQUFHLFVBQVUsQ0FBQyxPQUFPLENBQUMsVUFBVSxFQUFFLEdBQUcsQ0FBQyxDQUFDLENBQUMsaUNBQWlDO1FBRW5GLGtCQUFrQjtRQUNsQixJQUFJLElBQUksRUFBRSxJQUFJLEtBQUssS0FBSyxFQUFFLENBQUM7WUFDekIsVUFBVSxHQUFHLFVBQVUsQ0FBQyxJQUFJLEVBQUUsQ0FBQztRQUNqQyxDQUFDO1FBRUQsc0NBQXNDO1FBQ3RDLFVBQVUsR0FBRyxVQUFVLENBQUMsT0FBTyxDQUFDLFNBQVMsRUFBRSxFQUFFLENBQUMsQ0FBQztRQUUvQyw2QkFBNkI7UUFDN0IsSUFBSSxVQUFVLEtBQUssR0FBRztZQUFFLE9BQU8sRUFBRSxDQUFDO1FBRWxDLE9BQU8sVUFBVSxDQUFDO0lBQ3BCLENBQUM7SUFFRDs7Ozs7OztPQU9HO0lBQ0gsTUFBTSxDQUFDLG1CQUFtQixDQUFDLFVBQWtCLEVBQUUsS0FBSyxHQUFHLElBQUk7UUFDekQsSUFBSSxDQUFDLFVBQVUsRUFBRSxNQUFNO1lBQUUsT0FBTyxJQUFJLENBQUM7UUFFckMsOEJBQThCO1FBQzlCLE1BQU0sUUFBUSxHQUFHLFVBQVUsR0FBRyxHQUFHLEdBQUcsS0FBSyxDQUFDO1FBQzFDLE1BQU0sWUFBWSxHQUFHLFdBQVcsQ0FBQyxvQkFBb0IsQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUNoRSxJQUFJLFlBQVk7WUFBRSxPQUFPLFlBQVksQ0FBQztRQUV0QyxNQUFNLGdCQUFnQixHQUFHLFVBQVUsQ0FBQyxPQUFPLENBQUMsV0FBVyxDQUFDLHlCQUF5QixFQUFFLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxXQUFXLENBQUMsa0NBQWtDLENBQUMsS0FBSyxDQUFDLElBQUksS0FBSyxDQUFDLENBQUM7UUFFOUosUUFBUTtRQUNSLDZHQUE2RztRQUU3RyxNQUFNLE1BQU0sR0FBRyxJQUFJLE1BQU0sQ0FBQyxPQUFPLGdCQUFnQixFQUFFLEVBQUUsS0FBSyxDQUFDLENBQUM7UUFFNUQsK0NBQStDO1FBQy9DLElBQUksV0FBVyxDQUFDLGtCQUFrQixDQUFDLE1BQU0sSUFBSSxXQUFXLENBQUMsY0FBYyxFQUFFLENBQUM7WUFDeEUsUUFBUTtZQUNSLCtEQUErRDtZQUUvRCw4QkFBOEI7WUFDOUIsT0FBTyxXQUFXLENBQUMsa0JBQWtCLENBQUMsTUFBTSxHQUFHLFdBQVcsQ0FBQyxjQUFjLEdBQUcsQ0FBQyxFQUFFLENBQUM7Z0JBQzlFLE1BQU0sZUFBZSxHQUFHLFdBQVcsQ0FBQyxrQkFBa0IsQ0FBQyxLQUFLLEVBQUUsQ0FBQztnQkFDL0QsT0FBTyxXQUFXLENBQUMsb0JBQW9CLENBQUMsZUFBZSxDQUFDLENBQUM7WUFDM0QsQ0FBQztRQUNILENBQUM7UUFFRCxzQkFBc0I7UUFDdEIsV0FBVyxDQUFDLG9CQUFvQixDQUFDLFFBQVEsQ0FBQyxHQUFHLE1BQU0sQ0FBQztRQUNwRCxXQUFXLENBQUMsa0JBQWtCLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1FBRTlDLE9BQU8sTUFBTSxDQUFDO0lBQ2hCLENBQUM7SUFFRCxNQUFNLENBQUMsS0FBSyxDQUFDLEtBQWEsRUFBRSxNQUF1QjtRQUNqRCxJQUFJLENBQUMsS0FBSztZQUFFLE9BQU8sS0FBSyxDQUFDO1FBQ3pCLElBQUksTUFBTSxZQUFZLE1BQU0sRUFBRSxDQUFDO1lBQzdCLE9BQU8sTUFBTSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUM1QixDQUFDO1FBQ0QsdUVBQXVFO1FBQ3ZFLHNEQUFzRDtRQUN0RCxPQUFPLENBQUMsQ0FBQyxLQUFLLENBQUMsS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDO0lBQy9CLENBQUM7SUFFRCxNQUFNLENBQUMsY0FBYyxDQUFDLEtBQWEsRUFBRSxNQUF1QjtRQUMxRCxPQUFPLFdBQVcsQ0FBQyxLQUFLLENBQUMsS0FBSyxFQUFFLFdBQVcsRUFBRSxFQUFFLE1BQU0sQ0FBQyxDQUFDO0lBQ3pELENBQUM7SUFFRCxNQUFNLENBQUMsb0JBQW9CLENBQUMsS0FBYTtRQUN2QyxPQUFPLENBQUMsS0FBSyxJQUFJLENBQUMsS0FBSyxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsSUFBSSxLQUFLLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsSUFBSSxLQUFLLENBQUM7SUFDMUUsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBhYnN0cmFjdCBjbGFzcyBSZWdFeHBVdGlscyB7XG4gIHByaXZhdGUgc3RhdGljIF9jYWNoZWRTZWFyY2hSZWdleHBzOiB7IFtrZXk6IHN0cmluZ106IFJlZ0V4cCB9ID0ge307XG4gIHByaXZhdGUgc3RhdGljIF9jYWNoZWRTZWFyY2hUZXh0czogc3RyaW5nW10gPSBbXTtcblxuICBwcml2YXRlIHN0YXRpYyBNQVhfQ0FDSEVfU0laRSA9IDEwMDtcbiAgcHJpdmF0ZSBzdGF0aWMgU1BFQ0lBTF9DSEFSQUNURVJTX1JFR0VYUCA9IC9bLlxcW1xcXSgpe31cXFxcJF58Kyo/XS9nO1xuICBwcml2YXRlIHN0YXRpYyBTUEVDSUFMX0NIQVJBQ1RFUlNfUkVQTEFDRU1FTlRfTUFQID0ge1xuICAgIC8vIEVzY2FwZSBzb21lIGNoYXJhY3RlcnNcbiAgICAnLic6ICdbLl0nLCAvLyBFc2NhcGUgcG9pbnRcbiAgICAnKCc6ICdcXFxcKCcsIC8vIEVzY2FwZSBwYXJlbnRoZXNpc1xuICAgICcpJzogJ1xcXFwpJywgLy8gRXNjYXBlIHBhcmVudGhlc2lzXG4gICAgJ1snOiAnXFxcXFsnLCAvLyBFc2NhcGUgY2hhcmFjdGVyIGNsYXNzIG9wZW5pbmcgYnJhY2tldFxuICAgICddJzogJ1xcXFxdJywgLy8gRXNjYXBlIGNoYXJhY3RlciBjbGFzcyBjbG9zaW5nIGJyYWNrZXRcbiAgICAneyc6ICdcXFxceycsIC8vIEVzY2FwZSBxdWFudGlmaWVyIG9wZW5pbmcgYnJhY2VcbiAgICAnfSc6ICdcXFxcfScsIC8vIEVzY2FwZSBxdWFudGlmaWVyIGNsb3NpbmcgYnJhY2VcbiAgICAnXFxcXCc6ICdcXFxcXFxcXCcsIC8vIEVzY2FwZSBiYWNrc2xhc2ggaXRzZWxmXG4gICAgJDogJ1xcXFwkJywgLy8gRXNjYXBlIGRvbGxhciBzaWduXG4gICAgJ14nOiAnXFxcXF4nLCAvLyBFc2NhcGUgY2FyZXRcbiAgICAnfCc6ICdcXFxcfCcsIC8vIEVzY2FwZSBwaXBlIChhbHRlcm5hdGlvbilcbiAgICAnKyc6ICdcXFxcKycsIC8vIEVzY2FwZSBwbHVzXG5cbiAgICAvLyBUcmFuc2Zvcm0gd2lsZGNhcmQgY2hhcmFjdGVycyB0byByZWdleHBcbiAgICAnPyc6ICcuJywgLy8gRXhhY3RseSBvbmUgY2hhcmFjdGVyXG4gICAgJyonOiAnLionLCAvLyBaZXJvIG9yIG1vcmUgY2hhcmFjdGVyXG4gIH07XG5cbiAgLyoqXG4gICAqIENsZWFucyB0aGUgcHJvdmlkZWQgc2VhcmNoIHRleHQgYnkgdHJpbW1pbmcgd2hpdGVzcGFjZSBhbmQgcmVtb3Zpbmcgb3IgY29uZGVuc2luZ1xuICAgKiB3aWxkY2FyZCBjaGFyYWN0ZXJzIGJhc2VkIG9uIHRoZSBzcGVjaWZpZWQgb3B0aW9ucy5cbiAgICogKGUuZy4gJ2EqKicgYmVjb21lcyAnYScsICcqJyBiZWNvbWVzICcnLCBldGMuKVxuICAgKlxuICAgKiBAcGFyYW0ge3N0cmluZ30gc2VhcmNoVGV4dCAtIFRoZSBzZWFyY2ggdGV4dCB0byBiZSBjbGVhbmVkLlxuICAgKiBAcGFyYW0ge09iamVjdH0gW29wdHNdIC0gT3B0aW9uYWwgc2V0dGluZ3MgZm9yIGNsZWFuaW5nIHRoZSBzZWFyY2ggdGV4dC5cbiAgICogQHBhcmFtIHtib29sZWFufSBbb3B0cy5hbnlTZWFyY2hdIC0gSWYgdHJ1ZSwgdGhlIHNlYXJjaCB0ZXh0IGlzIGNsZWFuZWQgZm9yIGFueSBtYXRjaC4gSWYgZmFsc2UsIHNlYXJjaCBhcyBhIHByZWZpeFxuICAgKiBAcmV0dXJuIHtzdHJpbmd9IC0gVGhlIGNsZWFuZWQgc2VhcmNoIHRleHQuXG4gICAqL1xuICBzdGF0aWMgY2xlYW5TZWFyY2hUZXh0KHNlYXJjaFRleHQ6IHN0cmluZywgb3B0czogeyB0cmltPzogYm9vbGVhbiB9ID0geyB0cmltOiB0cnVlIH0pOiBzdHJpbmcge1xuICAgIGlmICghc2VhcmNoVGV4dD8ubGVuZ3RoKSByZXR1cm4gc2VhcmNoVGV4dDtcblxuICAgIC8vIERFQlVHXG4gICAgLy9jb25zb2xlLmRlYnVnKGBbcmVnZXhwLXV0aWxzXSBDbGVhbmluZyBzZWFyY2hUZXh0ICcke3NlYXJjaFRleHR9J2ApO1xuXG4gICAgc2VhcmNoVGV4dCA9IHNlYXJjaFRleHQucmVwbGFjZSgvWypdezIsfS9nLCAnKicpOyAvLyBSZXBsYWNlIG1hbnkgJyonIGludG8gb25seSBvbmVcblxuICAgIC8vIFRyaW0gd2hpdGVzcGFjZVxuICAgIGlmIChvcHRzPy50cmltICE9PSBmYWxzZSkge1xuICAgICAgc2VhcmNoVGV4dCA9IHNlYXJjaFRleHQudHJpbSgpO1xuICAgIH1cblxuICAgIC8vIFJlbW92ZSB0cmFpbGluZyB3aWxkY2FyZCBjaGFyYWN0ZXJzXG4gICAgc2VhcmNoVGV4dCA9IHNlYXJjaFRleHQucmVwbGFjZSgvXlsqXSskL2csICcnKTtcblxuICAgIC8vIENsZWFuIGFueSBtYXRjaCBleHByZXNzaW9uXG4gICAgaWYgKHNlYXJjaFRleHQgPT09ICcqJykgcmV0dXJuICcnO1xuXG4gICAgcmV0dXJuIHNlYXJjaFRleHQ7XG4gIH1cblxuICAvKipcbiAgICogQ29tcGlsZXMgYSByZWd1bGFyIGV4cHJlc3Npb24gZnJvbSB0aGUgcHJvdmlkZWQgc2VhcmNoIHRleHQsIHVzaW5nIGEgc3RhdGljIGNhY2hlIHRvIHN0b3JlXG4gICAqIHByZXZpb3VzbHkgY29tcGlsZWQgcmVndWxhciBleHByZXNzaW9ucyBmb3IgZmFzdGVyIHJldHJpZXZhbC5cbiAgICpcbiAgICogQHBhcmFtIHtzdHJpbmd9IHNlYXJjaFRleHQgLSBUaGUgdGV4dCB0byBjb21waWxlIGludG8gYSByZWd1bGFyIGV4cHJlc3Npb24uXG4gICAqIEBwYXJhbSBmbGFnc1xuICAgKiBAcmV0dXJuIHtSZWdFeHB9IC0gVGhlIGNvbXBpbGVkIHJlZ3VsYXIgZXhwcmVzc2lvbi5cbiAgICovXG4gIHN0YXRpYyBjb21waWxlU2VhcmNoUmVnZXhwKHNlYXJjaFRleHQ6IHN0cmluZywgZmxhZ3MgPSAnZ2knKTogUmVnRXhwIHtcbiAgICBpZiAoIXNlYXJjaFRleHQ/Lmxlbmd0aCkgcmV0dXJuIG51bGw7XG5cbiAgICAvLyBVc2UgY2FjaGVkIHJlZ2V4cCBpZiBleGlzdHNcbiAgICBjb25zdCBjYWNoZUtleSA9IHNlYXJjaFRleHQgKyAnfCcgKyBmbGFncztcbiAgICBjb25zdCBjYWNoZWRSZWdleHAgPSBSZWdFeHBVdGlscy5fY2FjaGVkU2VhcmNoUmVnZXhwc1tjYWNoZUtleV07XG4gICAgaWYgKGNhY2hlZFJlZ2V4cCkgcmV0dXJuIGNhY2hlZFJlZ2V4cDtcblxuICAgIGNvbnN0IHNlYXJjaFJlZ2V4cFRleHQgPSBzZWFyY2hUZXh0LnJlcGxhY2UoUmVnRXhwVXRpbHMuU1BFQ0lBTF9DSEFSQUNURVJTX1JFR0VYUCwgKG1hdGNoKSA9PiBSZWdFeHBVdGlscy5TUEVDSUFMX0NIQVJBQ1RFUlNfUkVQTEFDRU1FTlRfTUFQW21hdGNoXSB8fCBtYXRjaCk7XG5cbiAgICAvLyBERUJVR1xuICAgIC8vY29uc29sZS5kZWJ1ZyhgW3JlZ2V4cC11dGlsc10gQ29tcHV0aW5nIG5ldyByZWdleHAgJyR7c2VhcmNoUmVnZXhwVGV4dH0nIGZyb20gc2VhcmNoVGV4dCAnJHtzZWFyY2hUZXh0fSdgKTtcblxuICAgIGNvbnN0IHJlZ2V4cCA9IG5ldyBSZWdFeHAoYFsgXSoke3NlYXJjaFJlZ2V4cFRleHR9YCwgZmxhZ3MpO1xuXG4gICAgLy8gSWYgY2FjaGUgaXMgZnVsbDogcmVtb3ZlIG9sZGVyIGNhY2hlIGVsZW1lbnRcbiAgICBpZiAoUmVnRXhwVXRpbHMuX2NhY2hlZFNlYXJjaFRleHRzLmxlbmd0aCA+PSBSZWdFeHBVdGlscy5NQVhfQ0FDSEVfU0laRSkge1xuICAgICAgLy8gREVCVUdcbiAgICAgIC8vY29uc29sZS5kZWJ1ZygnW3JlZ2V4cC11dGlsc10gUmVtb3Zpbmcgb2xkZXIgY2FjaGVkIHJlZ2V4cCcpO1xuXG4gICAgICAvLyBDbGVhciBoYWxmIGNhY2hlJ3MgZWxlbWVudHNcbiAgICAgIHdoaWxlIChSZWdFeHBVdGlscy5fY2FjaGVkU2VhcmNoVGV4dHMubGVuZ3RoID4gUmVnRXhwVXRpbHMuTUFYX0NBQ0hFX1NJWkUgLyAyKSB7XG4gICAgICAgIGNvbnN0IGNhY2hlS2V5VG9FdmljdCA9IFJlZ0V4cFV0aWxzLl9jYWNoZWRTZWFyY2hUZXh0cy5zaGlmdCgpO1xuICAgICAgICBkZWxldGUgUmVnRXhwVXRpbHMuX2NhY2hlZFNlYXJjaFJlZ2V4cHNbY2FjaGVLZXlUb0V2aWN0XTtcbiAgICAgIH1cbiAgICB9XG5cbiAgICAvLyBBZGQgdG8gc3RhdGljIGNhY2hlXG4gICAgUmVnRXhwVXRpbHMuX2NhY2hlZFNlYXJjaFJlZ2V4cHNbY2FjaGVLZXldID0gcmVnZXhwO1xuICAgIFJlZ0V4cFV0aWxzLl9jYWNoZWRTZWFyY2hUZXh0cy5wdXNoKGNhY2hlS2V5KTtcblxuICAgIHJldHVybiByZWdleHA7XG4gIH1cblxuICBzdGF0aWMgbWF0Y2goaW5wdXQ6IHN0cmluZywgcmVnZXhwOiBzdHJpbmcgfCBSZWdFeHApOiBib29sZWFuIHtcbiAgICBpZiAoIWlucHV0KSByZXR1cm4gZmFsc2U7XG4gICAgaWYgKHJlZ2V4cCBpbnN0YW5jZW9mIFJlZ0V4cCkge1xuICAgICAgcmV0dXJuIHJlZ2V4cC50ZXN0KGlucHV0KTtcbiAgICB9XG4gICAgLy8gU2kgYydlc3QgdW5lIHN0cmluZywgb24gZ2FyZGUgbWF0Y2ggcXVpIGZlcmEgbGEgY29udmVyc2lvbiBpbXBsaWNpdGVcbiAgICAvLyBvdSBvbiBwb3VycmFpdCBmYWlyZSBuZXcgUmVnRXhwKHJlZ2V4cCkudGVzdChpbnB1dClcbiAgICByZXR1cm4gISFpbnB1dC5tYXRjaChyZWdleHApO1xuICB9XG5cbiAgc3RhdGljIG1hdGNoVXBwZXJDYXNlKGlucHV0OiBzdHJpbmcsIHJlZ2V4cDogc3RyaW5nIHwgUmVnRXhwKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIFJlZ0V4cFV0aWxzLm1hdGNoKGlucHV0Py50b1VwcGVyQ2FzZSgpLCByZWdleHApO1xuICB9XG5cbiAgc3RhdGljIGhhc1dpbGRjYXJkQ2hhcmFjdGVyKGlucHV0OiBzdHJpbmcpOiBib29sZWFuIHtcbiAgICByZXR1cm4gKGlucHV0ICYmIChpbnB1dC5pbmNsdWRlcygnKicpIHx8IGlucHV0LmluY2x1ZGVzKCc/JykpKSB8fCBmYWxzZTtcbiAgfVxufVxuIl19

package/fesm2022/sumaris-net.ngx-components.mjs

@@ -247,7 +247,7 @@ class RegExpUtils {
     static _cachedSearchRegexps = {};
     static _cachedSearchTexts = [];
     static MAX_CACHE_SIZE = 100;
-    static SPECIAL_CHARACTERS_REGEXP = /[.\[\](){}\\$^|+*?]/;
+    static SPECIAL_CHARACTERS_REGEXP = /[.\[\](){}\\$^|+*?]/g;
     static SPECIAL_CHARACTERS_REPLACEMENT_MAP = {
         // Escape some characters
         '.': '[.]', // Escape point
@@ -306,26 +306,26 @@ class RegExpUtils {
             return null;
         // Use cached regexp if exists
         const cacheKey = searchText + '|' + flags;
-        const cachedRegexp = this._cachedSearchRegexps[cacheKey];
+        const cachedRegexp = RegExpUtils._cachedSearchRegexps[cacheKey];
         if (cachedRegexp)
             return cachedRegexp;
-        const searchRegexpText = searchText.replace(this.SPECIAL_CHARACTERS_REGEXP, (match) => this.SPECIAL_CHARACTERS_REPLACEMENT_MAP[match] || match);
+        const searchRegexpText = searchText.replace(RegExpUtils.SPECIAL_CHARACTERS_REGEXP, (match) => RegExpUtils.SPECIAL_CHARACTERS_REPLACEMENT_MAP[match] || match);
         // DEBUG
         //console.debug(`[regexp-utils] Computing new regexp '${searchRegexpText}' from searchText '${searchText}'`);
         const regexp = new RegExp(`[ ]*${searchRegexpText}`, flags);
         // If cache is full: remove older cache element
-        if (this._cachedSearchTexts.length >= this.MAX_CACHE_SIZE) {
+        if (RegExpUtils._cachedSearchTexts.length >= RegExpUtils.MAX_CACHE_SIZE) {
             // DEBUG
             //console.debug('[regexp-utils] Removing older cached regexp');
             // Clear half cache's elements
-            while (this._cachedSearchTexts.length > this.MAX_CACHE_SIZE / 2) {
-                const cacheKeyToEvict = this._cachedSearchTexts.shift();
-                delete this._cachedSearchRegexps[cacheKeyToEvict];
+            while (RegExpUtils._cachedSearchTexts.length > RegExpUtils.MAX_CACHE_SIZE / 2) {
+                const cacheKeyToEvict = RegExpUtils._cachedSearchTexts.shift();
+                delete RegExpUtils._cachedSearchRegexps[cacheKeyToEvict];
             }
         }
         // Add to static cache
-        this._cachedSearchRegexps[cacheKey] = regexp;
-        this._cachedSearchTexts.push(cacheKey);
+        RegExpUtils._cachedSearchRegexps[cacheKey] = regexp;
+        RegExpUtils._cachedSearchTexts.push(cacheKey);
         return regexp;
     }
     static match(input, regexp) {
@@ -10003,11 +10003,11 @@ class MatAutocompleteField {
         this.toggleFavorite.emit({ source: this.matSelect || this.autocomplete, value: value });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MatAutocompleteField, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i2$1.ModalController }, { token: i0.Renderer2 }, { token: i1$3.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: MatAutocompleteField, selector: "mat-autocomplete-field", inputs: { equals: "equals", logPrefix: "logPrefix", formControl: "formControl", formControlName: "formControlName", floatLabel: "floatLabel", label: "label", appearance: "appearance", subscriptSizing: "subscriptSizing", placeholder: "placeholder", suggestFn: "suggestFn", required: ["required", "required", booleanAttribute], hideRequiredMarker: ["hideRequiredMarker", "hideRequiredMarker", booleanAttribute], mobile: ["mobile", "mobile", booleanAttribute], clearable: ["clearable", "clearable", booleanAttribute], debounceTime: ["debounceTime", "debounceTime", numberAttribute], displaySeparator: "displaySeparator", displayWith: "displayWith", displayAttributes: "displayAttributes", displayColumnSizes: "displayColumnSizes", displayColumnNames: "displayColumnNames", highlightAccent: ["highlightAccent", "highlightAccent", booleanAttribute], showAllOnFocus: ["showAllOnFocus", "showAllOnFocus", booleanAttribute], showPanelOnFocus: ["showPanelOnFocus", "showPanelOnFocus", booleanAttribute], reloadItemsOnFocus: ["reloadItemsOnFocus", "reloadItemsOnFocus", booleanAttribute], clearInvalidValueOnBlur: ["clearInvalidValueOnBlur", "clearInvalidValueOnBlur", booleanAttribute], autofocus: ["autofocus", "autofocus", booleanAttribute], config: "config", i18nPrefix: "i18nPrefix", noResultMessage: "noResultMessage", panelClass: "panelClass", panelWidth: "panelWidth", disableRipple: ["disableRipple", "disableRipple", booleanAttribute], matAutocompletePosition: "matAutocompletePosition", multiple: ["multiple", "multiple", booleanAttribute], fetchMoreThreshold: "fetchMoreThreshold", suggestLengthThreshold: ["suggestLengthThreshold", "suggestLengthThreshold", numberAttribute], showLoadingSpinner: ["showLoadingSpinner", "showLoadingSpinner", booleanAttribute], debug: ["debug", "debug", booleanAttribute], showSearchBar: ["showSearchBar", "showSearchBar", booleanAttribute], stickySearchBar: ["stickySearchBar", "stickySearchBar", booleanAttribute], applyImplicitValue: "applyImplicitValue", dropButtonTitle: "dropButtonTitle", clearButtonTitle: "clearButtonTitle", trimSearchText: ["trimSearchText", "trimSearchText", booleanAttribute], splitSearchText: ["splitSearchText", "splitSearchText", booleanAttribute], selectInputContentOnFocus: ["selectInputContentOnFocus", "selectInputContentOnFocus", booleanAttribute], selectInputContentOnFocusDelay: ["selectInputContentOnFocusDelay", "selectInputContentOnFocusDelay", numberAttribute], previewImplicitValue: ["previewImplicitValue", "previewImplicitValue", booleanAttribute], showFavorites: "showFavorites", toggleFavoriteTitle: "toggleFavoriteTitle", favoriteItems: "favoriteItems", colSizes: "colSizes", classList: ["class", "classList"], filter: "filter", readonly: ["readonly", "readonly", booleanAttribute], tabindex: "tabindex", items: "items" }, outputs: { clicked: "click", blurred: "blur", focused: "focus", dropButtonClick: "dropButtonClick", keydownEscape: "keydown.escape", keydownBackspace: "keydown.backspace", keyupEnter: "keyup.enter", selectionChange: "selectionChange", openedChange: "openedChange", toggleFavorite: "toggleFavorite" }, providers: [DEFAULT_VALUE_ACCESSOR$4], viewQueries: [{ propertyName: "matSelect", first: true, predicate: ["matSelect"], descendants: true }, { propertyName: "ionSearchbar", first: true, predicate: ["ionSearchbar"], descendants: true }, { propertyName: "matInputText", first: true, predicate: ["matInputText"], descendants: true }, { propertyName: "autocomplete", first: true, predicate: MatAutocomplete, descendants: true }, { propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }], ngImport: i0, template: "<ion-grid class=\"ion-no-padding field-container\">\n  <ion-row>\n    <ion-col [size]=\"colSizes?.[0]\" class=\"ion-no-padding\">\n      <!-- readonly -->\n      @if (_readonly) {\n        <mat-form-field\n          [floatLabel]=\"floatLabel | asFloatLabelType\"\n          [appearance]=\"appearance\"\n          [subscriptSizing]=\"subscriptSizing\"\n          [title]=\"_displayValue || ''\"\n          class=\"mat-form-field-disabled\"\n        >\n          <div matPrefix>\n            <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n          </div>\n          @if (floatLabel !== 'never' && !!placeholder) {\n            <mat-label>{{ placeholder }}</mat-label>\n          }\n          <input matInput hidden type=\"text\" readonly=\"true\" [formControl]=\"formControl\" />\n          <ion-text>{{ value | toString: displayWith }}</ion-text>\n          <div matSuffix>\n            <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n          </div>\n          <!-- hints -->\n          @if (!formControl.invalid) {\n            <mat-hint>\n              <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n            </mat-hint>\n          }\n        </mat-form-field>\n      } @else {\n        @let hasFavorites = toggleFavorite.observed || (favoriteItems | isNotEmptyArray);\n\n        <mat-form-field\n          [floatLabel]=\"floatLabel | asFloatLabelType\"\n          [appearance]=\"appearance\"\n          [subscriptSizing]=\"subscriptSizing\"\n          [title]=\"_displayValue || ''\"\n          [hideRequiredMarker]=\"hideRequiredMarker\"\n        >\n          <div matPrefix>\n            <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n          </div>\n          @if ((label || placeholder) && floatLabel !== 'never') {\n            <mat-label>{{ label || placeholder }}</mat-label>\n          }\n          <!-- Mobile or Multiple (use <mat-select>) -->\n          @if (mobile || multiple) {\n            <mat-select\n              #matSelect\n              hideSingleSelectionIndicator\n              disableOptionCentering\n              [disableRipple]=\"disableRipple\"\n              [formControl]=\"formControl\"\n              [tabindex]=\"_tabindex\"\n              [panelClass]=\"panelClass\"\n              [panelWidth]=\"panelWidth || _defaultPanelWidth\"\n              (focus)=\"filterMatSelectFocusEvent($event)\"\n              (blur)=\"filterMatSelectBlurEvent($event)\"\n              (keydown.escape)=\"keydownEscape.emit($event)\"\n              (keyup.enter)=\"keyupEnter.emit($event)\"\n              (selectionChange)=\"onSelectionChange($event)\"\n              (openedChange)=\"openedChange.emit($event)\"\n              [compareWith]=\"equals\"\n              [multiple]=\"multiple\"\n              [typeaheadDebounceInterval]=\"debounceTime * 10\"\n              [required]=\"required\"\n              [class.mat-mdc-select-arrow-hidden]=\"!mobile\"\n            >\n              <mat-select-trigger>{{ value | toString: displayWith }}</mat-select-trigger>\n              <!-- Search bar -->\n              @if (showSearchBar) {\n                <mat-optgroup class=\"mat-select-searchbar\" [class.mat-select-searchbar-sticky]=\"stickySearchBar\">\n                  <!-- FIXME on iOS devices, when animated=\"true\", then the search icon overlap the placeholder -->\n                  <ion-searchbar\n                    #ionSearchbar\n                    inputmode=\"search\"\n                    autocomplete=\"off\"\n                    animated=\"false\"\n                    showClearButton=\"true\"\n                    [debounce]=\"debounceTime\"\n                    (ionClear)=\"markAsLoading()\"\n                    (ionInput)=\"ionSearchBarChanged($event)\"\n                    [placeholder]=\"'COMMON.BTN_SEARCH' | translate\"\n                  ></ion-searchbar>\n                </mat-optgroup>\n              }\n              <!-- Headers -->\n              <ion-row\n                class=\"mat-select-header column ion-no-padding\"\n                [class.multiple]=\"multiple\"\n                [class.mat-select-searchbar-sticky]=\"showSearchBar && stickySearchBar\"\n                [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\"\n              >\n                <!-- favorite spacer -->\n                @if (hasFavorites) {\n                  <ion-col size=\"auto\" class=\"favorite-col\"></ion-col>\n                }\n                <!-- attribute headers -->\n                @for (attr of displayAttributes; track attr; let i = $index) {\n                  <ion-col [size]=\"displayColumnSizes[i]\">\n                    <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n                  </ion-col>\n                }\n              </ion-row>\n\n              <!-- None option -->\n              @if (!required && !multiple && !clearable) {\n                <mat-option class=\"ion-no-padding\">\n                  <ion-row class=\"ion-no-padding\">\n                    <ion-col class=\"ion-no-padding\">\n                      <ion-label><i translate>COMMON.EMPTY_OPTION</i></ion-label>\n                    </ion-col>\n                  </ion-row>\n                </mat-option>\n              }\n              @if (_$filteredItems | push: 'userBlocking'; as items) {\n                <!-- No item option -->\n                @if (items | isEmptyArray) {\n                  <mat-option class=\"ion-padding text-italic\" disabled>\n                    <ion-label>\n                      <i>{{ noResultMessage | translate }}</i>\n                    </ion-label>\n                  </mat-option>\n                } @else {\n                  <!-- Options -->\n                  @for (item of items; track i; let i = $index) {\n                    @let isFavorite = hasFavorites && (favoriteItems | arrayIncludes: item);\n\n                    <mat-option [value]=\"item\" class=\"ion-no-padding\" [class.mdc-list-item--favorite]=\"isFavorite\">\n                      <ion-row [classList]=\"item.classList || ''\" [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\">\n                        <!-- favorite icon -->\n                        @if (hasFavorites) {\n                          <ion-col size=\"auto\" class=\"favorite-col\">\n                            @if (isFavorite) {\n                              <ion-icon name=\"star\" color=\"tertiary\"></ion-icon>\n                            }\n                          </ion-col>\n                        }\n\n                        <!-- attribute columns -->\n                        @for (path of displayAttributes; track j; let j = $index) {\n                          <ion-col [size]=\"displayColumnSizes[j]\" class=\"ion-align-self-center ion-text-wrap\">\n                            <ion-label\n                              [innerHTML]=\"\n                                item\n                                  | propertyGet: path\n                                  | highlight: { search: ionSearchbar?.value, withAccent: highlightAccent }\n                              \"\n                            ></ion-label>\n                          </ion-col>\n                        }\n                      </ion-row>\n                    </mat-option>\n                  }\n                }\n                <!-- More item -->\n                @if (_moreItemsCount) {\n                  <mat-option class=\"ion-padding\" (ngInit)=\"_initMatSelectInfiniteScroll()\" disabled>\n                    <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                  </mat-option>\n                }\n              } @else if ((_displayValue | strLength) < suggestLengthThreshold) {\n                <!-- need more character -->\n                <mat-option class=\"ion-padding text-italic\" disabled>\n                  <ion-label>\n                    {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n                  </ion-label>\n                </mat-option>\n              } @else {\n                <!-- loading spinner -->\n                <mat-option class=\"ion-padding\" disabled>\n                  <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                </mat-option>\n              }\n              <!-- footer -->\n              @if (itemCount; as count) {\n                <mat-option class=\"mat-option-footer mat-autocomplete-footer ion-no-padding\" disabled>\n                  <ion-text class=\"ion-float-end ion-padding-end\">\n                    <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                  </ion-text>\n                </mat-option>\n              }\n            </mat-select>\n          } @else {\n            <!-- desktop (use mat-autocomplete) -->\n            <input\n              matInput\n              #matInputText\n              type=\"text\"\n              [matAutocomplete]=\"autocomplete\"\n              [matAutocompletePosition]=\"matAutocompletePosition\"\n              [formControl]=\"formControl\"\n              [placeholder]=\"(label || floatLabel === 'never') && placeholder\"\n              [appAutofocus]=\"autofocus\"\n              [tabindex]=\"_tabindex\"\n              [required]=\"required\"\n              (click)=\"clicked.emit($event)\"\n              (focus)=\"filterInputTextFocusEvent($event)\"\n              (blur)=\"filterInputTextBlurEvent($event)\"\n              (keydown.escape)=\"keydownEscape.emit($event)\"\n              (keydown.backspace)=\"onBackspace($event)\"\n              (keyup.enter)=\"keyupEnter.emit($event)\"\n              (keyup.arrowDown)=\"!autocomplete.showPanel && dropButtonClick.emit($event)\"\n            />\n            <!-- autocomplete -->\n            <mat-autocomplete\n              #autocomplete=\"matAutocomplete\"\n              [autoActiveFirstOption]=\"true\"\n              [hideSingleSelectionIndicator]=\"true\"\n              [displayWith]=\"displayWith\"\n              [class]=\"panelClass\"\n              [panelWidth]=\"panelWidth\"\n              [disableRipple]=\"disableRipple\"\n              (optionSelected)=\"onOptionSelected($event)\"\n              (opened)=\"openedChange.emit(true)\"\n              (closed)=\"openedChange.emit(false)\"\n            >\n              <!-- Headers -->\n              <ion-row\n                class=\"mat-autocomplete-header column ion-no-padding\"\n                [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\"\n              >\n                <!-- favorite spacer -->\n                @if (hasFavorites) {\n                  <ion-col size=\"auto\" class=\"favorite-col\"></ion-col>\n                }\n                @for (attr of displayAttributes; track attr; let i = $index) {\n                  <ion-col [size]=\"displayColumnSizes[i]\">\n                    <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n                  </ion-col>\n                }\n              </ion-row>\n              @if (_$filteredItems | push: 'userBlocking'; as items) {\n                <!-- No item option -->\n                @if (items | isEmptyArray) {\n                  <mat-option class=\"ion-padding text-italic\" disabled>\n                    <ion-label>\n                      <i>{{ noResultMessage | translate }}</i>\n                    </ion-label>\n                  </mat-option>\n                } @else {\n                  <!-- Options -->\n                  @for (item of items; track i; let i = $index) {\n                    @let isFavorite = hasFavorites && (favoriteItems | arrayIncludes: item);\n                    <mat-option\n                      [value]=\"item\"\n                      class=\"ion-no-padding\"\n                      [class.mdc-list-item--selected]=\"item === _selectedItem\"\n                      [class.mdc-list-item--favorite]=\"isFavorite\"\n                    >\n                      <ion-row [classList]=\"item.classList || ''\" [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\">\n                        <!-- favorite icon -->\n                        @if (hasFavorites) {\n                          <ion-col\n                            matPrefix\n                            size=\"auto\"\n                            class=\"favorite-col\"\n                            (click)=\"toggleFavoriteClick($event, item)\"\n                          >\n                            @if (isFavorite) {\n                              <ion-icon name=\"star\" color=\"tertiary\"></ion-icon>\n                            } @else if (toggleFavorite.observed) {\n                              <ion-icon name=\"star-outline\" color=\"medium\" class=\"visible-hover\"></ion-icon>\n                            }\n                          </ion-col>\n                        }\n                        @for (path of displayAttributes; track j; let j = $index) {\n                          <ion-col\n                            [size]=\"displayColumnSizes[j]\"\n                            [title]=\"text.innerText\"\n                            class=\"ion-align-self-center\"\n                          >\n                            <ion-text>\n                              <span\n                                #text\n                                [innerHTML]=\"\n                                  item\n                                    | propertyGet: path\n                                    | highlight\n                                      : {\n                                          search: matInputText.value,\n                                          withAccent: highlightAccent,\n                                        }\n                                \"\n                              ></span>\n                            </ion-text>\n                          </ion-col>\n                        }\n                      </ion-row>\n                    </mat-option>\n                  }\n                }\n                <!-- More item -->\n                @if (_moreItemsCount) {\n                  <mat-option class=\"ion-padding\" (ngInit)=\"_initAutocompleteInfiniteScroll()\" disabled>\n                    <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                  </mat-option>\n                }\n              } @else if ((_displayValue | strLength) < suggestLengthThreshold) {\n                <!-- Need more characters -->\n                <mat-option class=\"ion-padding text-italic\" disabled>\n                  <ion-label>\n                    {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n                  </ion-label>\n                </mat-option>\n              } @else {\n                <!-- Loading spinner -->\n                <mat-option class=\"ion-padding\" disabled>\n                  <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                </mat-option>\n              }\n\n              <!-- footer -->\n              @if (itemCount; as count) {\n                <ion-row class=\"mat-autocomplete-footer ion-no-padding\">\n                  <ion-col>\n                    <ion-text class=\"ion-float-end ion-padding-end\">\n                      <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                    </ion-text>\n                  </ion-col>\n                </ion-row>\n              }\n            </mat-autocomplete>\n          }\n          <!--\n          NOTE :\n          - \"selectInputContent($event) || onFocus.emit($event)\" : call onFocus only when to the input is empty (nothing to select)\n          -->\n          <div matSuffix>\n            <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n          </div>\n          @if (formControl?.hasError('required')) {\n            <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n          }\n          @if (formControl?.hasError('entity')) {\n            <mat-error translate>ERROR.FIELD_INVALID</mat-error>\n          }\n          <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n          <!-- Hints -->\n          @if (!formControl?.invalid) {\n            <mat-hint>\n              <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n            </mat-hint>\n          }\n        </mat-form-field>\n      }\n    </ion-col>\n    <ion-col [size]=\"colSizes?.[1]\" class=\"ion-no-padding\">\n      <ng-content select=\"[matAfter]\"></ng-content>\n    </ion-col>\n  </ion-row>\n</ion-grid>\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n  @if (!mobile) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"toggleShowPanel($event)\"\n      [hidden]=\"disabled\"\n      [title]=\"dropButtonTitle || '' | translate\"\n    >\n      <mat-icon>{{ mobile ? 'arrow_drop_down' : 'keyboard_arrow_down' }}</mat-icon>\n    </button>\n  }\n  @if (clearable) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"clearValue($event)\"\n      [hidden]=\"disabled || !formControl.value\"\n      [title]=\"clearButtonTitle || '' | translate\"\n    >\n      <mat-icon>close</mat-icon>\n    </button>\n  }\n\n  <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #matErrorTemplate>\n  <ng-content select=\"mat-error,[matError]\"></ng-content>\n</ng-template>\n\n<ng-template #matHintTemplate>\n  <div class=\"mat-mdc-form-field-hint-wrapper\">\n    <ng-content select=\"mat-hint:not([align='end']),[matHint]\"></ng-content>\n    <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n    <ng-content select=\"mat-hint[align='end']\"></ng-content>\n  </div>\n</ng-template>\n", styles: [":host{display:inline-block;position:relative}:host.ion-text-wrap ion-label,:host.ion-text-wrap ion-text{white-space:normal!important}:host ::ng-deep .mat-mdc-select-arrow-hidden .mat-mdc-select-arrow-wrapper{display:none;visibility:hidden}ion-grid.field-container>ion-row>ion-col.ion-no-padding{--ion-padding-start: 0}ion-row{flex-wrap:nowrap}button[hidden]{display:none}mat-autocomplete mat-option{--mat-option-text-width: 100%}ion-col.favorite-col{flex:0 0 auto;width:24px!important}mat-option .visible-hover{opacity:0;display:none;animation:fadeinout 1s linear 1 backwards}mat-option:hover .visible-hover{display:inline-block;opacity:1}\n"], dependencies: [{ kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2$1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonRow, selector: "ion-row" }, { kind: "component", type: i2$1.IonSearchbar, selector: "ion-searchbar", inputs: ["animated", "autocapitalize", "autocomplete", "autocorrect", "cancelButtonIcon", "cancelButtonText", "clearIcon", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "maxlength", "minlength", "mode", "name", "placeholder", "searchIcon", "showCancelButton", "showClearButton", "spellcheck", "type", "value"] }, { kind: "component", type: i2$1.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i2$1.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar,ion-range" }, { kind: "directive", type: i1$3.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: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgInitDirective, selector: "[ngInit]", outputs: ["ngInit"] }, { kind: "directive", type: AutofocusDirective, selector: "[autofocus], input[appAutofocus]", inputs: ["appAutofocus", "autofocusDelay"] }, { kind: "component", type: i6$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i2.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "directive", type: i6$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i11$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i6$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i6$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: PropertyGetPipe, name: "propertyGet" }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: NotEmptyArrayPipe, name: "isNotEmptyArray" }, { kind: "pipe", type: EmptyArrayPipe, name: "isEmptyArray" }, { kind: "pipe", type: ArrayIncludesPipe, name: "arrayIncludes" }, { kind: "pipe", type: ToStringPipe, name: "toString" }, { kind: "pipe", type: StrLengthPipe, name: "strLength" }, { kind: "pipe", type: AsFloatLabelTypePipe, name: "asFloatLabelType" }, { kind: "pipe", type: i19.RxPush, name: "push" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: MatAutocompleteField, selector: "mat-autocomplete-field", inputs: { equals: "equals", logPrefix: "logPrefix", formControl: "formControl", formControlName: "formControlName", floatLabel: "floatLabel", label: "label", appearance: "appearance", subscriptSizing: "subscriptSizing", placeholder: "placeholder", suggestFn: "suggestFn", required: ["required", "required", booleanAttribute], hideRequiredMarker: ["hideRequiredMarker", "hideRequiredMarker", booleanAttribute], mobile: ["mobile", "mobile", booleanAttribute], clearable: ["clearable", "clearable", booleanAttribute], debounceTime: ["debounceTime", "debounceTime", numberAttribute], displaySeparator: "displaySeparator", displayWith: "displayWith", displayAttributes: "displayAttributes", displayColumnSizes: "displayColumnSizes", displayColumnNames: "displayColumnNames", highlightAccent: ["highlightAccent", "highlightAccent", booleanAttribute], showAllOnFocus: ["showAllOnFocus", "showAllOnFocus", booleanAttribute], showPanelOnFocus: ["showPanelOnFocus", "showPanelOnFocus", booleanAttribute], reloadItemsOnFocus: ["reloadItemsOnFocus", "reloadItemsOnFocus", booleanAttribute], clearInvalidValueOnBlur: ["clearInvalidValueOnBlur", "clearInvalidValueOnBlur", booleanAttribute], autofocus: ["autofocus", "autofocus", booleanAttribute], config: "config", i18nPrefix: "i18nPrefix", noResultMessage: "noResultMessage", panelClass: "panelClass", panelWidth: "panelWidth", disableRipple: ["disableRipple", "disableRipple", booleanAttribute], matAutocompletePosition: "matAutocompletePosition", multiple: ["multiple", "multiple", booleanAttribute], fetchMoreThreshold: "fetchMoreThreshold", suggestLengthThreshold: ["suggestLengthThreshold", "suggestLengthThreshold", numberAttribute], showLoadingSpinner: ["showLoadingSpinner", "showLoadingSpinner", booleanAttribute], debug: ["debug", "debug", booleanAttribute], showSearchBar: ["showSearchBar", "showSearchBar", booleanAttribute], stickySearchBar: ["stickySearchBar", "stickySearchBar", booleanAttribute], applyImplicitValue: "applyImplicitValue", dropButtonTitle: "dropButtonTitle", clearButtonTitle: "clearButtonTitle", trimSearchText: ["trimSearchText", "trimSearchText", booleanAttribute], splitSearchText: ["splitSearchText", "splitSearchText", booleanAttribute], selectInputContentOnFocus: ["selectInputContentOnFocus", "selectInputContentOnFocus", booleanAttribute], selectInputContentOnFocusDelay: ["selectInputContentOnFocusDelay", "selectInputContentOnFocusDelay", numberAttribute], previewImplicitValue: ["previewImplicitValue", "previewImplicitValue", booleanAttribute], showFavorites: "showFavorites", toggleFavoriteTitle: "toggleFavoriteTitle", favoriteItems: "favoriteItems", colSizes: "colSizes", classList: ["class", "classList"], filter: "filter", readonly: ["readonly", "readonly", booleanAttribute], tabindex: "tabindex", items: "items" }, outputs: { clicked: "click", blurred: "blur", focused: "focus", dropButtonClick: "dropButtonClick", keydownEscape: "keydown.escape", keydownBackspace: "keydown.backspace", keyupEnter: "keyup.enter", selectionChange: "selectionChange", openedChange: "openedChange", toggleFavorite: "toggleFavorite" }, providers: [DEFAULT_VALUE_ACCESSOR$4], viewQueries: [{ propertyName: "matSelect", first: true, predicate: ["matSelect"], descendants: true }, { propertyName: "ionSearchbar", first: true, predicate: ["ionSearchbar"], descendants: true }, { propertyName: "matInputText", first: true, predicate: ["matInputText"], descendants: true }, { propertyName: "autocomplete", first: true, predicate: MatAutocomplete, descendants: true }, { propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }], ngImport: i0, template: "<ion-grid class=\"ion-no-padding field-container\">\n  <ion-row>\n    <ion-col [size]=\"colSizes?.[0]\" class=\"ion-no-padding\">\n      <!-- readonly -->\n      @if (_readonly) {\n        <mat-form-field\n          [floatLabel]=\"floatLabel | asFloatLabelType\"\n          [appearance]=\"appearance\"\n          [subscriptSizing]=\"subscriptSizing\"\n          [title]=\"_displayValue || ''\"\n          class=\"mat-form-field-disabled\"\n        >\n          <div matPrefix>\n            <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n          </div>\n          @if (floatLabel !== 'never' && !!placeholder) {\n            <mat-label>{{ placeholder }}</mat-label>\n          }\n          <input matInput hidden type=\"text\" readonly=\"true\" [formControl]=\"formControl\" />\n          <ion-text>{{ value | toString: displayWith }}</ion-text>\n          <div matSuffix>\n            <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n          </div>\n          <!-- hints -->\n          @if (!formControl.invalid) {\n            <mat-hint>\n              <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n            </mat-hint>\n          }\n        </mat-form-field>\n      } @else {\n        @let hasFavorites = toggleFavorite.observed || (favoriteItems | isNotEmptyArray);\n\n        <mat-form-field\n          [floatLabel]=\"floatLabel | asFloatLabelType\"\n          [appearance]=\"appearance\"\n          [subscriptSizing]=\"subscriptSizing\"\n          [title]=\"_displayValue || ''\"\n          [hideRequiredMarker]=\"hideRequiredMarker\"\n        >\n          <div matPrefix>\n            <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n          </div>\n          @if ((label || placeholder) && floatLabel !== 'never') {\n            <mat-label>{{ label || placeholder }}</mat-label>\n          }\n          <!-- Mobile or Multiple (use <mat-select>) -->\n          @if (mobile || multiple) {\n            <mat-select\n              #matSelect\n              hideSingleSelectionIndicator\n              disableOptionCentering\n              [disableRipple]=\"disableRipple\"\n              [formControl]=\"formControl\"\n              [tabindex]=\"_tabindex\"\n              [panelClass]=\"panelClass\"\n              [panelWidth]=\"panelWidth || _defaultPanelWidth\"\n              (focus)=\"filterMatSelectFocusEvent($event)\"\n              (blur)=\"filterMatSelectBlurEvent($event)\"\n              (keydown.escape)=\"keydownEscape.emit($event)\"\n              (keyup.enter)=\"keyupEnter.emit($event)\"\n              (selectionChange)=\"onSelectionChange($event)\"\n              (openedChange)=\"openedChange.emit($event)\"\n              [compareWith]=\"equals\"\n              [multiple]=\"multiple\"\n              [typeaheadDebounceInterval]=\"debounceTime * 10\"\n              [required]=\"required\"\n              [class.mat-mdc-select-arrow-hidden]=\"!mobile\"\n            >\n              <mat-select-trigger>{{ value | toString: displayWith }}</mat-select-trigger>\n              <!-- Search bar -->\n              @if (showSearchBar) {\n                <mat-optgroup class=\"mat-select-searchbar\" [class.mat-select-searchbar-sticky]=\"stickySearchBar\">\n                  <!-- FIXME on iOS devices, when animated=\"true\", then the search icon overlap the placeholder -->\n                  <ion-searchbar\n                    #ionSearchbar\n                    inputmode=\"search\"\n                    autocomplete=\"off\"\n                    animated=\"false\"\n                    showClearButton=\"true\"\n                    [debounce]=\"debounceTime\"\n                    (ionClear)=\"markAsLoading()\"\n                    (ionInput)=\"ionSearchBarChanged($event)\"\n                    [placeholder]=\"'COMMON.BTN_SEARCH' | translate\"\n                  ></ion-searchbar>\n                </mat-optgroup>\n              }\n              <!-- Headers -->\n              <ion-row\n                class=\"mat-select-header column ion-no-padding\"\n                [class.multiple]=\"multiple\"\n                [class.mat-select-searchbar-sticky]=\"showSearchBar && stickySearchBar\"\n                [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\"\n              >\n                <!-- favorite spacer -->\n                @if (hasFavorites) {\n                  <ion-col size=\"auto\" class=\"favorite-col\"></ion-col>\n                }\n                <!-- attribute headers -->\n                @for (attr of displayAttributes; track attr; let i = $index) {\n                  <ion-col [size]=\"displayColumnSizes[i]\">\n                    <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n                  </ion-col>\n                }\n              </ion-row>\n\n              <!-- None option -->\n              @if (!required && !multiple && !clearable) {\n                <mat-option class=\"ion-no-padding\">\n                  <ion-row class=\"ion-no-padding\">\n                    <ion-col class=\"ion-no-padding\">\n                      <ion-label><i translate>COMMON.EMPTY_OPTION</i></ion-label>\n                    </ion-col>\n                  </ion-row>\n                </mat-option>\n              }\n              @if (_$filteredItems | push: 'userBlocking'; as items) {\n                <!-- No item option -->\n                @if (items | isEmptyArray) {\n                  <mat-option class=\"ion-padding text-italic\" disabled>\n                    <ion-label>\n                      <i>{{ noResultMessage | translate }}</i>\n                    </ion-label>\n                  </mat-option>\n                } @else {\n                  <!-- Options -->\n                  @for (item of items; track i; let i = $index) {\n                    @let isFavorite = hasFavorites && (favoriteItems | arrayIncludes: item);\n\n                    <mat-option [value]=\"item\" class=\"ion-no-padding\" [class.mdc-list-item--favorite]=\"isFavorite\">\n                      <ion-row [classList]=\"item?.classList || ''\" [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\">\n                        <!-- favorite icon -->\n                        @if (hasFavorites) {\n                          <ion-col size=\"auto\" class=\"favorite-col\">\n                            @if (isFavorite) {\n                              <ion-icon name=\"star\" color=\"tertiary\"></ion-icon>\n                            }\n                          </ion-col>\n                        }\n\n                        <!-- attribute columns -->\n                        @for (path of displayAttributes; track j; let j = $index) {\n                          <ion-col [size]=\"displayColumnSizes[j]\" class=\"ion-align-self-center ion-text-wrap\">\n                            <ion-label\n                              [innerHTML]=\"\n                                item\n                                  | propertyGet: path\n                                  | highlight: { search: ionSearchbar?.value, withAccent: highlightAccent }\n                              \"\n                            ></ion-label>\n                          </ion-col>\n                        }\n                      </ion-row>\n                    </mat-option>\n                  }\n                }\n                <!-- More item -->\n                @if (_moreItemsCount) {\n                  <mat-option class=\"ion-padding\" (ngInit)=\"_initMatSelectInfiniteScroll()\" disabled>\n                    <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                  </mat-option>\n                }\n              } @else if ((_displayValue | strLength) < suggestLengthThreshold) {\n                <!-- need more character -->\n                <mat-option class=\"ion-padding text-italic\" disabled>\n                  <ion-label>\n                    {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n                  </ion-label>\n                </mat-option>\n              } @else {\n                <!-- loading spinner -->\n                <mat-option class=\"ion-padding\" disabled>\n                  <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                </mat-option>\n              }\n              <!-- footer -->\n              @if (itemCount; as count) {\n                <mat-option class=\"mat-option-footer mat-autocomplete-footer ion-no-padding\" disabled>\n                  <ion-text class=\"ion-float-end ion-padding-end\">\n                    <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                  </ion-text>\n                </mat-option>\n              }\n            </mat-select>\n          } @else {\n            <!-- desktop (use mat-autocomplete) -->\n            <input\n              matInput\n              #matInputText\n              type=\"text\"\n              [matAutocomplete]=\"autocomplete\"\n              [matAutocompletePosition]=\"matAutocompletePosition\"\n              [formControl]=\"formControl\"\n              [placeholder]=\"(label || floatLabel === 'never') && placeholder\"\n              [appAutofocus]=\"autofocus\"\n              [tabindex]=\"_tabindex\"\n              [required]=\"required\"\n              (click)=\"clicked.emit($event)\"\n              (focus)=\"filterInputTextFocusEvent($event)\"\n              (blur)=\"filterInputTextBlurEvent($event)\"\n              (keydown.escape)=\"keydownEscape.emit($event)\"\n              (keydown.backspace)=\"onBackspace($event)\"\n              (keyup.enter)=\"keyupEnter.emit($event)\"\n              (keyup.arrowDown)=\"!autocomplete.showPanel && dropButtonClick.emit($event)\"\n            />\n            <!-- autocomplete -->\n            <mat-autocomplete\n              #autocomplete=\"matAutocomplete\"\n              [autoActiveFirstOption]=\"true\"\n              [hideSingleSelectionIndicator]=\"true\"\n              [displayWith]=\"displayWith\"\n              [class]=\"panelClass\"\n              [panelWidth]=\"panelWidth\"\n              [disableRipple]=\"disableRipple\"\n              (optionSelected)=\"onOptionSelected($event)\"\n              (opened)=\"openedChange.emit(true)\"\n              (closed)=\"openedChange.emit(false)\"\n            >\n              <!-- Headers -->\n              <ion-row\n                class=\"mat-autocomplete-header column ion-no-padding\"\n                [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\"\n              >\n                <!-- favorite spacer -->\n                @if (hasFavorites) {\n                  <ion-col size=\"auto\" class=\"favorite-col\"></ion-col>\n                }\n                @for (attr of displayAttributes; track attr; let i = $index) {\n                  <ion-col [size]=\"displayColumnSizes[i]\">\n                    <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n                  </ion-col>\n                }\n              </ion-row>\n              @if (_$filteredItems | push: 'userBlocking'; as items) {\n                <!-- No item option -->\n                @if (items | isEmptyArray) {\n                  <mat-option class=\"ion-padding text-italic\" disabled>\n                    <ion-label>\n                      <i>{{ noResultMessage | translate }}</i>\n                    </ion-label>\n                  </mat-option>\n                } @else {\n                  <!-- Options -->\n                  @for (item of items; track i; let i = $index) {\n                    @let isFavorite = hasFavorites && (favoriteItems | arrayIncludes: item);\n                    <mat-option\n                      [value]=\"item\"\n                      class=\"ion-no-padding\"\n                      [class.mdc-list-item--selected]=\"item === _selectedItem\"\n                      [class.mdc-list-item--favorite]=\"isFavorite\"\n                    >\n                      <ion-row [classList]=\"item?.classList || ''\" [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\">\n                        <!-- favorite icon -->\n                        @if (hasFavorites) {\n                          <ion-col\n                            matPrefix\n                            size=\"auto\"\n                            class=\"favorite-col\"\n                            (click)=\"toggleFavoriteClick($event, item)\"\n                          >\n                            @if (isFavorite) {\n                              <ion-icon name=\"star\" color=\"tertiary\"></ion-icon>\n                            } @else if (toggleFavorite.observed) {\n                              <ion-icon name=\"star-outline\" color=\"medium\" class=\"visible-hover\"></ion-icon>\n                            }\n                          </ion-col>\n                        }\n                        @for (path of displayAttributes; track j; let j = $index) {\n                          <ion-col\n                            [size]=\"displayColumnSizes[j]\"\n                            [title]=\"text.innerText\"\n                            class=\"ion-align-self-center\"\n                          >\n                            <ion-text>\n                              <span\n                                #text\n                                [innerHTML]=\"\n                                  item\n                                    | propertyGet: path\n                                    | highlight\n                                      : {\n                                          search: matInputText.value,\n                                          withAccent: highlightAccent,\n                                        }\n                                \"\n                              ></span>\n                            </ion-text>\n                          </ion-col>\n                        }\n                      </ion-row>\n                    </mat-option>\n                  }\n                }\n                <!-- More item -->\n                @if (_moreItemsCount) {\n                  <mat-option class=\"ion-padding\" (ngInit)=\"_initAutocompleteInfiniteScroll()\" disabled>\n                    <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                  </mat-option>\n                }\n              } @else if ((_displayValue | strLength) < suggestLengthThreshold) {\n                <!-- Need more characters -->\n                <mat-option class=\"ion-padding text-italic\" disabled>\n                  <ion-label>\n                    {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n                  </ion-label>\n                </mat-option>\n              } @else {\n                <!-- Loading spinner -->\n                <mat-option class=\"ion-padding\" disabled>\n                  <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                </mat-option>\n              }\n\n              <!-- footer -->\n              @if (itemCount; as count) {\n                <ion-row class=\"mat-autocomplete-footer ion-no-padding\">\n                  <ion-col>\n                    <ion-text class=\"ion-float-end ion-padding-end\">\n                      <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                    </ion-text>\n                  </ion-col>\n                </ion-row>\n              }\n            </mat-autocomplete>\n          }\n          <!--\n          NOTE :\n          - \"selectInputContent($event) || onFocus.emit($event)\" : call onFocus only when to the input is empty (nothing to select)\n          -->\n          <div matSuffix>\n            <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n          </div>\n          @if (formControl?.hasError('required')) {\n            <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n          }\n          @if (formControl?.hasError('entity')) {\n            <mat-error translate>ERROR.FIELD_INVALID</mat-error>\n          }\n          <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n          <!-- Hints -->\n          @if (!formControl?.invalid) {\n            <mat-hint>\n              <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n            </mat-hint>\n          }\n        </mat-form-field>\n      }\n    </ion-col>\n    <ion-col [size]=\"colSizes?.[1]\" class=\"ion-no-padding\">\n      <ng-content select=\"[matAfter]\"></ng-content>\n    </ion-col>\n  </ion-row>\n</ion-grid>\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n  @if (!mobile) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"toggleShowPanel($event)\"\n      [hidden]=\"disabled\"\n      [title]=\"dropButtonTitle || '' | translate\"\n    >\n      <mat-icon>{{ mobile ? 'arrow_drop_down' : 'keyboard_arrow_down' }}</mat-icon>\n    </button>\n  }\n  @if (clearable) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"clearValue($event)\"\n      [hidden]=\"disabled || !formControl.value\"\n      [title]=\"clearButtonTitle || '' | translate\"\n    >\n      <mat-icon>close</mat-icon>\n    </button>\n  }\n\n  <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #matErrorTemplate>\n  <ng-content select=\"mat-error,[matError]\"></ng-content>\n</ng-template>\n\n<ng-template #matHintTemplate>\n  <div class=\"mat-mdc-form-field-hint-wrapper\">\n    <ng-content select=\"mat-hint:not([align='end']),[matHint]\"></ng-content>\n    <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n    <ng-content select=\"mat-hint[align='end']\"></ng-content>\n  </div>\n</ng-template>\n", styles: [":host{display:inline-block;position:relative}:host.ion-text-wrap ion-label,:host.ion-text-wrap ion-text{white-space:normal!important}:host ::ng-deep .mat-mdc-select-arrow-hidden .mat-mdc-select-arrow-wrapper{display:none;visibility:hidden}ion-grid.field-container>ion-row>ion-col.ion-no-padding{--ion-padding-start: 0}ion-row{flex-wrap:nowrap}button[hidden]{display:none}mat-autocomplete mat-option{--mat-option-text-width: 100%}ion-col.favorite-col{flex:0 0 auto;width:24px!important}mat-option .visible-hover{opacity:0;display:none;animation:fadeinout 1s linear 1 backwards}mat-option:hover .visible-hover{display:inline-block;opacity:1}\n"], dependencies: [{ kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2$1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2$1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonRow, selector: "ion-row" }, { kind: "component", type: i2$1.IonSearchbar, selector: "ion-searchbar", inputs: ["animated", "autocapitalize", "autocomplete", "autocorrect", "cancelButtonIcon", "cancelButtonText", "clearIcon", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "maxlength", "minlength", "mode", "name", "placeholder", "searchIcon", "showCancelButton", "showClearButton", "spellcheck", "type", "value"] }, { kind: "component", type: i2$1.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i2$1.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar,ion-range" }, { kind: "directive", type: i1$3.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: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgInitDirective, selector: "[ngInit]", outputs: ["ngInit"] }, { kind: "directive", type: AutofocusDirective, selector: "[autofocus], input[appAutofocus]", inputs: ["appAutofocus", "autofocusDelay"] }, { kind: "component", type: i6$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i2.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "directive", type: i6$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i11$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i6$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i6$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: PropertyGetPipe, name: "propertyGet" }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: NotEmptyArrayPipe, name: "isNotEmptyArray" }, { kind: "pipe", type: EmptyArrayPipe, name: "isEmptyArray" }, { kind: "pipe", type: ArrayIncludesPipe, name: "arrayIncludes" }, { kind: "pipe", type: ToStringPipe, name: "toString" }, { kind: "pipe", type: StrLengthPipe, name: "strLength" }, { kind: "pipe", type: AsFloatLabelTypePipe, name: "asFloatLabelType" }, { kind: "pipe", type: i19.RxPush, name: "push" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MatAutocompleteField, decorators: [{
             type: Component,
-            args: [{ selector: 'mat-autocomplete-field', providers: [DEFAULT_VALUE_ACCESSOR$4], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-grid class=\"ion-no-padding field-container\">\n  <ion-row>\n    <ion-col [size]=\"colSizes?.[0]\" class=\"ion-no-padding\">\n      <!-- readonly -->\n      @if (_readonly) {\n        <mat-form-field\n          [floatLabel]=\"floatLabel | asFloatLabelType\"\n          [appearance]=\"appearance\"\n          [subscriptSizing]=\"subscriptSizing\"\n          [title]=\"_displayValue || ''\"\n          class=\"mat-form-field-disabled\"\n        >\n          <div matPrefix>\n            <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n          </div>\n          @if (floatLabel !== 'never' && !!placeholder) {\n            <mat-label>{{ placeholder }}</mat-label>\n          }\n          <input matInput hidden type=\"text\" readonly=\"true\" [formControl]=\"formControl\" />\n          <ion-text>{{ value | toString: displayWith }}</ion-text>\n          <div matSuffix>\n            <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n          </div>\n          <!-- hints -->\n          @if (!formControl.invalid) {\n            <mat-hint>\n              <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n            </mat-hint>\n          }\n        </mat-form-field>\n      } @else {\n        @let hasFavorites = toggleFavorite.observed || (favoriteItems | isNotEmptyArray);\n\n        <mat-form-field\n          [floatLabel]=\"floatLabel | asFloatLabelType\"\n          [appearance]=\"appearance\"\n          [subscriptSizing]=\"subscriptSizing\"\n          [title]=\"_displayValue || ''\"\n          [hideRequiredMarker]=\"hideRequiredMarker\"\n        >\n          <div matPrefix>\n            <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n          </div>\n          @if ((label || placeholder) && floatLabel !== 'never') {\n            <mat-label>{{ label || placeholder }}</mat-label>\n          }\n          <!-- Mobile or Multiple (use <mat-select>) -->\n          @if (mobile || multiple) {\n            <mat-select\n              #matSelect\n              hideSingleSelectionIndicator\n              disableOptionCentering\n              [disableRipple]=\"disableRipple\"\n              [formControl]=\"formControl\"\n              [tabindex]=\"_tabindex\"\n              [panelClass]=\"panelClass\"\n              [panelWidth]=\"panelWidth || _defaultPanelWidth\"\n              (focus)=\"filterMatSelectFocusEvent($event)\"\n              (blur)=\"filterMatSelectBlurEvent($event)\"\n              (keydown.escape)=\"keydownEscape.emit($event)\"\n              (keyup.enter)=\"keyupEnter.emit($event)\"\n              (selectionChange)=\"onSelectionChange($event)\"\n              (openedChange)=\"openedChange.emit($event)\"\n              [compareWith]=\"equals\"\n              [multiple]=\"multiple\"\n              [typeaheadDebounceInterval]=\"debounceTime * 10\"\n              [required]=\"required\"\n              [class.mat-mdc-select-arrow-hidden]=\"!mobile\"\n            >\n              <mat-select-trigger>{{ value | toString: displayWith }}</mat-select-trigger>\n              <!-- Search bar -->\n              @if (showSearchBar) {\n                <mat-optgroup class=\"mat-select-searchbar\" [class.mat-select-searchbar-sticky]=\"stickySearchBar\">\n                  <!-- FIXME on iOS devices, when animated=\"true\", then the search icon overlap the placeholder -->\n                  <ion-searchbar\n                    #ionSearchbar\n                    inputmode=\"search\"\n                    autocomplete=\"off\"\n                    animated=\"false\"\n                    showClearButton=\"true\"\n                    [debounce]=\"debounceTime\"\n                    (ionClear)=\"markAsLoading()\"\n                    (ionInput)=\"ionSearchBarChanged($event)\"\n                    [placeholder]=\"'COMMON.BTN_SEARCH' | translate\"\n                  ></ion-searchbar>\n                </mat-optgroup>\n              }\n              <!-- Headers -->\n              <ion-row\n                class=\"mat-select-header column ion-no-padding\"\n                [class.multiple]=\"multiple\"\n                [class.mat-select-searchbar-sticky]=\"showSearchBar && stickySearchBar\"\n                [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\"\n              >\n                <!-- favorite spacer -->\n                @if (hasFavorites) {\n                  <ion-col size=\"auto\" class=\"favorite-col\"></ion-col>\n                }\n                <!-- attribute headers -->\n                @for (attr of displayAttributes; track attr; let i = $index) {\n                  <ion-col [size]=\"displayColumnSizes[i]\">\n                    <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n                  </ion-col>\n                }\n              </ion-row>\n\n              <!-- None option -->\n              @if (!required && !multiple && !clearable) {\n                <mat-option class=\"ion-no-padding\">\n                  <ion-row class=\"ion-no-padding\">\n                    <ion-col class=\"ion-no-padding\">\n                      <ion-label><i translate>COMMON.EMPTY_OPTION</i></ion-label>\n                    </ion-col>\n                  </ion-row>\n                </mat-option>\n              }\n              @if (_$filteredItems | push: 'userBlocking'; as items) {\n                <!-- No item option -->\n                @if (items | isEmptyArray) {\n                  <mat-option class=\"ion-padding text-italic\" disabled>\n                    <ion-label>\n                      <i>{{ noResultMessage | translate }}</i>\n                    </ion-label>\n                  </mat-option>\n                } @else {\n                  <!-- Options -->\n                  @for (item of items; track i; let i = $index) {\n                    @let isFavorite = hasFavorites && (favoriteItems | arrayIncludes: item);\n\n                    <mat-option [value]=\"item\" class=\"ion-no-padding\" [class.mdc-list-item--favorite]=\"isFavorite\">\n                      <ion-row [classList]=\"item.classList || ''\" [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\">\n                        <!-- favorite icon -->\n                        @if (hasFavorites) {\n                          <ion-col size=\"auto\" class=\"favorite-col\">\n                            @if (isFavorite) {\n                              <ion-icon name=\"star\" color=\"tertiary\"></ion-icon>\n                            }\n                          </ion-col>\n                        }\n\n                        <!-- attribute columns -->\n                        @for (path of displayAttributes; track j; let j = $index) {\n                          <ion-col [size]=\"displayColumnSizes[j]\" class=\"ion-align-self-center ion-text-wrap\">\n                            <ion-label\n                              [innerHTML]=\"\n                                item\n                                  | propertyGet: path\n                                  | highlight: { search: ionSearchbar?.value, withAccent: highlightAccent }\n                              \"\n                            ></ion-label>\n                          </ion-col>\n                        }\n                      </ion-row>\n                    </mat-option>\n                  }\n                }\n                <!-- More item -->\n                @if (_moreItemsCount) {\n                  <mat-option class=\"ion-padding\" (ngInit)=\"_initMatSelectInfiniteScroll()\" disabled>\n                    <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                  </mat-option>\n                }\n              } @else if ((_displayValue | strLength) < suggestLengthThreshold) {\n                <!-- need more character -->\n                <mat-option class=\"ion-padding text-italic\" disabled>\n                  <ion-label>\n                    {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n                  </ion-label>\n                </mat-option>\n              } @else {\n                <!-- loading spinner -->\n                <mat-option class=\"ion-padding\" disabled>\n                  <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                </mat-option>\n              }\n              <!-- footer -->\n              @if (itemCount; as count) {\n                <mat-option class=\"mat-option-footer mat-autocomplete-footer ion-no-padding\" disabled>\n                  <ion-text class=\"ion-float-end ion-padding-end\">\n                    <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                  </ion-text>\n                </mat-option>\n              }\n            </mat-select>\n          } @else {\n            <!-- desktop (use mat-autocomplete) -->\n            <input\n              matInput\n              #matInputText\n              type=\"text\"\n              [matAutocomplete]=\"autocomplete\"\n              [matAutocompletePosition]=\"matAutocompletePosition\"\n              [formControl]=\"formControl\"\n              [placeholder]=\"(label || floatLabel === 'never') && placeholder\"\n              [appAutofocus]=\"autofocus\"\n              [tabindex]=\"_tabindex\"\n              [required]=\"required\"\n              (click)=\"clicked.emit($event)\"\n              (focus)=\"filterInputTextFocusEvent($event)\"\n              (blur)=\"filterInputTextBlurEvent($event)\"\n              (keydown.escape)=\"keydownEscape.emit($event)\"\n              (keydown.backspace)=\"onBackspace($event)\"\n              (keyup.enter)=\"keyupEnter.emit($event)\"\n              (keyup.arrowDown)=\"!autocomplete.showPanel && dropButtonClick.emit($event)\"\n            />\n            <!-- autocomplete -->\n            <mat-autocomplete\n              #autocomplete=\"matAutocomplete\"\n              [autoActiveFirstOption]=\"true\"\n              [hideSingleSelectionIndicator]=\"true\"\n              [displayWith]=\"displayWith\"\n              [class]=\"panelClass\"\n              [panelWidth]=\"panelWidth\"\n              [disableRipple]=\"disableRipple\"\n              (optionSelected)=\"onOptionSelected($event)\"\n              (opened)=\"openedChange.emit(true)\"\n              (closed)=\"openedChange.emit(false)\"\n            >\n              <!-- Headers -->\n              <ion-row\n                class=\"mat-autocomplete-header column ion-no-padding\"\n                [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\"\n              >\n                <!-- favorite spacer -->\n                @if (hasFavorites) {\n                  <ion-col size=\"auto\" class=\"favorite-col\"></ion-col>\n                }\n                @for (attr of displayAttributes; track attr; let i = $index) {\n                  <ion-col [size]=\"displayColumnSizes[i]\">\n                    <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n                  </ion-col>\n                }\n              </ion-row>\n              @if (_$filteredItems | push: 'userBlocking'; as items) {\n                <!-- No item option -->\n                @if (items | isEmptyArray) {\n                  <mat-option class=\"ion-padding text-italic\" disabled>\n                    <ion-label>\n                      <i>{{ noResultMessage | translate }}</i>\n                    </ion-label>\n                  </mat-option>\n                } @else {\n                  <!-- Options -->\n                  @for (item of items; track i; let i = $index) {\n                    @let isFavorite = hasFavorites && (favoriteItems | arrayIncludes: item);\n                    <mat-option\n                      [value]=\"item\"\n                      class=\"ion-no-padding\"\n                      [class.mdc-list-item--selected]=\"item === _selectedItem\"\n                      [class.mdc-list-item--favorite]=\"isFavorite\"\n                    >\n                      <ion-row [classList]=\"item.classList || ''\" [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\">\n                        <!-- favorite icon -->\n                        @if (hasFavorites) {\n                          <ion-col\n                            matPrefix\n                            size=\"auto\"\n                            class=\"favorite-col\"\n                            (click)=\"toggleFavoriteClick($event, item)\"\n                          >\n                            @if (isFavorite) {\n                              <ion-icon name=\"star\" color=\"tertiary\"></ion-icon>\n                            } @else if (toggleFavorite.observed) {\n                              <ion-icon name=\"star-outline\" color=\"medium\" class=\"visible-hover\"></ion-icon>\n                            }\n                          </ion-col>\n                        }\n                        @for (path of displayAttributes; track j; let j = $index) {\n                          <ion-col\n                            [size]=\"displayColumnSizes[j]\"\n                            [title]=\"text.innerText\"\n                            class=\"ion-align-self-center\"\n                          >\n                            <ion-text>\n                              <span\n                                #text\n                                [innerHTML]=\"\n                                  item\n                                    | propertyGet: path\n                                    | highlight\n                                      : {\n                                          search: matInputText.value,\n                                          withAccent: highlightAccent,\n                                        }\n                                \"\n                              ></span>\n                            </ion-text>\n                          </ion-col>\n                        }\n                      </ion-row>\n                    </mat-option>\n                  }\n                }\n                <!-- More item -->\n                @if (_moreItemsCount) {\n                  <mat-option class=\"ion-padding\" (ngInit)=\"_initAutocompleteInfiniteScroll()\" disabled>\n                    <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                  </mat-option>\n                }\n              } @else if ((_displayValue | strLength) < suggestLengthThreshold) {\n                <!-- Need more characters -->\n                <mat-option class=\"ion-padding text-italic\" disabled>\n                  <ion-label>\n                    {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n                  </ion-label>\n                </mat-option>\n              } @else {\n                <!-- Loading spinner -->\n                <mat-option class=\"ion-padding\" disabled>\n                  <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                </mat-option>\n              }\n\n              <!-- footer -->\n              @if (itemCount; as count) {\n                <ion-row class=\"mat-autocomplete-footer ion-no-padding\">\n                  <ion-col>\n                    <ion-text class=\"ion-float-end ion-padding-end\">\n                      <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                    </ion-text>\n                  </ion-col>\n                </ion-row>\n              }\n            </mat-autocomplete>\n          }\n          <!--\n          NOTE :\n          - \"selectInputContent($event) || onFocus.emit($event)\" : call onFocus only when to the input is empty (nothing to select)\n          -->\n          <div matSuffix>\n            <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n          </div>\n          @if (formControl?.hasError('required')) {\n            <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n          }\n          @if (formControl?.hasError('entity')) {\n            <mat-error translate>ERROR.FIELD_INVALID</mat-error>\n          }\n          <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n          <!-- Hints -->\n          @if (!formControl?.invalid) {\n            <mat-hint>\n              <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n            </mat-hint>\n          }\n        </mat-form-field>\n      }\n    </ion-col>\n    <ion-col [size]=\"colSizes?.[1]\" class=\"ion-no-padding\">\n      <ng-content select=\"[matAfter]\"></ng-content>\n    </ion-col>\n  </ion-row>\n</ion-grid>\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n  @if (!mobile) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"toggleShowPanel($event)\"\n      [hidden]=\"disabled\"\n      [title]=\"dropButtonTitle || '' | translate\"\n    >\n      <mat-icon>{{ mobile ? 'arrow_drop_down' : 'keyboard_arrow_down' }}</mat-icon>\n    </button>\n  }\n  @if (clearable) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"clearValue($event)\"\n      [hidden]=\"disabled || !formControl.value\"\n      [title]=\"clearButtonTitle || '' | translate\"\n    >\n      <mat-icon>close</mat-icon>\n    </button>\n  }\n\n  <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #matErrorTemplate>\n  <ng-content select=\"mat-error,[matError]\"></ng-content>\n</ng-template>\n\n<ng-template #matHintTemplate>\n  <div class=\"mat-mdc-form-field-hint-wrapper\">\n    <ng-content select=\"mat-hint:not([align='end']),[matHint]\"></ng-content>\n    <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n    <ng-content select=\"mat-hint[align='end']\"></ng-content>\n  </div>\n</ng-template>\n", styles: [":host{display:inline-block;position:relative}:host.ion-text-wrap ion-label,:host.ion-text-wrap ion-text{white-space:normal!important}:host ::ng-deep .mat-mdc-select-arrow-hidden .mat-mdc-select-arrow-wrapper{display:none;visibility:hidden}ion-grid.field-container>ion-row>ion-col.ion-no-padding{--ion-padding-start: 0}ion-row{flex-wrap:nowrap}button[hidden]{display:none}mat-autocomplete mat-option{--mat-option-text-width: 100%}ion-col.favorite-col{flex:0 0 auto;width:24px!important}mat-option .visible-hover{opacity:0;display:none;animation:fadeinout 1s linear 1 backwards}mat-option:hover .visible-hover{display:inline-block;opacity:1}\n"] }]
+            args: [{ selector: 'mat-autocomplete-field', providers: [DEFAULT_VALUE_ACCESSOR$4], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-grid class=\"ion-no-padding field-container\">\n  <ion-row>\n    <ion-col [size]=\"colSizes?.[0]\" class=\"ion-no-padding\">\n      <!-- readonly -->\n      @if (_readonly) {\n        <mat-form-field\n          [floatLabel]=\"floatLabel | asFloatLabelType\"\n          [appearance]=\"appearance\"\n          [subscriptSizing]=\"subscriptSizing\"\n          [title]=\"_displayValue || ''\"\n          class=\"mat-form-field-disabled\"\n        >\n          <div matPrefix>\n            <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n          </div>\n          @if (floatLabel !== 'never' && !!placeholder) {\n            <mat-label>{{ placeholder }}</mat-label>\n          }\n          <input matInput hidden type=\"text\" readonly=\"true\" [formControl]=\"formControl\" />\n          <ion-text>{{ value | toString: displayWith }}</ion-text>\n          <div matSuffix>\n            <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n          </div>\n          <!-- hints -->\n          @if (!formControl.invalid) {\n            <mat-hint>\n              <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n            </mat-hint>\n          }\n        </mat-form-field>\n      } @else {\n        @let hasFavorites = toggleFavorite.observed || (favoriteItems | isNotEmptyArray);\n\n        <mat-form-field\n          [floatLabel]=\"floatLabel | asFloatLabelType\"\n          [appearance]=\"appearance\"\n          [subscriptSizing]=\"subscriptSizing\"\n          [title]=\"_displayValue || ''\"\n          [hideRequiredMarker]=\"hideRequiredMarker\"\n        >\n          <div matPrefix>\n            <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n          </div>\n          @if ((label || placeholder) && floatLabel !== 'never') {\n            <mat-label>{{ label || placeholder }}</mat-label>\n          }\n          <!-- Mobile or Multiple (use <mat-select>) -->\n          @if (mobile || multiple) {\n            <mat-select\n              #matSelect\n              hideSingleSelectionIndicator\n              disableOptionCentering\n              [disableRipple]=\"disableRipple\"\n              [formControl]=\"formControl\"\n              [tabindex]=\"_tabindex\"\n              [panelClass]=\"panelClass\"\n              [panelWidth]=\"panelWidth || _defaultPanelWidth\"\n              (focus)=\"filterMatSelectFocusEvent($event)\"\n              (blur)=\"filterMatSelectBlurEvent($event)\"\n              (keydown.escape)=\"keydownEscape.emit($event)\"\n              (keyup.enter)=\"keyupEnter.emit($event)\"\n              (selectionChange)=\"onSelectionChange($event)\"\n              (openedChange)=\"openedChange.emit($event)\"\n              [compareWith]=\"equals\"\n              [multiple]=\"multiple\"\n              [typeaheadDebounceInterval]=\"debounceTime * 10\"\n              [required]=\"required\"\n              [class.mat-mdc-select-arrow-hidden]=\"!mobile\"\n            >\n              <mat-select-trigger>{{ value | toString: displayWith }}</mat-select-trigger>\n              <!-- Search bar -->\n              @if (showSearchBar) {\n                <mat-optgroup class=\"mat-select-searchbar\" [class.mat-select-searchbar-sticky]=\"stickySearchBar\">\n                  <!-- FIXME on iOS devices, when animated=\"true\", then the search icon overlap the placeholder -->\n                  <ion-searchbar\n                    #ionSearchbar\n                    inputmode=\"search\"\n                    autocomplete=\"off\"\n                    animated=\"false\"\n                    showClearButton=\"true\"\n                    [debounce]=\"debounceTime\"\n                    (ionClear)=\"markAsLoading()\"\n                    (ionInput)=\"ionSearchBarChanged($event)\"\n                    [placeholder]=\"'COMMON.BTN_SEARCH' | translate\"\n                  ></ion-searchbar>\n                </mat-optgroup>\n              }\n              <!-- Headers -->\n              <ion-row\n                class=\"mat-select-header column ion-no-padding\"\n                [class.multiple]=\"multiple\"\n                [class.mat-select-searchbar-sticky]=\"showSearchBar && stickySearchBar\"\n                [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\"\n              >\n                <!-- favorite spacer -->\n                @if (hasFavorites) {\n                  <ion-col size=\"auto\" class=\"favorite-col\"></ion-col>\n                }\n                <!-- attribute headers -->\n                @for (attr of displayAttributes; track attr; let i = $index) {\n                  <ion-col [size]=\"displayColumnSizes[i]\">\n                    <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n                  </ion-col>\n                }\n              </ion-row>\n\n              <!-- None option -->\n              @if (!required && !multiple && !clearable) {\n                <mat-option class=\"ion-no-padding\">\n                  <ion-row class=\"ion-no-padding\">\n                    <ion-col class=\"ion-no-padding\">\n                      <ion-label><i translate>COMMON.EMPTY_OPTION</i></ion-label>\n                    </ion-col>\n                  </ion-row>\n                </mat-option>\n              }\n              @if (_$filteredItems | push: 'userBlocking'; as items) {\n                <!-- No item option -->\n                @if (items | isEmptyArray) {\n                  <mat-option class=\"ion-padding text-italic\" disabled>\n                    <ion-label>\n                      <i>{{ noResultMessage | translate }}</i>\n                    </ion-label>\n                  </mat-option>\n                } @else {\n                  <!-- Options -->\n                  @for (item of items; track i; let i = $index) {\n                    @let isFavorite = hasFavorites && (favoriteItems | arrayIncludes: item);\n\n                    <mat-option [value]=\"item\" class=\"ion-no-padding\" [class.mdc-list-item--favorite]=\"isFavorite\">\n                      <ion-row [classList]=\"item?.classList || ''\" [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\">\n                        <!-- favorite icon -->\n                        @if (hasFavorites) {\n                          <ion-col size=\"auto\" class=\"favorite-col\">\n                            @if (isFavorite) {\n                              <ion-icon name=\"star\" color=\"tertiary\"></ion-icon>\n                            }\n                          </ion-col>\n                        }\n\n                        <!-- attribute columns -->\n                        @for (path of displayAttributes; track j; let j = $index) {\n                          <ion-col [size]=\"displayColumnSizes[j]\" class=\"ion-align-self-center ion-text-wrap\">\n                            <ion-label\n                              [innerHTML]=\"\n                                item\n                                  | propertyGet: path\n                                  | highlight: { search: ionSearchbar?.value, withAccent: highlightAccent }\n                              \"\n                            ></ion-label>\n                          </ion-col>\n                        }\n                      </ion-row>\n                    </mat-option>\n                  }\n                }\n                <!-- More item -->\n                @if (_moreItemsCount) {\n                  <mat-option class=\"ion-padding\" (ngInit)=\"_initMatSelectInfiniteScroll()\" disabled>\n                    <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                  </mat-option>\n                }\n              } @else if ((_displayValue | strLength) < suggestLengthThreshold) {\n                <!-- need more character -->\n                <mat-option class=\"ion-padding text-italic\" disabled>\n                  <ion-label>\n                    {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n                  </ion-label>\n                </mat-option>\n              } @else {\n                <!-- loading spinner -->\n                <mat-option class=\"ion-padding\" disabled>\n                  <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                </mat-option>\n              }\n              <!-- footer -->\n              @if (itemCount; as count) {\n                <mat-option class=\"mat-option-footer mat-autocomplete-footer ion-no-padding\" disabled>\n                  <ion-text class=\"ion-float-end ion-padding-end\">\n                    <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                  </ion-text>\n                </mat-option>\n              }\n            </mat-select>\n          } @else {\n            <!-- desktop (use mat-autocomplete) -->\n            <input\n              matInput\n              #matInputText\n              type=\"text\"\n              [matAutocomplete]=\"autocomplete\"\n              [matAutocompletePosition]=\"matAutocompletePosition\"\n              [formControl]=\"formControl\"\n              [placeholder]=\"(label || floatLabel === 'never') && placeholder\"\n              [appAutofocus]=\"autofocus\"\n              [tabindex]=\"_tabindex\"\n              [required]=\"required\"\n              (click)=\"clicked.emit($event)\"\n              (focus)=\"filterInputTextFocusEvent($event)\"\n              (blur)=\"filterInputTextBlurEvent($event)\"\n              (keydown.escape)=\"keydownEscape.emit($event)\"\n              (keydown.backspace)=\"onBackspace($event)\"\n              (keyup.enter)=\"keyupEnter.emit($event)\"\n              (keyup.arrowDown)=\"!autocomplete.showPanel && dropButtonClick.emit($event)\"\n            />\n            <!-- autocomplete -->\n            <mat-autocomplete\n              #autocomplete=\"matAutocomplete\"\n              [autoActiveFirstOption]=\"true\"\n              [hideSingleSelectionIndicator]=\"true\"\n              [displayWith]=\"displayWith\"\n              [class]=\"panelClass\"\n              [panelWidth]=\"panelWidth\"\n              [disableRipple]=\"disableRipple\"\n              (optionSelected)=\"onOptionSelected($event)\"\n              (opened)=\"openedChange.emit(true)\"\n              (closed)=\"openedChange.emit(false)\"\n            >\n              <!-- Headers -->\n              <ion-row\n                class=\"mat-autocomplete-header column ion-no-padding\"\n                [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\"\n              >\n                <!-- favorite spacer -->\n                @if (hasFavorites) {\n                  <ion-col size=\"auto\" class=\"favorite-col\"></ion-col>\n                }\n                @for (attr of displayAttributes; track attr; let i = $index) {\n                  <ion-col [size]=\"displayColumnSizes[i]\">\n                    <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n                  </ion-col>\n                }\n              </ion-row>\n              @if (_$filteredItems | push: 'userBlocking'; as items) {\n                <!-- No item option -->\n                @if (items | isEmptyArray) {\n                  <mat-option class=\"ion-padding text-italic\" disabled>\n                    <ion-label>\n                      <i>{{ noResultMessage | translate }}</i>\n                    </ion-label>\n                  </mat-option>\n                } @else {\n                  <!-- Options -->\n                  @for (item of items; track i; let i = $index) {\n                    @let isFavorite = hasFavorites && (favoriteItems | arrayIncludes: item);\n                    <mat-option\n                      [value]=\"item\"\n                      class=\"ion-no-padding\"\n                      [class.mdc-list-item--selected]=\"item === _selectedItem\"\n                      [class.mdc-list-item--favorite]=\"isFavorite\"\n                    >\n                      <ion-row [classList]=\"item?.classList || ''\" [style.--ion-grid-columns]=\"hasFavorites ? 13 : 12\">\n                        <!-- favorite icon -->\n                        @if (hasFavorites) {\n                          <ion-col\n                            matPrefix\n                            size=\"auto\"\n                            class=\"favorite-col\"\n                            (click)=\"toggleFavoriteClick($event, item)\"\n                          >\n                            @if (isFavorite) {\n                              <ion-icon name=\"star\" color=\"tertiary\"></ion-icon>\n                            } @else if (toggleFavorite.observed) {\n                              <ion-icon name=\"star-outline\" color=\"medium\" class=\"visible-hover\"></ion-icon>\n                            }\n                          </ion-col>\n                        }\n                        @for (path of displayAttributes; track j; let j = $index) {\n                          <ion-col\n                            [size]=\"displayColumnSizes[j]\"\n                            [title]=\"text.innerText\"\n                            class=\"ion-align-self-center\"\n                          >\n                            <ion-text>\n                              <span\n                                #text\n                                [innerHTML]=\"\n                                  item\n                                    | propertyGet: path\n                                    | highlight\n                                      : {\n                                          search: matInputText.value,\n                                          withAccent: highlightAccent,\n                                        }\n                                \"\n                              ></span>\n                            </ion-text>\n                          </ion-col>\n                        }\n                      </ion-row>\n                    </mat-option>\n                  }\n                }\n                <!-- More item -->\n                @if (_moreItemsCount) {\n                  <mat-option class=\"ion-padding\" (ngInit)=\"_initAutocompleteInfiniteScroll()\" disabled>\n                    <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                  </mat-option>\n                }\n              } @else if ((_displayValue | strLength) < suggestLengthThreshold) {\n                <!-- Need more characters -->\n                <mat-option class=\"ion-padding text-italic\" disabled>\n                  <ion-label>\n                    {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n                  </ion-label>\n                </mat-option>\n              } @else {\n                <!-- Loading spinner -->\n                <mat-option class=\"ion-padding\" disabled>\n                  <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n                </mat-option>\n              }\n\n              <!-- footer -->\n              @if (itemCount; as count) {\n                <ion-row class=\"mat-autocomplete-footer ion-no-padding\">\n                  <ion-col>\n                    <ion-text class=\"ion-float-end ion-padding-end\">\n                      <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                    </ion-text>\n                  </ion-col>\n                </ion-row>\n              }\n            </mat-autocomplete>\n          }\n          <!--\n          NOTE :\n          - \"selectInputContent($event) || onFocus.emit($event)\" : call onFocus only when to the input is empty (nothing to select)\n          -->\n          <div matSuffix>\n            <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n          </div>\n          @if (formControl?.hasError('required')) {\n            <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n          }\n          @if (formControl?.hasError('entity')) {\n            <mat-error translate>ERROR.FIELD_INVALID</mat-error>\n          }\n          <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n          <!-- Hints -->\n          @if (!formControl?.invalid) {\n            <mat-hint>\n              <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n            </mat-hint>\n          }\n        </mat-form-field>\n      }\n    </ion-col>\n    <ion-col [size]=\"colSizes?.[1]\" class=\"ion-no-padding\">\n      <ng-content select=\"[matAfter]\"></ng-content>\n    </ion-col>\n  </ion-row>\n</ion-grid>\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n  @if (!mobile) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"toggleShowPanel($event)\"\n      [hidden]=\"disabled\"\n      [title]=\"dropButtonTitle || '' | translate\"\n    >\n      <mat-icon>{{ mobile ? 'arrow_drop_down' : 'keyboard_arrow_down' }}</mat-icon>\n    </button>\n  }\n  @if (clearable) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"clearValue($event)\"\n      [hidden]=\"disabled || !formControl.value\"\n      [title]=\"clearButtonTitle || '' | translate\"\n    >\n      <mat-icon>close</mat-icon>\n    </button>\n  }\n\n  <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #matErrorTemplate>\n  <ng-content select=\"mat-error,[matError]\"></ng-content>\n</ng-template>\n\n<ng-template #matHintTemplate>\n  <div class=\"mat-mdc-form-field-hint-wrapper\">\n    <ng-content select=\"mat-hint:not([align='end']),[matHint]\"></ng-content>\n    <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n    <ng-content select=\"mat-hint[align='end']\"></ng-content>\n  </div>\n</ng-template>\n", styles: [":host{display:inline-block;position:relative}:host.ion-text-wrap ion-label,:host.ion-text-wrap ion-text{white-space:normal!important}:host ::ng-deep .mat-mdc-select-arrow-hidden .mat-mdc-select-arrow-wrapper{display:none;visibility:hidden}ion-grid.field-container>ion-row>ion-col.ion-no-padding{--ion-padding-start: 0}ion-row{flex-wrap:nowrap}button[hidden]{display:none}mat-autocomplete mat-option{--mat-option-text-width: 100%}ion-col.favorite-col{flex:0 0 auto;width:24px!important}mat-option .visible-hover{opacity:0;display:none;animation:fadeinout 1s linear 1 backwards}mat-option:hover .visible-hover{display:inline-block;opacity:1}\n"] }]
         }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i2$1.ModalController }, { type: i0.Renderer2 }, { type: i1$3.FormGroupDirective, decorators: [{
                     type: Optional
                 }] }], propDecorators: { equals: [{
@@ -13046,7 +13046,7 @@ class MatChipsField {
                 multi: true,
                 useExisting: forwardRef(() => MatChipsField),
             },
-        ], viewQueries: [{ propertyName: "matInputText", first: true, predicate: ["matInputText"], descendants: true }, { propertyName: "autocomplete", first: true, predicate: MatAutocomplete, descendants: true }, { propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }], ngImport: i0, template: "<ion-grid class=\"ion-no-padding\">\n  <ion-row>\n    <ion-col [size]=\"colSizes?.[0]\" class=\"ion-no-padding\">\n      <mat-form-field\n        [floatLabel]=\"floatLabel | asFloatLabelType\"\n        [appearance]=\"appearance\"\n        [subscriptSizing]=\"'dynamic'\"\n        [hideRequiredMarker]=\"hideRequiredMarker\"\n        [class.mat-form-field-disabled]=\"formControl.disabled\"\n        [class.mat-form-field-invalid]=\"formControl.touched && formControl.invalid\"\n        class=\"material-chips\"\n      >\n        <div matPrefix>\n          <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n        </div>\n        @if (floatLabel !== 'never' && !!placeholder) {\n          <mat-label>{{ placeholder }}</mat-label>\n        }\n\n        <mat-chip-grid\n          #chipList\n          (focus)=\"filterChipsFocusEvent($event)\"\n          [disabled]=\"!readonly && disabled\"\n          [required]=\"required\"\n          [errorStateMatcher]=\"_errorStateMatcher\"\n        >\n          @for (item of value; track item) {\n            <mat-chip-row\n              class=\"ion-no-margin\"\n              [removable]=\"!disabled\"\n              (removed)=\"remove(item)\"\n              [color]=\"chipColor\"\n              [highlighted]=\"true\"\n            >\n              {{ item | toString: displayWith }}\n              @if (enabled) {\n                <mat-icon matChipRemove>cancel</mat-icon>\n              }\n            </mat-chip-row>\n          }\n          <input\n            #matInputText\n            type=\"text\"\n            [matAutocomplete]=\"autocomplete\"\n            [matAutocompletePosition]=\"matAutocompletePosition\"\n            [formControl]=\"_inputControl\"\n            [placeholder]=\"floatLabel === 'never' ? placeholder : null\"\n            [appAutofocus]=\"autofocus\"\n            [tabindex]=\"_tabindex\"\n            [readonly]=\"readonly\"\n            [hidden]=\"disabled\"\n            (click)=\"clicked.emit($event)\"\n            (focus)=\"filterInputTextFocusEvent($event)\"\n            (blur)=\"filterInputTextBlurEvent($event)\"\n            (keydown.escape)=\"keydownEscape.emit($event)\"\n            (keyup.enter)=\"keyupEnter.emit($event)\"\n            (keyup.arrowDown)=\"!autocomplete.showPanel && dropButtonClick.emit($event)\"\n            [matChipInputFor]=\"chipList\"\n            [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n          />\n        </mat-chip-grid>\n\n        <!-- autocomplete -->\n        <mat-autocomplete\n          #autocomplete=\"matAutocomplete\"\n          [autoActiveFirstOption]=\"true\"\n          [hideSingleSelectionIndicator]=\"true\"\n          [displayWith]=\"displayWith\"\n          [class]=\"panelClass\"\n          [panelWidth]=\"panelWidth\"\n          [disableRipple]=\"disableRipple\"\n          (optionSelected)=\"add($event.option.value)\"\n        >\n          <!-- Headers -->\n          <ion-row class=\"mat-autocomplete-header column ion-no-padding\">\n            @for (attr of displayAttributes; track attr; let i = $index) {\n              <ion-col [size]=\"displayColumnSizes[i]\">\n                <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n              </ion-col>\n            }\n          </ion-row>\n\n          @if (_$filteredItems | push: 'userBlocking'; as items) {\n            <!-- No item option -->\n            @if (items | isEmptyArray) {\n              <mat-option class=\"ion-padding text-italic\" disabled>\n                <ion-label>\n                  <i>{{ noResultMessage | translate }}</i>\n                </ion-label>\n              </mat-option>\n            }\n\n            <!-- Options -->\n            @for (item of items; track $index) {\n              <mat-option [value]=\"item\" class=\"ion-no-padding\">\n                <ion-row [classList]=\"item.classList || ''\">\n                  @for (path of displayAttributes; track path; let i = $index) {\n                    <ion-col [size]=\"displayColumnSizes[i]\" [title]=\"text.innerText\" class=\"ion-align-self-center\">\n                      <ion-text>\n                        <span\n                          #text\n                          [innerHTML]=\"\n                            item\n                              | propertyGet: path\n                              | highlight: { search: matInputText.value, withAccent: highlightAccent }\n                          \"\n                        ></span>\n                      </ion-text>\n                    </ion-col>\n                  }\n                </ion-row>\n              </mat-option>\n            }\n            <!-- More item -->\n            @if (_moreItemsCount) {\n              <mat-option (ngInit)=\"_initAutocompleteInfiniteScroll()\" class=\"ion-padding\" disabled>\n                <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n              </mat-option>\n            }\n          } @else if ((matInputText.value | strLength) < suggestLengthThreshold) {\n            <!-- Need more characters -->\n            <mat-option class=\"ion-padding text-italic\" disabled>\n              <ion-label>\n                {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n              </ion-label>\n            </mat-option>\n          } @else {\n            <!-- Loading spinner -->\n            <mat-option class=\"ion-padding\" disabled>\n              <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n            </mat-option>\n          }\n\n          <!-- footer -->\n          @if (itemCount; as count) {\n            <ion-row class=\"mat-autocomplete-footer ion-no-padding\">\n              <ion-col>\n                <ion-text class=\"ion-float-end ion-padding-end\">\n                  <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                </ion-text>\n              </ion-col>\n            </ion-row>\n          }\n        </mat-autocomplete>\n\n        <div matSuffix class=\"mat-form-field-suffix-bottom\">\n          <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n        </div>\n\n        <!-- Hints -->\n        @if (!formControl?.invalid) {\n          <mat-hint>\n            <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n          </mat-hint>\n        }\n      </mat-form-field>\n\n      <!-- Do the same as MatFormField since angular 15 (see component source)-->\n      <div\n        class=\"mat-mdc-form-field-subscript-wrapper\"\n        [class.mat-mdc-form-field-bottom-align]=\"subscriptSizing === 'fixed'\"\n        [class.mat-mdc-form-field-subscript-dynamic-size]=\"subscriptSizing === 'dynamic'\"\n      >\n        @if (formControl.touched && formControl.errors; as errors) {\n          <!-- errors -->\n          <div class=\"mat-mdc-form-field-error-wrapper\">\n            @if (errors | mapKeys | arrayFirst; as errorKey) {\n              @switch (errorKey) {\n                @case ('required') {\n                  <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n                }\n                @case ('entity') {\n                  <mat-error translate>ERROR.FIELD_INVALID</mat-error>\n                }\n                @default {\n                  <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n                }\n              }\n            }\n          </div>\n        }\n      </div>\n    </ion-col>\n    <ion-col [size]=\"colSizes?.[1]\" class=\"ion-no-padding\">\n      <ng-content select=\"[matAfter]\"></ng-content>\n    </ion-col>\n  </ion-row>\n</ion-grid>\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n  <button\n    matSuffix\n    mat-icon-button\n    tabindex=\"-1\"\n    type=\"button\"\n    (click)=\"toggleShowPanel($event)\"\n    [class.hidden]=\"disabled\"\n    [title]=\"dropButtonTitle || '' | translate\"\n  >\n    <mat-icon>{{ mobile ? 'arrow_drop_down' : 'keyboard_arrow_down' }}</mat-icon>\n  </button>\n  @if (clearable) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"clearValue($event)\"\n      [class.hidden]=\"disabled || !formControl.value\"\n      [title]=\"clearButtonTitle || '' | translate\"\n    >\n      <mat-icon>close</mat-icon>\n    </button>\n  }\n\n  <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #matErrorTemplate>\n  <ng-content select=\"mat-error,[matError]\"></ng-content>\n</ng-template>\n\n<ng-template #matHintTemplate>\n  <div class=\"mat-mdc-form-field-hint-wrapper\">\n    <ng-content select=\"mat-hint:not([align='end']),[matHint]\"></ng-content>\n    <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n    <ng-content select=\"mat-hint[align='end']\"></ng-content>\n  </div>\n</ng-template>\n", styles: [":host{width:100%;display:inline-block;position:relative}:host.ion-text-wrap ion-label{white-space:normal!important}button.hidden{display:none;visibility:hidden}.mat-mdc-chip.mat-mdc-standard-chip{--mdc-chip-container-height: 23px;margin:1px 0 0 8px!important;min-height:calc(31px - .5em)}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action{padding:0 2px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action{padding-right:4px;padding-left:4px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action mat-icon{color:inherit}.mat-mdc-chip.mat-mdc-standard-chip.mat-primary{background-color:var(--ion-color-primary);color:var(--ion-color-primary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-secondary{background-color:var(--ion-color-secondary);color:var(--ion-color-secondary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-tertiary{background-color:var(--ion-color-tertiary);color:var(--ion-color-tertiary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-accent{background-color:var(--ion-color-accent);color:var(--ion-color-accent-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-warning{background-color:var(--ion-color-warning);color:var(--ion-color-warning-contrast)}mat-form-field.mat-form-field-invalid ::ng-deep .mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mdc-filled-text-field-error-label-text-color, var(--mat-app-error))}mat-form-field.mat-form-field-invalid ::ng-deep .mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple:after{color:var(--mdc-filled-text-field-error-label-text-color, var(--mat-app-error))}\n"], dependencies: [{ kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2$1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonRow, selector: "ion-row" }, { kind: "component", type: i2$1.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i1$3.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: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgInitDirective, selector: "[ngInit]", outputs: ["ngInit"] }, { kind: "directive", type: AutofocusDirective, selector: "[autofocus], input[appAutofocus]", inputs: ["appAutofocus", "autofocusDelay"] }, { kind: "component", type: i6$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i6$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i11$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i11$2.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i11$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i11$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i11$2.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: PropertyGetPipe, name: "propertyGet" }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: EmptyArrayPipe, name: "isEmptyArray" }, { kind: "pipe", type: ArrayFirstPipe, name: "arrayFirst" }, { kind: "pipe", type: MapKeysPipe, name: "mapKeys" }, { kind: "pipe", type: ToStringPipe, name: "toString" }, { kind: "pipe", type: StrLengthPipe, name: "strLength" }, { kind: "pipe", type: AsFloatLabelTypePipe, name: "asFloatLabelType" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i19.RxPush, name: "push" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], viewQueries: [{ propertyName: "matInputText", first: true, predicate: ["matInputText"], descendants: true }, { propertyName: "autocomplete", first: true, predicate: MatAutocomplete, descendants: true }, { propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }], ngImport: i0, template: "<ion-grid class=\"ion-no-padding\">\n  <ion-row>\n    <ion-col [size]=\"colSizes?.[0]\" class=\"ion-no-padding\">\n      <mat-form-field\n        [floatLabel]=\"floatLabel | asFloatLabelType\"\n        [appearance]=\"appearance\"\n        [subscriptSizing]=\"'dynamic'\"\n        [hideRequiredMarker]=\"hideRequiredMarker\"\n        [class.mat-form-field-disabled]=\"formControl.disabled\"\n        [class.mat-form-field-invalid]=\"formControl.touched && formControl.invalid\"\n        class=\"material-chips\"\n      >\n        <div matPrefix>\n          <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n        </div>\n        @if (floatLabel !== 'never' && !!placeholder) {\n          <mat-label>{{ placeholder }}</mat-label>\n        }\n\n        <mat-chip-grid\n          #chipList\n          (focus)=\"filterChipsFocusEvent($event)\"\n          [disabled]=\"!readonly && disabled\"\n          [required]=\"required\"\n          [errorStateMatcher]=\"_errorStateMatcher\"\n        >\n          @for (item of value; track item) {\n            <mat-chip-row\n              class=\"ion-no-margin\"\n              [removable]=\"!disabled\"\n              (removed)=\"remove(item)\"\n              [color]=\"chipColor\"\n              [highlighted]=\"true\"\n            >\n              {{ item | toString: displayWith }}\n              @if (enabled) {\n                <mat-icon matChipRemove>cancel</mat-icon>\n              }\n            </mat-chip-row>\n          }\n          <input\n            #matInputText\n            type=\"text\"\n            [matAutocomplete]=\"autocomplete\"\n            [matAutocompletePosition]=\"matAutocompletePosition\"\n            [formControl]=\"_inputControl\"\n            [placeholder]=\"floatLabel === 'never' ? placeholder : null\"\n            [appAutofocus]=\"autofocus\"\n            [tabindex]=\"_tabindex\"\n            [readonly]=\"readonly\"\n            [hidden]=\"disabled\"\n            (click)=\"clicked.emit($event)\"\n            (focus)=\"filterInputTextFocusEvent($event)\"\n            (blur)=\"filterInputTextBlurEvent($event)\"\n            (keydown.escape)=\"keydownEscape.emit($event)\"\n            (keyup.enter)=\"keyupEnter.emit($event)\"\n            (keyup.arrowDown)=\"!autocomplete.showPanel && dropButtonClick.emit($event)\"\n            [matChipInputFor]=\"chipList\"\n            [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n          />\n        </mat-chip-grid>\n\n        <!-- autocomplete -->\n        <mat-autocomplete\n          #autocomplete=\"matAutocomplete\"\n          [autoActiveFirstOption]=\"true\"\n          [hideSingleSelectionIndicator]=\"true\"\n          [displayWith]=\"displayWith\"\n          [class]=\"panelClass\"\n          [panelWidth]=\"panelWidth\"\n          [disableRipple]=\"disableRipple\"\n          (optionSelected)=\"add($event.option.value)\"\n        >\n          <!-- Headers -->\n          <ion-row class=\"mat-autocomplete-header column ion-no-padding\">\n            @for (attr of displayAttributes; track attr; let i = $index) {\n              <ion-col [size]=\"displayColumnSizes[i]\">\n                <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n              </ion-col>\n            }\n          </ion-row>\n\n          @if (_$filteredItems | push: 'userBlocking'; as items) {\n            <!-- No item option -->\n            @if (items | isEmptyArray) {\n              <mat-option class=\"ion-padding text-italic\" disabled>\n                <ion-label>\n                  <i>{{ noResultMessage | translate }}</i>\n                </ion-label>\n              </mat-option>\n            }\n\n            <!-- Options -->\n            @for (item of items; track $index) {\n              <mat-option [value]=\"item\" class=\"ion-no-padding\">\n                <ion-row [classList]=\"item?.classList || ''\">\n                  @for (path of displayAttributes; track path; let i = $index) {\n                    <ion-col [size]=\"displayColumnSizes[i]\" [title]=\"text.innerText\" class=\"ion-align-self-center\">\n                      <ion-text>\n                        <span\n                          #text\n                          [innerHTML]=\"\n                            item\n                              | propertyGet: path\n                              | highlight: { search: matInputText.value, withAccent: highlightAccent }\n                          \"\n                        ></span>\n                      </ion-text>\n                    </ion-col>\n                  }\n                </ion-row>\n              </mat-option>\n            }\n            <!-- More item -->\n            @if (_moreItemsCount) {\n              <mat-option (ngInit)=\"_initAutocompleteInfiniteScroll()\" class=\"ion-padding\" disabled>\n                <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n              </mat-option>\n            }\n          } @else if ((matInputText.value | strLength) < suggestLengthThreshold) {\n            <!-- Need more characters -->\n            <mat-option class=\"ion-padding text-italic\" disabled>\n              <ion-label>\n                {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n              </ion-label>\n            </mat-option>\n          } @else {\n            <!-- Loading spinner -->\n            <mat-option class=\"ion-padding\" disabled>\n              <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n            </mat-option>\n          }\n\n          <!-- footer -->\n          @if (itemCount; as count) {\n            <ion-row class=\"mat-autocomplete-footer ion-no-padding\">\n              <ion-col>\n                <ion-text class=\"ion-float-end ion-padding-end\">\n                  <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                </ion-text>\n              </ion-col>\n            </ion-row>\n          }\n        </mat-autocomplete>\n\n        <div matSuffix class=\"mat-form-field-suffix-bottom\">\n          <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n        </div>\n\n        <!-- Hints -->\n        @if (!formControl?.invalid) {\n          <mat-hint>\n            <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n          </mat-hint>\n        }\n      </mat-form-field>\n\n      <!-- Do the same as MatFormField since angular 15 (see component source)-->\n      <div\n        class=\"mat-mdc-form-field-subscript-wrapper\"\n        [class.mat-mdc-form-field-bottom-align]=\"subscriptSizing === 'fixed'\"\n        [class.mat-mdc-form-field-subscript-dynamic-size]=\"subscriptSizing === 'dynamic'\"\n      >\n        @if (formControl.touched && formControl.errors; as errors) {\n          <!-- errors -->\n          <div class=\"mat-mdc-form-field-error-wrapper\">\n            @if (errors | mapKeys | arrayFirst; as errorKey) {\n              @switch (errorKey) {\n                @case ('required') {\n                  <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n                }\n                @case ('entity') {\n                  <mat-error translate>ERROR.FIELD_INVALID</mat-error>\n                }\n                @default {\n                  <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n                }\n              }\n            }\n          </div>\n        }\n      </div>\n    </ion-col>\n    <ion-col [size]=\"colSizes?.[1]\" class=\"ion-no-padding\">\n      <ng-content select=\"[matAfter]\"></ng-content>\n    </ion-col>\n  </ion-row>\n</ion-grid>\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n  <button\n    matSuffix\n    mat-icon-button\n    tabindex=\"-1\"\n    type=\"button\"\n    (click)=\"toggleShowPanel($event)\"\n    [class.hidden]=\"disabled\"\n    [title]=\"dropButtonTitle || '' | translate\"\n  >\n    <mat-icon>{{ mobile ? 'arrow_drop_down' : 'keyboard_arrow_down' }}</mat-icon>\n  </button>\n  @if (clearable) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"clearValue($event)\"\n      [class.hidden]=\"disabled || !formControl.value\"\n      [title]=\"clearButtonTitle || '' | translate\"\n    >\n      <mat-icon>close</mat-icon>\n    </button>\n  }\n\n  <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #matErrorTemplate>\n  <ng-content select=\"mat-error,[matError]\"></ng-content>\n</ng-template>\n\n<ng-template #matHintTemplate>\n  <div class=\"mat-mdc-form-field-hint-wrapper\">\n    <ng-content select=\"mat-hint:not([align='end']),[matHint]\"></ng-content>\n    <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n    <ng-content select=\"mat-hint[align='end']\"></ng-content>\n  </div>\n</ng-template>\n", styles: [":host{width:100%;display:inline-block;position:relative}:host.ion-text-wrap ion-label{white-space:normal!important}button.hidden{display:none;visibility:hidden}.mat-mdc-chip.mat-mdc-standard-chip{--mdc-chip-container-height: 23px;margin:1px 0 0 8px!important;min-height:calc(31px - .5em)}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action{padding:0 2px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action{padding-right:4px;padding-left:4px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action mat-icon{color:inherit}.mat-mdc-chip.mat-mdc-standard-chip.mat-primary{background-color:var(--ion-color-primary);color:var(--ion-color-primary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-secondary{background-color:var(--ion-color-secondary);color:var(--ion-color-secondary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-tertiary{background-color:var(--ion-color-tertiary);color:var(--ion-color-tertiary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-accent{background-color:var(--ion-color-accent);color:var(--ion-color-accent-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-warning{background-color:var(--ion-color-warning);color:var(--ion-color-warning-contrast)}mat-form-field.mat-form-field-invalid ::ng-deep .mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mdc-filled-text-field-error-label-text-color, var(--mat-app-error))}mat-form-field.mat-form-field-invalid ::ng-deep .mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple:after{color:var(--mdc-filled-text-field-error-label-text-color, var(--mat-app-error))}\n"], dependencies: [{ kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2$1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2$1.IonRow, selector: "ion-row" }, { kind: "component", type: i2$1.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i1$3.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: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgInitDirective, selector: "[ngInit]", outputs: ["ngInit"] }, { kind: "directive", type: AutofocusDirective, selector: "[autofocus], input[appAutofocus]", inputs: ["appAutofocus", "autofocusDelay"] }, { kind: "component", type: i6$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i6$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i11$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i11$2.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i11$2.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i11$2.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i11$2.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "directive", type: i1$1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "pipe", type: PropertyGetPipe, name: "propertyGet" }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: EmptyArrayPipe, name: "isEmptyArray" }, { kind: "pipe", type: ArrayFirstPipe, name: "arrayFirst" }, { kind: "pipe", type: MapKeysPipe, name: "mapKeys" }, { kind: "pipe", type: ToStringPipe, name: "toString" }, { kind: "pipe", type: StrLengthPipe, name: "strLength" }, { kind: "pipe", type: AsFloatLabelTypePipe, name: "asFloatLabelType" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i19.RxPush, name: "push" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MatChipsField, decorators: [{
             type: Component,
@@ -13056,7 +13056,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                             multi: true,
                             useExisting: forwardRef(() => MatChipsField),
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-grid class=\"ion-no-padding\">\n  <ion-row>\n    <ion-col [size]=\"colSizes?.[0]\" class=\"ion-no-padding\">\n      <mat-form-field\n        [floatLabel]=\"floatLabel | asFloatLabelType\"\n        [appearance]=\"appearance\"\n        [subscriptSizing]=\"'dynamic'\"\n        [hideRequiredMarker]=\"hideRequiredMarker\"\n        [class.mat-form-field-disabled]=\"formControl.disabled\"\n        [class.mat-form-field-invalid]=\"formControl.touched && formControl.invalid\"\n        class=\"material-chips\"\n      >\n        <div matPrefix>\n          <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n        </div>\n        @if (floatLabel !== 'never' && !!placeholder) {\n          <mat-label>{{ placeholder }}</mat-label>\n        }\n\n        <mat-chip-grid\n          #chipList\n          (focus)=\"filterChipsFocusEvent($event)\"\n          [disabled]=\"!readonly && disabled\"\n          [required]=\"required\"\n          [errorStateMatcher]=\"_errorStateMatcher\"\n        >\n          @for (item of value; track item) {\n            <mat-chip-row\n              class=\"ion-no-margin\"\n              [removable]=\"!disabled\"\n              (removed)=\"remove(item)\"\n              [color]=\"chipColor\"\n              [highlighted]=\"true\"\n            >\n              {{ item | toString: displayWith }}\n              @if (enabled) {\n                <mat-icon matChipRemove>cancel</mat-icon>\n              }\n            </mat-chip-row>\n          }\n          <input\n            #matInputText\n            type=\"text\"\n            [matAutocomplete]=\"autocomplete\"\n            [matAutocompletePosition]=\"matAutocompletePosition\"\n            [formControl]=\"_inputControl\"\n            [placeholder]=\"floatLabel === 'never' ? placeholder : null\"\n            [appAutofocus]=\"autofocus\"\n            [tabindex]=\"_tabindex\"\n            [readonly]=\"readonly\"\n            [hidden]=\"disabled\"\n            (click)=\"clicked.emit($event)\"\n            (focus)=\"filterInputTextFocusEvent($event)\"\n            (blur)=\"filterInputTextBlurEvent($event)\"\n            (keydown.escape)=\"keydownEscape.emit($event)\"\n            (keyup.enter)=\"keyupEnter.emit($event)\"\n            (keyup.arrowDown)=\"!autocomplete.showPanel && dropButtonClick.emit($event)\"\n            [matChipInputFor]=\"chipList\"\n            [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n          />\n        </mat-chip-grid>\n\n        <!-- autocomplete -->\n        <mat-autocomplete\n          #autocomplete=\"matAutocomplete\"\n          [autoActiveFirstOption]=\"true\"\n          [hideSingleSelectionIndicator]=\"true\"\n          [displayWith]=\"displayWith\"\n          [class]=\"panelClass\"\n          [panelWidth]=\"panelWidth\"\n          [disableRipple]=\"disableRipple\"\n          (optionSelected)=\"add($event.option.value)\"\n        >\n          <!-- Headers -->\n          <ion-row class=\"mat-autocomplete-header column ion-no-padding\">\n            @for (attr of displayAttributes; track attr; let i = $index) {\n              <ion-col [size]=\"displayColumnSizes[i]\">\n                <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n              </ion-col>\n            }\n          </ion-row>\n\n          @if (_$filteredItems | push: 'userBlocking'; as items) {\n            <!-- No item option -->\n            @if (items | isEmptyArray) {\n              <mat-option class=\"ion-padding text-italic\" disabled>\n                <ion-label>\n                  <i>{{ noResultMessage | translate }}</i>\n                </ion-label>\n              </mat-option>\n            }\n\n            <!-- Options -->\n            @for (item of items; track $index) {\n              <mat-option [value]=\"item\" class=\"ion-no-padding\">\n                <ion-row [classList]=\"item.classList || ''\">\n                  @for (path of displayAttributes; track path; let i = $index) {\n                    <ion-col [size]=\"displayColumnSizes[i]\" [title]=\"text.innerText\" class=\"ion-align-self-center\">\n                      <ion-text>\n                        <span\n                          #text\n                          [innerHTML]=\"\n                            item\n                              | propertyGet: path\n                              | highlight: { search: matInputText.value, withAccent: highlightAccent }\n                          \"\n                        ></span>\n                      </ion-text>\n                    </ion-col>\n                  }\n                </ion-row>\n              </mat-option>\n            }\n            <!-- More item -->\n            @if (_moreItemsCount) {\n              <mat-option (ngInit)=\"_initAutocompleteInfiniteScroll()\" class=\"ion-padding\" disabled>\n                <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n              </mat-option>\n            }\n          } @else if ((matInputText.value | strLength) < suggestLengthThreshold) {\n            <!-- Need more characters -->\n            <mat-option class=\"ion-padding text-italic\" disabled>\n              <ion-label>\n                {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n              </ion-label>\n            </mat-option>\n          } @else {\n            <!-- Loading spinner -->\n            <mat-option class=\"ion-padding\" disabled>\n              <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n            </mat-option>\n          }\n\n          <!-- footer -->\n          @if (itemCount; as count) {\n            <ion-row class=\"mat-autocomplete-footer ion-no-padding\">\n              <ion-col>\n                <ion-text class=\"ion-float-end ion-padding-end\">\n                  <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                </ion-text>\n              </ion-col>\n            </ion-row>\n          }\n        </mat-autocomplete>\n\n        <div matSuffix class=\"mat-form-field-suffix-bottom\">\n          <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n        </div>\n\n        <!-- Hints -->\n        @if (!formControl?.invalid) {\n          <mat-hint>\n            <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n          </mat-hint>\n        }\n      </mat-form-field>\n\n      <!-- Do the same as MatFormField since angular 15 (see component source)-->\n      <div\n        class=\"mat-mdc-form-field-subscript-wrapper\"\n        [class.mat-mdc-form-field-bottom-align]=\"subscriptSizing === 'fixed'\"\n        [class.mat-mdc-form-field-subscript-dynamic-size]=\"subscriptSizing === 'dynamic'\"\n      >\n        @if (formControl.touched && formControl.errors; as errors) {\n          <!-- errors -->\n          <div class=\"mat-mdc-form-field-error-wrapper\">\n            @if (errors | mapKeys | arrayFirst; as errorKey) {\n              @switch (errorKey) {\n                @case ('required') {\n                  <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n                }\n                @case ('entity') {\n                  <mat-error translate>ERROR.FIELD_INVALID</mat-error>\n                }\n                @default {\n                  <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n                }\n              }\n            }\n          </div>\n        }\n      </div>\n    </ion-col>\n    <ion-col [size]=\"colSizes?.[1]\" class=\"ion-no-padding\">\n      <ng-content select=\"[matAfter]\"></ng-content>\n    </ion-col>\n  </ion-row>\n</ion-grid>\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n  <button\n    matSuffix\n    mat-icon-button\n    tabindex=\"-1\"\n    type=\"button\"\n    (click)=\"toggleShowPanel($event)\"\n    [class.hidden]=\"disabled\"\n    [title]=\"dropButtonTitle || '' | translate\"\n  >\n    <mat-icon>{{ mobile ? 'arrow_drop_down' : 'keyboard_arrow_down' }}</mat-icon>\n  </button>\n  @if (clearable) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"clearValue($event)\"\n      [class.hidden]=\"disabled || !formControl.value\"\n      [title]=\"clearButtonTitle || '' | translate\"\n    >\n      <mat-icon>close</mat-icon>\n    </button>\n  }\n\n  <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #matErrorTemplate>\n  <ng-content select=\"mat-error,[matError]\"></ng-content>\n</ng-template>\n\n<ng-template #matHintTemplate>\n  <div class=\"mat-mdc-form-field-hint-wrapper\">\n    <ng-content select=\"mat-hint:not([align='end']),[matHint]\"></ng-content>\n    <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n    <ng-content select=\"mat-hint[align='end']\"></ng-content>\n  </div>\n</ng-template>\n", styles: [":host{width:100%;display:inline-block;position:relative}:host.ion-text-wrap ion-label{white-space:normal!important}button.hidden{display:none;visibility:hidden}.mat-mdc-chip.mat-mdc-standard-chip{--mdc-chip-container-height: 23px;margin:1px 0 0 8px!important;min-height:calc(31px - .5em)}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action{padding:0 2px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action{padding-right:4px;padding-left:4px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action mat-icon{color:inherit}.mat-mdc-chip.mat-mdc-standard-chip.mat-primary{background-color:var(--ion-color-primary);color:var(--ion-color-primary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-secondary{background-color:var(--ion-color-secondary);color:var(--ion-color-secondary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-tertiary{background-color:var(--ion-color-tertiary);color:var(--ion-color-tertiary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-accent{background-color:var(--ion-color-accent);color:var(--ion-color-accent-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-warning{background-color:var(--ion-color-warning);color:var(--ion-color-warning-contrast)}mat-form-field.mat-form-field-invalid ::ng-deep .mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mdc-filled-text-field-error-label-text-color, var(--mat-app-error))}mat-form-field.mat-form-field-invalid ::ng-deep .mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple:after{color:var(--mdc-filled-text-field-error-label-text-color, var(--mat-app-error))}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-grid class=\"ion-no-padding\">\n  <ion-row>\n    <ion-col [size]=\"colSizes?.[0]\" class=\"ion-no-padding\">\n      <mat-form-field\n        [floatLabel]=\"floatLabel | asFloatLabelType\"\n        [appearance]=\"appearance\"\n        [subscriptSizing]=\"'dynamic'\"\n        [hideRequiredMarker]=\"hideRequiredMarker\"\n        [class.mat-form-field-disabled]=\"formControl.disabled\"\n        [class.mat-form-field-invalid]=\"formControl.touched && formControl.invalid\"\n        class=\"material-chips\"\n      >\n        <div matPrefix>\n          <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n        </div>\n        @if (floatLabel !== 'never' && !!placeholder) {\n          <mat-label>{{ placeholder }}</mat-label>\n        }\n\n        <mat-chip-grid\n          #chipList\n          (focus)=\"filterChipsFocusEvent($event)\"\n          [disabled]=\"!readonly && disabled\"\n          [required]=\"required\"\n          [errorStateMatcher]=\"_errorStateMatcher\"\n        >\n          @for (item of value; track item) {\n            <mat-chip-row\n              class=\"ion-no-margin\"\n              [removable]=\"!disabled\"\n              (removed)=\"remove(item)\"\n              [color]=\"chipColor\"\n              [highlighted]=\"true\"\n            >\n              {{ item | toString: displayWith }}\n              @if (enabled) {\n                <mat-icon matChipRemove>cancel</mat-icon>\n              }\n            </mat-chip-row>\n          }\n          <input\n            #matInputText\n            type=\"text\"\n            [matAutocomplete]=\"autocomplete\"\n            [matAutocompletePosition]=\"matAutocompletePosition\"\n            [formControl]=\"_inputControl\"\n            [placeholder]=\"floatLabel === 'never' ? placeholder : null\"\n            [appAutofocus]=\"autofocus\"\n            [tabindex]=\"_tabindex\"\n            [readonly]=\"readonly\"\n            [hidden]=\"disabled\"\n            (click)=\"clicked.emit($event)\"\n            (focus)=\"filterInputTextFocusEvent($event)\"\n            (blur)=\"filterInputTextBlurEvent($event)\"\n            (keydown.escape)=\"keydownEscape.emit($event)\"\n            (keyup.enter)=\"keyupEnter.emit($event)\"\n            (keyup.arrowDown)=\"!autocomplete.showPanel && dropButtonClick.emit($event)\"\n            [matChipInputFor]=\"chipList\"\n            [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\"\n          />\n        </mat-chip-grid>\n\n        <!-- autocomplete -->\n        <mat-autocomplete\n          #autocomplete=\"matAutocomplete\"\n          [autoActiveFirstOption]=\"true\"\n          [hideSingleSelectionIndicator]=\"true\"\n          [displayWith]=\"displayWith\"\n          [class]=\"panelClass\"\n          [panelWidth]=\"panelWidth\"\n          [disableRipple]=\"disableRipple\"\n          (optionSelected)=\"add($event.option.value)\"\n        >\n          <!-- Headers -->\n          <ion-row class=\"mat-autocomplete-header column ion-no-padding\">\n            @for (attr of displayAttributes; track attr; let i = $index) {\n              <ion-col [size]=\"displayColumnSizes[i]\">\n                <ion-label [innerHTML]=\"displayColumnNames[i] | translate\"></ion-label>\n              </ion-col>\n            }\n          </ion-row>\n\n          @if (_$filteredItems | push: 'userBlocking'; as items) {\n            <!-- No item option -->\n            @if (items | isEmptyArray) {\n              <mat-option class=\"ion-padding text-italic\" disabled>\n                <ion-label>\n                  <i>{{ noResultMessage | translate }}</i>\n                </ion-label>\n              </mat-option>\n            }\n\n            <!-- Options -->\n            @for (item of items; track $index) {\n              <mat-option [value]=\"item\" class=\"ion-no-padding\">\n                <ion-row [classList]=\"item?.classList || ''\">\n                  @for (path of displayAttributes; track path; let i = $index) {\n                    <ion-col [size]=\"displayColumnSizes[i]\" [title]=\"text.innerText\" class=\"ion-align-self-center\">\n                      <ion-text>\n                        <span\n                          #text\n                          [innerHTML]=\"\n                            item\n                              | propertyGet: path\n                              | highlight: { search: matInputText.value, withAccent: highlightAccent }\n                          \"\n                        ></span>\n                      </ion-text>\n                    </ion-col>\n                  }\n                </ion-row>\n              </mat-option>\n            }\n            <!-- More item -->\n            @if (_moreItemsCount) {\n              <mat-option (ngInit)=\"_initAutocompleteInfiniteScroll()\" class=\"ion-padding\" disabled>\n                <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n              </mat-option>\n            }\n          } @else if ((matInputText.value | strLength) < suggestLengthThreshold) {\n            <!-- Need more characters -->\n            <mat-option class=\"ion-padding text-italic\" disabled>\n              <ion-label>\n                {{ 'INFO.PLEASE_TYPE_MORE_CHARACTERS' | translate: { minLength: suggestLengthThreshold } }}\n              </ion-label>\n            </mat-option>\n          } @else {\n            <!-- Loading spinner -->\n            <mat-option class=\"ion-padding\" disabled>\n              <ion-skeleton-text [animated]=\"true\" style=\"width: 100%\"></ion-skeleton-text>\n            </mat-option>\n          }\n\n          <!-- footer -->\n          @if (itemCount; as count) {\n            <ion-row class=\"mat-autocomplete-footer ion-no-padding\">\n              <ion-col>\n                <ion-text class=\"ion-float-end ion-padding-end\">\n                  <i>{{ 'COMMON.RESULT_COUNT' | translate: { count: count } }}</i>\n                </ion-text>\n              </ion-col>\n            </ion-row>\n          }\n        </mat-autocomplete>\n\n        <div matSuffix class=\"mat-form-field-suffix-bottom\">\n          <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n        </div>\n\n        <!-- Hints -->\n        @if (!formControl?.invalid) {\n          <mat-hint>\n            <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n          </mat-hint>\n        }\n      </mat-form-field>\n\n      <!-- Do the same as MatFormField since angular 15 (see component source)-->\n      <div\n        class=\"mat-mdc-form-field-subscript-wrapper\"\n        [class.mat-mdc-form-field-bottom-align]=\"subscriptSizing === 'fixed'\"\n        [class.mat-mdc-form-field-subscript-dynamic-size]=\"subscriptSizing === 'dynamic'\"\n      >\n        @if (formControl.touched && formControl.errors; as errors) {\n          <!-- errors -->\n          <div class=\"mat-mdc-form-field-error-wrapper\">\n            @if (errors | mapKeys | arrayFirst; as errorKey) {\n              @switch (errorKey) {\n                @case ('required') {\n                  <mat-error translate>ERROR.FIELD_REQUIRED</mat-error>\n                }\n                @case ('entity') {\n                  <mat-error translate>ERROR.FIELD_INVALID</mat-error>\n                }\n                @default {\n                  <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n                }\n              }\n            }\n          </div>\n        }\n      </div>\n    </ion-col>\n    <ion-col [size]=\"colSizes?.[1]\" class=\"ion-no-padding\">\n      <ng-content select=\"[matAfter]\"></ng-content>\n    </ion-col>\n  </ion-row>\n</ion-grid>\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n  <button\n    matSuffix\n    mat-icon-button\n    tabindex=\"-1\"\n    type=\"button\"\n    (click)=\"toggleShowPanel($event)\"\n    [class.hidden]=\"disabled\"\n    [title]=\"dropButtonTitle || '' | translate\"\n  >\n    <mat-icon>{{ mobile ? 'arrow_drop_down' : 'keyboard_arrow_down' }}</mat-icon>\n  </button>\n  @if (clearable) {\n    <button\n      matSuffix\n      mat-icon-button\n      tabindex=\"-1\"\n      type=\"button\"\n      (click)=\"clearValue($event)\"\n      [class.hidden]=\"disabled || !formControl.value\"\n      [title]=\"clearButtonTitle || '' | translate\"\n    >\n      <mat-icon>close</mat-icon>\n    </button>\n  }\n\n  <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n\n<ng-template #matErrorTemplate>\n  <ng-content select=\"mat-error,[matError]\"></ng-content>\n</ng-template>\n\n<ng-template #matHintTemplate>\n  <div class=\"mat-mdc-form-field-hint-wrapper\">\n    <ng-content select=\"mat-hint:not([align='end']),[matHint]\"></ng-content>\n    <div class=\"mat-mdc-form-field-hint-spacer\"></div>\n    <ng-content select=\"mat-hint[align='end']\"></ng-content>\n  </div>\n</ng-template>\n", styles: [":host{width:100%;display:inline-block;position:relative}:host.ion-text-wrap ion-label{white-space:normal!important}button.hidden{display:none;visibility:hidden}.mat-mdc-chip.mat-mdc-standard-chip{--mdc-chip-container-height: 23px;margin:1px 0 0 8px!important;min-height:calc(31px - .5em)}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action{padding:0 2px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action{padding-right:4px;padding-left:4px}.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action mat-icon{color:inherit}.mat-mdc-chip.mat-mdc-standard-chip.mat-primary{background-color:var(--ion-color-primary);color:var(--ion-color-primary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-secondary{background-color:var(--ion-color-secondary);color:var(--ion-color-secondary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-tertiary{background-color:var(--ion-color-tertiary);color:var(--ion-color-tertiary-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-accent{background-color:var(--ion-color-accent);color:var(--ion-color-accent-contrast)}.mat-mdc-chip.mat-mdc-standard-chip.mat-warning{background-color:var(--ion-color-warning);color:var(--ion-color-warning-contrast)}mat-form-field.mat-form-field-invalid ::ng-deep .mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-floating-label{color:var(--mdc-filled-text-field-error-label-text-color, var(--mat-app-error))}mat-form-field.mat-form-field-invalid ::ng-deep .mdc-text-field--filled.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple:after{color:var(--mdc-filled-text-field-error-label-text-color, var(--mat-app-error))}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$3.FormGroupDirective, decorators: [{
                     type: Optional
                 }] }, { type: undefined, decorators: [{