@sumaris-net/ngx-components 21.3.1 → 21.3.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/doc/changelog.md
CHANGED
|
@@ -2383,4 +2383,7 @@ The library now uses the Ionic **standalone** build (`@ionic/angular/standalone`
|
|
|
2383
2383
|
|
|
2384
2384
|
## 21.3.1
|
|
2385
2385
|
- enh(image-gallery): add `slideshowActionsTemplate` input to `AppImageGalleryComponent` (and `actionsTemplate` to `AppImageGallerySlideshowComponent`)
|
|
2386
|
-
- a `TemplateRef` slot rendered in the slideshow footer's middle column
|
|
2386
|
+
- a `TemplateRef` slot rendered in the slideshow footer's middle column
|
|
2387
|
+
|
|
2388
|
+
## 21.3.2
|
|
2389
|
+
- fix(latlong-field): remove duplicated subscript reserved space under lat/long fields
|
|
@@ -14662,6 +14662,11 @@ class MatLatLongField {
|
|
|
14662
14662
|
get readonly() {
|
|
14663
14663
|
return this._readonly;
|
|
14664
14664
|
}
|
|
14665
|
+
/**
|
|
14666
|
+
* Subscript sizing of the HOST wrapper (the one rendering projected hints/errors).
|
|
14667
|
+
* NOTE: the inner <mat-form-field> is always forced to 'dynamic' (its subscript is always
|
|
14668
|
+
* empty) — changing this input only affects the space reserved around the host wrapper.
|
|
14669
|
+
*/
|
|
14665
14670
|
set subscriptSizing(value) {
|
|
14666
14671
|
this._subscriptSizing = value;
|
|
14667
14672
|
}
|
|
@@ -14764,7 +14769,7 @@ class MatLatLongField {
|
|
|
14764
14769
|
multi: true,
|
|
14765
14770
|
useExisting: forwardRef(() => MatLatLongField),
|
|
14766
14771
|
},
|
|
14767
|
-
], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<mat-form-field\n #formField\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"
|
|
14772
|
+
], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<!-- Errors and hints are rendered by this component's own subscript wrapper (below the form-field),\n so force 'dynamic' here: with the default 'fixed' sizing, the inner form-field would reserve\n an extra ~22px subscript line, making rows with lat/long fields taller than other rows\n (e.g. ObsMer operation form). -->\n<mat-form-field\n #formField\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"'dynamic'\"\n [class.mdc-text-field--invalid]=\"formControl.touched && formControl.invalid\"\n class=\"mat-latlong-field mat-latlong-field-{{ type }} {{ classList }}\"\n>\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n\n @if (floatLabel !== 'never' && placeholder | isNotNilOrBlank) {\n <mat-label>{{ placeholder }}</mat-label>\n }\n\n <mat-latlong-input\n #input\n [formControl]=\"formControl\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [type]=\"type\"\n [latLongPattern]=\"pattern\"\n [defaultSign]=\"defaultSign\"\n [maxDecimals]=\"maxDecimals\"\n [readonly]=\"readonly\"\n ></mat-latlong-input>\n\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n</mat-form-field>\n\n<!-- Do the same as MatFromField 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.invalid) {\n <!-- errors -->\n <div class=\"mat-mdc-form-field-error-wrapper\">\n @if (formControl.errors | mapKeys | arrayFirst; as errorKey) {\n <mat-error>\n {{ i18nErrorKeys | mapGet: errorKey | translate: (formControl.errors | mapGet: errorKey) }}\n </mat-error>\n } @else {\n <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n }\n </div>\n } @else {\n <!-- hints -->\n <mat-hint>\n <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n </mat-hint>\n }\n</div>\n\n<ng-template #matPrefixTemplate>\n <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n @if (clearable && !readonly) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"clearValue($event)\"\n [hidden]=\"formControl.value | isNil\"\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;width:100%;position:relative}\n"], dependencies: [{ kind: "directive", type: i4$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { 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: i9.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i6$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatLatLongFieldInput, selector: "mat-latlong-input", inputs: ["aria-describedby", "required", "disabled", "value", "defaultSign", "type", "latLongPattern", "maxDecimals", "readonly"] }, { kind: "pipe", type: ArrayFirstPipe, name: "arrayFirst" }, { kind: "pipe", type: MapGetPipe, name: "mapGet" }, { kind: "pipe", type: MapKeysPipe, name: "mapKeys" }, { kind: "pipe", type: IsNotNilOrBlankPipe, name: "isNotNilOrBlank" }, { kind: "pipe", type: IsNilPipe, name: "isNil" }, { kind: "pipe", type: AsFloatLabelTypePipe, name: "asFloatLabelType" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
14768
14773
|
}
|
|
14769
14774
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: MatLatLongField, decorators: [{
|
|
14770
14775
|
type: Component,
|
|
@@ -14774,7 +14779,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImpo
|
|
|
14774
14779
|
multi: true,
|
|
14775
14780
|
useExisting: forwardRef(() => MatLatLongField),
|
|
14776
14781
|
},
|
|
14777
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<mat-form-field\n #formField\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"
|
|
14782
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<!-- Errors and hints are rendered by this component's own subscript wrapper (below the form-field),\n so force 'dynamic' here: with the default 'fixed' sizing, the inner form-field would reserve\n an extra ~22px subscript line, making rows with lat/long fields taller than other rows\n (e.g. ObsMer operation form). -->\n<mat-form-field\n #formField\n [floatLabel]=\"floatLabel | asFloatLabelType\"\n [appearance]=\"appearance\"\n [subscriptSizing]=\"'dynamic'\"\n [class.mdc-text-field--invalid]=\"formControl.touched && formControl.invalid\"\n class=\"mat-latlong-field mat-latlong-field-{{ type }} {{ classList }}\"\n>\n <div matPrefix>\n <ng-container *ngTemplateOutlet=\"matPrefixTemplate\"></ng-container>\n </div>\n\n @if (floatLabel !== 'never' && placeholder | isNotNilOrBlank) {\n <mat-label>{{ placeholder }}</mat-label>\n }\n\n <mat-latlong-input\n #input\n [formControl]=\"formControl\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [type]=\"type\"\n [latLongPattern]=\"pattern\"\n [defaultSign]=\"defaultSign\"\n [maxDecimals]=\"maxDecimals\"\n [readonly]=\"readonly\"\n ></mat-latlong-input>\n\n <div matSuffix>\n <ng-container *ngTemplateOutlet=\"matSuffixTemplate\"></ng-container>\n </div>\n</mat-form-field>\n\n<!-- Do the same as MatFromField 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.invalid) {\n <!-- errors -->\n <div class=\"mat-mdc-form-field-error-wrapper\">\n @if (formControl.errors | mapKeys | arrayFirst; as errorKey) {\n <mat-error>\n {{ i18nErrorKeys | mapGet: errorKey | translate: (formControl.errors | mapGet: errorKey) }}\n </mat-error>\n } @else {\n <ng-container *ngTemplateOutlet=\"matErrorTemplate\"></ng-container>\n }\n </div>\n } @else {\n <!-- hints -->\n <mat-hint>\n <ng-container *ngTemplateOutlet=\"matHintTemplate\"></ng-container>\n </mat-hint>\n }\n</div>\n\n<ng-template #matPrefixTemplate>\n <ng-content select=\"[matPrefix]\"></ng-content>\n</ng-template>\n\n<ng-template #matSuffixTemplate>\n @if (clearable && !readonly) {\n <button\n matSuffix\n mat-icon-button\n tabindex=\"-1\"\n type=\"button\"\n (click)=\"clearValue($event)\"\n [hidden]=\"formControl.value | isNil\"\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;width:100%;position:relative}\n"] }]
|
|
14778
14783
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.FormGroupDirective, decorators: [{
|
|
14779
14784
|
type: Optional
|
|
14780
14785
|
}] }, { type: undefined, decorators: [{
|