@sumaris-net/ngx-components 1.4.1 → 1.4.6

package/bundles/sumaris-net.ngx-components.umd.js

@@ -1368,14 +1368,14 @@
         });
         Object.defineProperty(MatAutocompleteField.prototype, "disabled", {
             get: function () {
-                return this.readonly || this.formControl.disabled;
+                return this._readonly || this.formControl.disabled;
             },
             enumerable: false,
             configurable: true
         });
         Object.defineProperty(MatAutocompleteField.prototype, "enabled", {
             get: function () {
-                return !this.readonly && this.formControl.enabled;
+                return !this._readonly && this.formControl.enabled;
             },
             enumerable: false,
             configurable: true
@@ -1476,7 +1476,7 @@
             this._reload$, 
             // Search text (no distinctUntilChanged() because of the debounceTime() pipe)
             this.formControl.valueChanges
-                .pipe(operators.filter(function (value) { return _this.searchable && isNotNilString(value); }), 
+                .pipe(operators.filter(function (value) { return _this.enabled && _this.searchable && isNotNilString(value); }), 
             // Mark as loading (to show loading spinner) - earlier as possible, so before the debounce time
             operators.tap(function (value) {
                 if (_this.showLoadingSpinner) {
@@ -1486,10 +1486,13 @@
             // Filter if not enough character
             operators.filter(function (value) { return value.length >= _this.suggestLengthThreshold; }), 
             // Wait a debounce time
-            operators.debounceTime(this.debounceTime)), 
+            operators.debounceTime(this.debounceTime)
+            // DEBUG
+            //tap((value) => console.debug(this.logPrefix + ' Search text changes:', value)),
+            ), 
             // Object set: use it (no distinctUntilChanged() pipe need)
             this.formControl.valueChanges
-                .pipe(operators.startWith(this.formControl.value), operators.filter(function (value) { return _this.searchable && (typeof value === 'object'); }), operators.tap(function (value) {
+                .pipe(operators.startWith(this.formControl.value), operators.filter(function (value) { return (_this.searchable && isNotNil(value) && typeof value === 'object'); }), operators.tap(function (value) {
                 // DEBUG
                 //console.debug(this.logPrefix + ' object changes:', value)
                 // Update the display value (if need)
@@ -1501,24 +1504,25 @@
                         _this.matInputText.nativeElement.value = _this.displayValue;
                     }
                 }
-            })), 
+            })
+            // DEBUG
+            //tap(value => console.debug(this.logPrefix + ' Received an object value: ', value))
+            ), 
             // Merge some observables, with a common distinctUntilChanged() pipe, and NO debounceTime
             rxjs.merge(
             // Focus or click => Load all
             rxjs.merge(this.onFocus, this.onClick)
-                .pipe(operators.filter(function (_) { return _this.searchable && _this.enabled; }), operators.map(function (_) { return _this.showAllOnFocus ? '*' : _this.formControl.value; })), 
+                .pipe(operators.filter(function (_) { return _this.enabled && _this.searchable; }), operators.map(function (_) { return _this.showAllOnFocus ? '*' : _this.formControl.value; })), 
             // On dropdown button click
             this.onDropButtonClick
-                .pipe(operators.filter(function (event) { return _this.searchable && (!event || !event.defaultPrevented) && _this.formControl.enabled; }), operators.map(function (_) { return _this.showAllOnFocus ? '*' : _this.formControl.value; })), rxjs.merge(this.$inputItems, this._filter$)
-                .pipe(operators.map(function (_) { return _this.searchable && _this.formControl.value; })))
+                .pipe(operators.filter(function (event) { return _this.enabled && _this.searchable && (!event || !event.defaultPrevented); }), operators.map(function (_) { return _this.showAllOnFocus ? '*' : _this.formControl.value; })), rxjs.merge(this.$inputItems, this._filter$)
+                .pipe(operators.filter(function (event) { return _this.enabled && _this.searchable; }), operators.map(function (_) { return _this.formControl.value; })))
                 .pipe(
             // If value is a string (and is not = '*'), filter if not enough character
             operators.filter(function (value) { return value === '*' || !(typeof value === 'string') || value.length >= _this.suggestLengthThreshold; }), 
             // Distinguish changes
             operators.distinctUntilChanged()))
                 .pipe(
-            // DEBUG
-            //tap(value => console.debug(this.logPrefix + ' Received update event: ', value)),
             // Suggest values
             operators.mergeMap(function (value) { return _this.suggest(value, _this.filter); }), 
             // DEBUG
@@ -1577,7 +1581,9 @@
             }));
             // Listen form control status change
             this._subscription.add(this.formControl.statusChanges
-                .pipe(operators.distinctUntilChanged())
+                .pipe(
+            //filter(() => this.enabled),
+            operators.distinctUntilChanged())
                 // Update component state
                 .subscribe(function () { return _this.checkIfTouched(); }));
             this._subscription.add(this.onKeydownEscape.subscribe(function (event) {
@@ -1679,7 +1685,7 @@
             // If combo is empty, or if has content but should force to show panel on focus
             if (!hasContent || (this.showPanelOnFocus && this.showAllOnFocus)) {
                 // DEBUG
-                console.debug(this.logPrefix + ' Emit focus event');
+                //console.debug(this.logPrefix + ' Emit focus event');
                 this.onFocus.emit(event);
                 return true;
             }
@@ -5312,6 +5318,7 @@
             this.compact = false;
             this.placeholderChar = DEFAULT_PLACEHOLDER_CHAR;
             this.autofocus = false;
+            this.startDate = null;
             this.clearable = false;
             this.locale = (translate.currentLang || translate.defaultLang).substr(0, 2);
         }
@@ -5679,19 +5686,19 @@
         { type: i1.FormGroupDirective, decorators: [{ type: i0.Optional }] }
     ]; };
     MatDateTime.propDecorators = {
-        mobile: [{ type: i0.Input }],
         formControl: [{ type: i0.Input }],
         formControlName: [{ type: i0.Input }],
         placeholder: [{ type: i0.Input }],
         floatLabel: [{ type: i0.Input }],
         required: [{ type: i0.Input }],
+        mobile: [{ type: i0.Input }],
         compact: [{ type: i0.Input }],
         placeholderChar: [{ type: i0.Input }],
         autofocus: [{ type: i0.Input }],
-        readonly: [{ type: i0.Input }],
-        tabindex: [{ type: i0.Input }],
         startDate: [{ type: i0.Input }],
         clearable: [{ type: i0.Input }],
+        readonly: [{ type: i0.Input }],
+        tabindex: [{ type: i0.Input }],
         datePicker: [{ type: i0.ViewChild, args: ['datePicker',] }],
         timePicker: [{ type: i0.ViewChild, args: ['timePicker',] }],
         matInputs: [{ type: i0.ViewChildren, args: ['matInput',] }]
@@ -6411,17 +6418,6 @@
             this.showRadio = this.showRadio || this.floatLabel === 'always';
             this.updateTabIndex();
         };
-        MatBooleanField.prototype.ngAfterViewInit = function () {
-            var _this = this;
-            // Inject suffix elements, into the first injection point found
-            if (this.suffixDiv) {
-                this.suffixInjections.find(function (item) {
-                    item.nativeElement.append(_this.suffixDiv.nativeElement);
-                    _this.suffixDiv.nativeElement.classList.remove('cdk-visually-hidden');
-                    return true; // take only the first injection point
-                });
-            }
-        };
         MatBooleanField.prototype.writeValue = function (value, event) {
             var _this = this;
             if (this._writing)
@@ -6540,7 +6536,7 @@
     MatBooleanField.decorators = [
         { type: i0.Component, args: [{
                     selector: 'mat-boolean-field',
-                    template: "<mat-form-field  *ngIf=\"readonly; else writable\"\n                 [floatLabel]=\"floatLabel\"\n                 class=\"mat-form-field-disabled {{classList}}\">\n  <input matInput hidden type=\"text\" readonly\n         [placeholder]=\"placeholder\"\n         [formControl]=\"formControl\">\n  <ion-text>{{(formControl.value == null && 'COMMON.EMPTY_OPTION' || (formControl.value === true && yesLabel) || noLabel) | translate }}</ion-text>\n</mat-form-field>\n\n<ng-template #writable>\n  <ng-container [ngSwitch]=\"style\">\n\n    <!-- Radio -->\n    <mat-form-field *ngSwitchCase=\"'radio'\"\n                    [floatLabel]=\"showRadio && (!floatLabel || floatLabel === 'auto') ? 'always': floatLabel\"\n                    class=\"mat-boolean-field mat-boolean-field-radio {{classList}}\">\n      <mat-label *ngIf=\"placeholder && floatLabel!=='never'\">\n        {{placeholder}}\n        <span [hidden]=\"showRadio\">({{yesLabel|translate}}/{{'COMMON.NO'|translate}})</span>\n      </mat-label>\n\n      <input matInput #fakeInput type=\"text\" readonly=\"true\"\n             [formControl]=\"formControl\"\n             (focus)=\"_onFocusFakeInput($event)\"\n             [required]=\"required\"\n             [class.cdk-visually-hidden]=\"showRadio\"\n             [tabindex]=\"tabindex\">\n\n      <!-- radio button -->\n      <mat-radio-group [hidden]=\"!showRadio\"\n                       [formControl]=\"formControl\"\n                       (change)=\"onRadioValueChanged($event)\">\n        <mat-radio-button #yesButton [value]=\"true\">\n          <span>{{yesLabel|translate}}</span>\n        </mat-radio-button>&nbsp;\n        <mat-radio-button #noButton [value]=\"false\">\n          <span>{{noLabel|translate}}</span>\n        </mat-radio-button>\n      </mat-radio-group>\n\n      <div matSuffix #injectMatSuffix></div>\n\n      <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n    </mat-form-field>\n\n    <!-- Checkbox -->\n    <mat-form-field *ngSwitchCase=\"'checkbox'\"\n                    [floatLabel]=\"floatLabel\"\n                    class=\"mat-boolean-field mat-boolean-field-checkbox {{classList}}\">\n      <mat-label *ngIf=\"placeholder && !showRadio\">\n        {{placeholder}}\n      </mat-label>\n\n      <input matInput #matInput\n             [formControl]=\"formControl\"\n             (focus)=\"_onFocusFakeInput($event)\"\n             [required]=\"required\"\n             [class.cdk-visually-hidden]=\"showRadio\"\n             [tabindex]=\"tabindex\">\n\n      <ion-label>&nbsp;</ion-label>\n\n      <!-- checkbox, when compact -->\n      <mat-checkbox #checkboxButton\n                    [formControl]=\"formControl\"\n                    (change)=\"onCheckboxValueChanged($event)\"\n                    [indeterminate]=\"value===undefined\"\n                    [hidden]=\"!showRadio\"\n                    [tabindex]=\"tabindex\">\n      </mat-checkbox>\n\n      <div matSuffix #injectMatSuffix></div>\n\n      <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n    </mat-form-field>\n\n    <!-- Buttons -->\n    <mat-form-field *ngSwitchCase=\"'button'\"\n                    [floatLabel]=\"floatLabel === 'never' ? 'never' : 'always'\"\n                    class=\"mat-boolean-field mat-boolean-field-button {{classList}}\">\n      <input matInput type=\"text\" hidden\n             [formControl]=\"formControl\"\n             [placeholder]=\"placeholder\"\n             [required]=\"required\">\n      <div class=\"mat-form-field-buttons\"\n           [style.--buttons-col-count]=\"buttonsColCount\"\n           *ngIf=\"!formControl.disabled; else disabledLabel\">\n        <!-- yes -->\n        <ion-button class=\"mat-form-field-button\"\n                    [tabindex]=\"_tabindex\"\n                    (click)=\"writeValue(true, $event)\"\n                    (keyup.enter)=\"writeValue(true, $event)\"\n                    [color]=\"_value == null ? 'tertiary' : (_value === true) ? 'accent' : 'light'\">\n          <ion-icon *ngIf=\"showButtonIcons && yesIcon; let icon\" slot=\"start\" [name]=\"icon\"></ion-icon>\n          {{yesLabel|translate}}\n        </ion-button>\n\n        <!-- No button -->\n        <ion-button class=\"mat-form-field-button\"\n                    [tabindex]=\"_tabindex !== undefined ? (_tabindex + 1) : undefined\"\n                    (click)=\"writeValue(false, $event)\"\n                    (keyup.enter)=\"writeValue(false, $event)\"\n                    [color]=\"_value == null ? 'tertiary' : (_value === false) ? 'accent' : 'light'\">\n          <ion-icon *ngIf=\"showButtonIcons && noIcon; let icon\" slot=\"start\" [name]=\"icon\"></ion-icon>\n          {{noLabel|translate}}\n        </ion-button>\n      </div>\n      <ng-template #disabledLabel>\n        <ion-label><i translate>COMMON.EMPTY_OPTION</i></ion-label>\n      </ng-template>\n\n      <div matSuffix #injectMatSuffix></div>\n\n      <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n    </mat-form-field>\n  </ng-container>\n\n  <div class=\"cdk-visually-hidden\">\n    <div #suffix><ng-content select=\"[matSuffix]\"></ng-content></div>\n  </div>\n\n</ng-template>\n\n\n",
+                    template: "<mat-form-field  *ngIf=\"readonly; else writable\"\n                 [floatLabel]=\"floatLabel\"\n                 class=\"mat-form-field-disabled {{classList}}\">\n  <div matPrefix>\n    <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n  </div>\n  <input matInput hidden type=\"text\" readonly\n         [placeholder]=\"placeholder\"\n         [formControl]=\"formControl\">\n  <ion-text>{{(formControl.value == null && 'COMMON.EMPTY_OPTION' || (formControl.value === true && yesLabel) || noLabel) | translate }}</ion-text>\n  <div matSuffix>\n    <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n  </div>\n</mat-form-field>\n\n<ng-template #writable>\n  <ng-container [ngSwitch]=\"style\">\n\n    <!-- Radio -->\n    <mat-form-field *ngSwitchCase=\"'radio'\"\n                    [floatLabel]=\"showRadio && (!floatLabel || floatLabel === 'auto') ? 'always': floatLabel\"\n                    class=\"mat-boolean-field mat-boolean-field-radio {{classList}}\">\n      <mat-label *ngIf=\"placeholder && floatLabel!=='never'\">\n        {{placeholder}}\n        <span [hidden]=\"showRadio\">({{yesLabel|translate}}/{{'COMMON.NO'|translate}})</span>\n      </mat-label>\n      <div matPrefix>\n        <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n      </div>\n      <input matInput #fakeInput type=\"text\" readonly=\"true\"\n             [formControl]=\"formControl\"\n             (focus)=\"_onFocusFakeInput($event)\"\n             [required]=\"required\"\n             [class.cdk-visually-hidden]=\"showRadio\"\n             [tabindex]=\"tabindex\">\n\n      <!-- radio button -->\n      <mat-radio-group [hidden]=\"!showRadio\"\n                       [formControl]=\"formControl\"\n                       (change)=\"onRadioValueChanged($event)\">\n        <mat-radio-button #yesButton [value]=\"true\">\n          <span>{{yesLabel|translate}}</span>\n        </mat-radio-button>&nbsp;\n        <mat-radio-button #noButton [value]=\"false\">\n          <span>{{noLabel|translate}}</span>\n        </mat-radio-button>\n      </mat-radio-group>\n\n      <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n\n      <div matSuffix>\n        <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n      </div>\n    </mat-form-field>\n\n    <!-- Checkbox -->\n    <mat-form-field *ngSwitchCase=\"'checkbox'\"\n                    [floatLabel]=\"floatLabel\"\n                    class=\"mat-boolean-field mat-boolean-field-checkbox {{classList}}\">\n      <mat-label *ngIf=\"placeholder && !showRadio\">\n        {{placeholder}}\n      </mat-label>\n      <div matPrefix>\n        <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n      </div>\n      <input matInput #matInput\n             [formControl]=\"formControl\"\n             (focus)=\"_onFocusFakeInput($event)\"\n             [required]=\"required\"\n             [class.cdk-visually-hidden]=\"showRadio\"\n             [tabindex]=\"tabindex\">\n\n      <ion-label>&nbsp;</ion-label>\n\n      <!-- checkbox, when compact -->\n      <mat-checkbox #checkboxButton\n                    [formControl]=\"formControl\"\n                    (change)=\"onCheckboxValueChanged($event)\"\n                    [indeterminate]=\"value===undefined\"\n                    [hidden]=\"!showRadio\"\n                    [tabindex]=\"tabindex\">\n      </mat-checkbox>\n\n      <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n\n      <div matSuffix>\n        <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n      </div>\n    </mat-form-field>\n\n    <!-- Buttons -->\n    <mat-form-field *ngSwitchCase=\"'button'\"\n                    [floatLabel]=\"floatLabel === 'never' ? 'never' : 'always'\"\n                    class=\"mat-boolean-field mat-boolean-field-button {{classList}}\">\n      <div matPrefix>\n        <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n      </div>\n      <input matInput type=\"text\" hidden\n             [formControl]=\"formControl\"\n             [placeholder]=\"placeholder\"\n             [required]=\"required\">\n      <div class=\"mat-form-field-buttons\"\n           [style.--buttons-col-count]=\"buttonsColCount\"\n           *ngIf=\"!formControl.disabled; else disabledLabel\">\n        <!-- yes -->\n        <ion-button class=\"mat-form-field-button\"\n                    [tabindex]=\"_tabindex\"\n                    (click)=\"writeValue(true, $event)\"\n                    (keyup.enter)=\"writeValue(true, $event)\"\n                    [color]=\"_value == null ? 'tertiary' : (_value === true) ? 'accent' : 'light'\">\n          <ion-icon *ngIf=\"showButtonIcons && yesIcon; let icon\" slot=\"start\" [name]=\"icon\"></ion-icon>\n          {{yesLabel|translate}}\n        </ion-button>\n\n        <!-- No button -->\n        <ion-button class=\"mat-form-field-button\"\n                    [tabindex]=\"_tabindex !== undefined ? (_tabindex + 1) : undefined\"\n                    (click)=\"writeValue(false, $event)\"\n                    (keyup.enter)=\"writeValue(false, $event)\"\n                    [color]=\"_value == null ? 'tertiary' : (_value === false) ? 'accent' : 'light'\">\n          <ion-icon *ngIf=\"showButtonIcons && noIcon; let icon\" slot=\"start\" [name]=\"icon\"></ion-icon>\n          {{noLabel|translate}}\n        </ion-button>\n      </div>\n      <ng-template #disabledLabel>\n        <ion-label><i translate>COMMON.EMPTY_OPTION</i></ion-label>\n      </ng-template>\n\n      <mat-error *ngIf=\"formControl.hasError('required')\" translate>ERROR.FIELD_REQUIRED</mat-error>\n      <div matSuffix>\n        <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n      </div>\n\n    </mat-form-field>\n  </ng-container>\n\n  <div class=\"cdk-visually-hidden\">\n    <div #suffix><ng-content select=\"[matSuffix]\"></ng-content></div>\n  </div>\n\n</ng-template>\n\n\n<ng-template #matPrefixTemplate>\n  <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n<ng-template #matSuffixTemplate>\n  <ng-content select=\"[matSuffix]\"></ng-content>\n</ng-template>\n",
                     providers: [
                         DEFAULT_VALUE_ACCESSOR$1
                     ],
@@ -6579,8 +6575,7 @@
         noButton: [{ type: i0.ViewChild, args: ['noButton',] }],
         checkboxButton: [{ type: i0.ViewChild, args: ['checkboxButton',] }],
         fakeInput: [{ type: i0.ViewChild, args: ['fakeInput',] }],
-        suffixDiv: [{ type: i0.ViewChild, args: ['suffix', { static: false },] }],
-        suffixInjections: [{ type: i0.ViewChildren, args: ['injectMatSuffix',] }]
+        suffixDiv: [{ type: i0.ViewChild, args: ['suffix', { static: false },] }]
     };
 
     var SharedMatBooleanModule = /** @class */ (function () {
@@ -10878,7 +10873,7 @@
             });
         };
         LocalSettingsService.prototype.setProperty = function (keyOrDef, value) {
-            if (!this._data)
+            if (!this._data || !keyOrDef)
                 return;
             if (typeof keyOrDef === 'object') {
                 this.setProperty(keyOrDef.key, value);
@@ -11001,8 +10996,9 @@
             var feature = this._data.offlineFeatures.find(function (f) {
                 if (typeof f === 'string')
                     return f.toLowerCase().startsWith(featurePrefix);
-                if (typeof f === 'object' && f.name)
+                if (f && typeof f === 'object' && f.name)
                     return f.name === featureName;
+                return false;
             });
             if (!feature)
                 return; // Not found
@@ -11033,8 +11029,9 @@
             var existingIndex = this._data.offlineFeatures.findIndex(function (f) {
                 if (typeof f === 'string')
                     return f.toLowerCase().startsWith(featurePrefix);
-                if (typeof f === 'object' && f.name)
+                if (f && typeof f === 'object' && f.name)
                     return f.name === feature.name;
+                return false;
             });
             if (existingIndex !== -1) {
                 this._data.offlineFeatures[existingIndex] = feature;
@@ -13230,6 +13227,9 @@
                                 console.warn("[entities-storage] Persisting " + entityName + ": store not found!");
                                 return;
                             }
+                            if (!entityStore.dirty)
+                                return;
+                            // Persist store
                             return entityStore.persist()
                                 .then(function (count) {
                                 // If no entity found, remove from the entity names array