@recursyve/nice-ui-kit.v2 14.0.0-beta.132 → 14.0.0-beta.134
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/esm2020/lib/components/assets-carousel/assets-carousel.component.mjs +3 -3
- package/esm2020/lib/components/async-typeahead/async-typeahead.component.mjs +23 -12
- package/esm2020/lib/components/async-typeahead/providers/async-typeahead.service.mjs +22 -12
- package/esm2020/lib/components/translation-form/components/translation-form.component.mjs +5 -3
- package/fesm2015/recursyve-nice-ui-kit.v2.mjs +71 -51
- package/fesm2015/recursyve-nice-ui-kit.v2.mjs.map +1 -1
- package/fesm2020/recursyve-nice-ui-kit.v2.mjs +49 -26
- package/fesm2020/recursyve-nice-ui-kit.v2.mjs.map +1 -1
- package/lib/components/async-typeahead/async-typeahead.component.d.ts +4 -2
- package/lib/components/async-typeahead/providers/async-typeahead.service.d.ts +8 -5
- package/package.json +1 -1
|
@@ -1958,7 +1958,7 @@ NiceAssetsCarouselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.
|
|
|
1958
1958
|
useExisting: forwardRef(() => NiceAssetsCarouselComponent),
|
|
1959
1959
|
multi: true
|
|
1960
1960
|
}
|
|
1961
|
-
], queries: [{ propertyName: "activeContent", first: true, predicate: NiceAssetsCarouselActiveContentDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["fileInput"], descendants: true }, { propertyName: "activeVideoElement", first: true, predicate: ["activeVideo"], descendants: true }, { propertyName: "assetsElement", predicate: ["assets"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"carousel-container\" niceDropzone (filesDropped)=\"onFilesDrop($event)\">\n <div\n class=\"active-image\"\n matRipple\n [class.empty-state]=\"!_activeAsset\"\n (click)=\"edit && fileInput.click();\n $event.stopPropagation()\"\n >\n <div *ngIf=\"loading\" class=\"flex flex-row justify-center items-center h-full\">\n <mat-spinner [diameter]=\"32\"></mat-spinner>\n </div>\n <ng-container *ngIf=\"!loading\">\n <ng-container\n *ngIf=\"_activeAsset && activeContent\"\n [ngTemplateOutlet]=\"activeContent\"\n [ngTemplateOutletContext]=\"{ $implicit: _activeAsset}\"\n ></ng-container>\n <img\n *ngIf=\"_activeAsset?.type === 'image'\"\n (mouseover)=\"showOverlay=true\"\n [src]=\"_activeAsset.url ?? _activeAsset.base64\"\n draggable=\"false\"\n class=\"relative\"\n alt=\"active-image\"\n >\n <video #activeVideo *ngIf=\"_activeAsset?.type === 'video'\" draggable=\"false\" loop [src]=\"_activeAsset.url ?? _activeAsset.base64\"></video>\n\n <div class=\"empty-state-content\" *ngIf=\"!_activeAsset\">\n <mat-icon *ngIf=\"options.upload.matIcon\">{{ options.upload.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.upload.svgIcon\" [svgIcon]=\"options.upload.svgIcon\"></mat-icon>\n <div class=\"text\">\n {{ \"nice_ui_kit.assets_carousel.upload_here\" | translate }}\n </div>\n </div>\n\n <div *ngIf=\"_activeAsset && showOverlay && edit\" class=\"active-image-overlay\">\n <div\n (mouseout)=\"showOverlay=false\"\n class=\"flex flex-col justify-center items-center w-full h-full\"\n >\n <mat-icon *ngIf=\"options.upload.matIcon\">{{ options.upload.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.upload.svgIcon\" [svgIcon]=\"options.upload.svgIcon\"></mat-icon>\n </div>\n </div>\n\n <div *ngIf=\"edit\" class=\"active-buttons\">\n <button mat-icon-button (click)=\"fileInput.click(); $event.stopPropagation()\">\n <mat-icon *ngIf=\"options.actionButtons.addPhoto.matIcon\">{{ options.actionButtons.addPhoto.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.addPhoto.svgIcon\" [svgIcon]=\"options.actionButtons.addPhoto.svgIcon\"></mat-icon>\n </button>\n <button mat-icon-button [matMenuTriggerFor]=\"assetActions\" (click)=\"$event.stopPropagation()\" [disabled]=\"!_activeAsset\">\n <mat-icon *ngIf=\"options.actionButtons.moreOptions.matIcon\">{{ options.actionButtons.moreOptions.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.moreOptions.svgIcon\" [svgIcon]=\"options.actionButtons.moreOptions.svgIcon\"></mat-icon>\n </button>\n <mat-menu class=\"nice-asset-options-menu\" [xPosition]=\"'before'\" #assetActions=\"matMenu\">\n <button\n mat-menu-item\n *ngFor=\"let action of customActions\"\n (click)=\"clickCustom(action)\"\n >\n <mat-icon *ngIf=\"action.icon.matIcon\">{{ action.icon.matIcon }}</mat-icon>\n <mat-icon [svgIcon]=\"action.icon.svgIcon\" *ngIf=\"action.icon.svgIcon\"></mat-icon>\n <span>{{ action.name | translate }}</span>\n </button>\n <button mat-menu-item (click)=\"clickRemove()\">\n <mat-icon *ngIf=\"options.actionButtons.remove.matIcon\">{{ options.actionButtons.remove.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.remove.svgIcon\" [svgIcon]=\"options.actionButtons.remove.svgIcon\"></mat-icon>\n <span>{{ \"nice_ui_kit.assets_carousel.delete\" | translate }}</span>\n </button>\n </mat-menu>\n </div>\n </ng-container>\n </div>\n\n <div class=\"carousel\">\n <button *ngIf=\"showAddAssetContainer || _activeAsset\" class=\"action-button left-arrow\" mat-icon-button [disabled]=\"!_active\" (click)=\"clickLeft()\">\n <mat-icon *ngIf=\"options.leftArrow.matIcon\">{{ options.leftArrow.matIcon }}</mat-icon>\n <mat-icon class=\"arrows\" *ngIf=\"options.leftArrow.svgIcon\" [svgIcon]=\"options.leftArrow.svgIcon\"></mat-icon>\n </button>\n <div class=\"asset-list-container\">\n <div *ngIf=\"showAddAssetContainer && edit\" class=\"add-asset-container\">\n <div class=\"add-asset\" matRipple (click)=\"fileInput.click()\">\n <mat-icon *ngIf=\"options.addPhoto.matIcon\">{{ options.addPhoto.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.addPhoto.svgIcon\" [svgIcon]=\"options.addPhoto.svgIcon\"></mat-icon>\n </div>\n </div>\n <div class=\"asset-list\" [ngStyle]=\"listStyle\">\n <div\n #assets\n class=\"asset\"\n *ngFor=\"let asset of _assets; let i = index\"\n (click)=\"clickAsset(i)\"\n [ngClass]=\"color\"\n [class.active]=\"_active === i\"\n >\n <ng-container>\n <img\n *ngIf=\"asset.type === 'image'\"\n draggable=\"false\"\n [src]=\"asset.url ?? asset.base64\"\n alt=\"add-image\"\n />\n <video\n *ngIf=\"asset.type === 'video'\"\n draggable=\"false\"\n loop\n [src]=\"asset.url ?? asset.base64\"\n ></video>\n </ng-container>\n </div>\n </div>\n </div>\n <button *ngIf=\"showAddAssetContainer || _activeAsset\" class=\"action-button right-arrow\" mat-icon-button [disabled]=\"_lastAsset\" (click)=\"clickRight()\">\n <mat-icon *ngIf=\"options.rightArrow.matIcon\">{{ options.rightArrow.matIcon }}</mat-icon>\n <mat-icon class=\"arrows\" *ngIf=\"options.rightArrow.svgIcon\" [svgIcon]=\"options.rightArrow.svgIcon\"></mat-icon>\n </button>\n </div>\n</div>\n\n<input #fileInput type=\"file\" hidden [accept]=\"accept\" (change)=\"onFilesChange($event)\" [multiple]=\"multipleUpload\">\n", styles: [":root{--nice-assets-carousel-asset-width: 90px;--nice-assets-carousel-asset-height: 60px;--nice-assets-carousel-asset-gap: .75rem}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i2$1.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "directive", type: NiceDropzoneDirective, selector: "[niceDropzone]", outputs: ["filesDropped"] }, { kind: "component", type: i1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], animations: niceAnimations, encapsulation: i0.ViewEncapsulation.None });
|
|
1961
|
+
], queries: [{ propertyName: "activeContent", first: true, predicate: NiceAssetsCarouselActiveContentDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["fileInput"], descendants: true }, { propertyName: "activeVideoElement", first: true, predicate: ["activeVideo"], descendants: true }, { propertyName: "assetsElement", predicate: ["assets"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"carousel-container\" niceDropzone (filesDropped)=\"onFilesDrop($event)\">\n <div\n class=\"active-image\"\n matRipple\n [class.empty-state]=\"!_activeAsset\"\n (click)=\"edit && fileInput.click();\n $event.stopPropagation()\"\n >\n <div *ngIf=\"loading\" style=\"min-height: inherit\" class=\"flex flex-row justify-center items-center h-full\">\n <mat-spinner [diameter]=\"32\"></mat-spinner>\n </div>\n <ng-container *ngIf=\"!loading\">\n <ng-container\n *ngIf=\"_activeAsset && activeContent\"\n [ngTemplateOutlet]=\"activeContent\"\n [ngTemplateOutletContext]=\"{ $implicit: _activeAsset}\"\n ></ng-container>\n <img\n *ngIf=\"_activeAsset?.type === 'image'\"\n (mouseover)=\"showOverlay=true\"\n [src]=\"_activeAsset.url ?? _activeAsset.base64\"\n draggable=\"false\"\n class=\"relative\"\n alt=\"active-image\"\n >\n <video #activeVideo *ngIf=\"_activeAsset?.type === 'video'\" draggable=\"false\" loop [src]=\"_activeAsset.url ?? _activeAsset.base64\"></video>\n\n <div class=\"empty-state-content\" *ngIf=\"!_activeAsset\">\n <mat-icon *ngIf=\"options.upload.matIcon\">{{ options.upload.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.upload.svgIcon\" [svgIcon]=\"options.upload.svgIcon\"></mat-icon>\n <div class=\"text\">\n {{ \"nice_ui_kit.assets_carousel.upload_here\" | translate }}\n </div>\n </div>\n\n <div *ngIf=\"_activeAsset && showOverlay && edit\" class=\"active-image-overlay\">\n <div\n (mouseout)=\"showOverlay=false\"\n class=\"flex flex-col justify-center items-center w-full h-full\"\n >\n <mat-icon *ngIf=\"options.upload.matIcon\">{{ options.upload.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.upload.svgIcon\" [svgIcon]=\"options.upload.svgIcon\"></mat-icon>\n </div>\n </div>\n\n <div *ngIf=\"edit\" class=\"active-buttons\">\n <button mat-icon-button (click)=\"fileInput.click(); $event.stopPropagation()\">\n <mat-icon *ngIf=\"options.actionButtons.addPhoto.matIcon\">{{ options.actionButtons.addPhoto.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.addPhoto.svgIcon\" [svgIcon]=\"options.actionButtons.addPhoto.svgIcon\"></mat-icon>\n </button>\n <button mat-icon-button [matMenuTriggerFor]=\"assetActions\" (click)=\"$event.stopPropagation()\" [disabled]=\"!_activeAsset\">\n <mat-icon *ngIf=\"options.actionButtons.moreOptions.matIcon\">{{ options.actionButtons.moreOptions.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.moreOptions.svgIcon\" [svgIcon]=\"options.actionButtons.moreOptions.svgIcon\"></mat-icon>\n </button>\n <mat-menu class=\"nice-asset-options-menu\" [xPosition]=\"'before'\" #assetActions=\"matMenu\">\n <button\n mat-menu-item\n *ngFor=\"let action of customActions\"\n (click)=\"clickCustom(action)\"\n >\n <mat-icon *ngIf=\"action.icon.matIcon\">{{ action.icon.matIcon }}</mat-icon>\n <mat-icon [svgIcon]=\"action.icon.svgIcon\" *ngIf=\"action.icon.svgIcon\"></mat-icon>\n <span>{{ action.name | translate }}</span>\n </button>\n <button mat-menu-item (click)=\"clickRemove()\">\n <mat-icon *ngIf=\"options.actionButtons.remove.matIcon\">{{ options.actionButtons.remove.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.remove.svgIcon\" [svgIcon]=\"options.actionButtons.remove.svgIcon\"></mat-icon>\n <span>{{ \"nice_ui_kit.assets_carousel.delete\" | translate }}</span>\n </button>\n </mat-menu>\n </div>\n </ng-container>\n </div>\n\n <div class=\"carousel\">\n <button *ngIf=\"showAddAssetContainer || _activeAsset\" class=\"action-button left-arrow\" mat-icon-button [disabled]=\"!_active\" (click)=\"clickLeft()\">\n <mat-icon *ngIf=\"options.leftArrow.matIcon\">{{ options.leftArrow.matIcon }}</mat-icon>\n <mat-icon class=\"arrows\" *ngIf=\"options.leftArrow.svgIcon\" [svgIcon]=\"options.leftArrow.svgIcon\"></mat-icon>\n </button>\n <div class=\"asset-list-container\">\n <div *ngIf=\"showAddAssetContainer && edit\" class=\"add-asset-container\">\n <div class=\"add-asset\" matRipple (click)=\"fileInput.click()\">\n <mat-icon *ngIf=\"options.addPhoto.matIcon\">{{ options.addPhoto.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.addPhoto.svgIcon\" [svgIcon]=\"options.addPhoto.svgIcon\"></mat-icon>\n </div>\n </div>\n <div class=\"asset-list\" [ngStyle]=\"listStyle\">\n <div\n #assets\n class=\"asset\"\n *ngFor=\"let asset of _assets; let i = index\"\n (click)=\"clickAsset(i)\"\n [ngClass]=\"color\"\n [class.active]=\"_active === i\"\n >\n <ng-container>\n <img\n *ngIf=\"asset.type === 'image'\"\n draggable=\"false\"\n [src]=\"asset.url ?? asset.base64\"\n alt=\"add-image\"\n />\n <video\n *ngIf=\"asset.type === 'video'\"\n draggable=\"false\"\n loop\n [src]=\"asset.url ?? asset.base64\"\n ></video>\n </ng-container>\n </div>\n </div>\n </div>\n <button *ngIf=\"showAddAssetContainer || _activeAsset\" class=\"action-button right-arrow\" mat-icon-button [disabled]=\"_lastAsset\" (click)=\"clickRight()\">\n <mat-icon *ngIf=\"options.rightArrow.matIcon\">{{ options.rightArrow.matIcon }}</mat-icon>\n <mat-icon class=\"arrows\" *ngIf=\"options.rightArrow.svgIcon\" [svgIcon]=\"options.rightArrow.svgIcon\"></mat-icon>\n </button>\n </div>\n</div>\n\n<input #fileInput type=\"file\" hidden [accept]=\"accept\" (change)=\"onFilesChange($event)\" [multiple]=\"multipleUpload\">\n", styles: [":root{--nice-assets-carousel-asset-width: 90px;--nice-assets-carousel-asset-height: 60px;--nice-assets-carousel-asset-gap: .75rem}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i2$1.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "directive", type: NiceDropzoneDirective, selector: "[niceDropzone]", outputs: ["filesDropped"] }, { kind: "component", type: i1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], animations: niceAnimations, encapsulation: i0.ViewEncapsulation.None });
|
|
1962
1962
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.3", ngImport: i0, type: NiceAssetsCarouselComponent, decorators: [{
|
|
1963
1963
|
type: Component,
|
|
1964
1964
|
args: [{ selector: "nice-assets-carousel", encapsulation: ViewEncapsulation.None, animations: niceAnimations, providers: [
|
|
@@ -1967,7 +1967,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.3", ngImpor
|
|
|
1967
1967
|
useExisting: forwardRef(() => NiceAssetsCarouselComponent),
|
|
1968
1968
|
multi: true
|
|
1969
1969
|
}
|
|
1970
|
-
], template: "<div class=\"carousel-container\" niceDropzone (filesDropped)=\"onFilesDrop($event)\">\n <div\n class=\"active-image\"\n matRipple\n [class.empty-state]=\"!_activeAsset\"\n (click)=\"edit && fileInput.click();\n $event.stopPropagation()\"\n >\n <div *ngIf=\"loading\" class=\"flex flex-row justify-center items-center h-full\">\n <mat-spinner [diameter]=\"32\"></mat-spinner>\n </div>\n <ng-container *ngIf=\"!loading\">\n <ng-container\n *ngIf=\"_activeAsset && activeContent\"\n [ngTemplateOutlet]=\"activeContent\"\n [ngTemplateOutletContext]=\"{ $implicit: _activeAsset}\"\n ></ng-container>\n <img\n *ngIf=\"_activeAsset?.type === 'image'\"\n (mouseover)=\"showOverlay=true\"\n [src]=\"_activeAsset.url ?? _activeAsset.base64\"\n draggable=\"false\"\n class=\"relative\"\n alt=\"active-image\"\n >\n <video #activeVideo *ngIf=\"_activeAsset?.type === 'video'\" draggable=\"false\" loop [src]=\"_activeAsset.url ?? _activeAsset.base64\"></video>\n\n <div class=\"empty-state-content\" *ngIf=\"!_activeAsset\">\n <mat-icon *ngIf=\"options.upload.matIcon\">{{ options.upload.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.upload.svgIcon\" [svgIcon]=\"options.upload.svgIcon\"></mat-icon>\n <div class=\"text\">\n {{ \"nice_ui_kit.assets_carousel.upload_here\" | translate }}\n </div>\n </div>\n\n <div *ngIf=\"_activeAsset && showOverlay && edit\" class=\"active-image-overlay\">\n <div\n (mouseout)=\"showOverlay=false\"\n class=\"flex flex-col justify-center items-center w-full h-full\"\n >\n <mat-icon *ngIf=\"options.upload.matIcon\">{{ options.upload.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.upload.svgIcon\" [svgIcon]=\"options.upload.svgIcon\"></mat-icon>\n </div>\n </div>\n\n <div *ngIf=\"edit\" class=\"active-buttons\">\n <button mat-icon-button (click)=\"fileInput.click(); $event.stopPropagation()\">\n <mat-icon *ngIf=\"options.actionButtons.addPhoto.matIcon\">{{ options.actionButtons.addPhoto.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.addPhoto.svgIcon\" [svgIcon]=\"options.actionButtons.addPhoto.svgIcon\"></mat-icon>\n </button>\n <button mat-icon-button [matMenuTriggerFor]=\"assetActions\" (click)=\"$event.stopPropagation()\" [disabled]=\"!_activeAsset\">\n <mat-icon *ngIf=\"options.actionButtons.moreOptions.matIcon\">{{ options.actionButtons.moreOptions.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.moreOptions.svgIcon\" [svgIcon]=\"options.actionButtons.moreOptions.svgIcon\"></mat-icon>\n </button>\n <mat-menu class=\"nice-asset-options-menu\" [xPosition]=\"'before'\" #assetActions=\"matMenu\">\n <button\n mat-menu-item\n *ngFor=\"let action of customActions\"\n (click)=\"clickCustom(action)\"\n >\n <mat-icon *ngIf=\"action.icon.matIcon\">{{ action.icon.matIcon }}</mat-icon>\n <mat-icon [svgIcon]=\"action.icon.svgIcon\" *ngIf=\"action.icon.svgIcon\"></mat-icon>\n <span>{{ action.name | translate }}</span>\n </button>\n <button mat-menu-item (click)=\"clickRemove()\">\n <mat-icon *ngIf=\"options.actionButtons.remove.matIcon\">{{ options.actionButtons.remove.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.remove.svgIcon\" [svgIcon]=\"options.actionButtons.remove.svgIcon\"></mat-icon>\n <span>{{ \"nice_ui_kit.assets_carousel.delete\" | translate }}</span>\n </button>\n </mat-menu>\n </div>\n </ng-container>\n </div>\n\n <div class=\"carousel\">\n <button *ngIf=\"showAddAssetContainer || _activeAsset\" class=\"action-button left-arrow\" mat-icon-button [disabled]=\"!_active\" (click)=\"clickLeft()\">\n <mat-icon *ngIf=\"options.leftArrow.matIcon\">{{ options.leftArrow.matIcon }}</mat-icon>\n <mat-icon class=\"arrows\" *ngIf=\"options.leftArrow.svgIcon\" [svgIcon]=\"options.leftArrow.svgIcon\"></mat-icon>\n </button>\n <div class=\"asset-list-container\">\n <div *ngIf=\"showAddAssetContainer && edit\" class=\"add-asset-container\">\n <div class=\"add-asset\" matRipple (click)=\"fileInput.click()\">\n <mat-icon *ngIf=\"options.addPhoto.matIcon\">{{ options.addPhoto.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.addPhoto.svgIcon\" [svgIcon]=\"options.addPhoto.svgIcon\"></mat-icon>\n </div>\n </div>\n <div class=\"asset-list\" [ngStyle]=\"listStyle\">\n <div\n #assets\n class=\"asset\"\n *ngFor=\"let asset of _assets; let i = index\"\n (click)=\"clickAsset(i)\"\n [ngClass]=\"color\"\n [class.active]=\"_active === i\"\n >\n <ng-container>\n <img\n *ngIf=\"asset.type === 'image'\"\n draggable=\"false\"\n [src]=\"asset.url ?? asset.base64\"\n alt=\"add-image\"\n />\n <video\n *ngIf=\"asset.type === 'video'\"\n draggable=\"false\"\n loop\n [src]=\"asset.url ?? asset.base64\"\n ></video>\n </ng-container>\n </div>\n </div>\n </div>\n <button *ngIf=\"showAddAssetContainer || _activeAsset\" class=\"action-button right-arrow\" mat-icon-button [disabled]=\"_lastAsset\" (click)=\"clickRight()\">\n <mat-icon *ngIf=\"options.rightArrow.matIcon\">{{ options.rightArrow.matIcon }}</mat-icon>\n <mat-icon class=\"arrows\" *ngIf=\"options.rightArrow.svgIcon\" [svgIcon]=\"options.rightArrow.svgIcon\"></mat-icon>\n </button>\n </div>\n</div>\n\n<input #fileInput type=\"file\" hidden [accept]=\"accept\" (change)=\"onFilesChange($event)\" [multiple]=\"multipleUpload\">\n", styles: [":root{--nice-assets-carousel-asset-width: 90px;--nice-assets-carousel-asset-height: 60px;--nice-assets-carousel-asset-gap: .75rem}\n"] }]
|
|
1970
|
+
], template: "<div class=\"carousel-container\" niceDropzone (filesDropped)=\"onFilesDrop($event)\">\n <div\n class=\"active-image\"\n matRipple\n [class.empty-state]=\"!_activeAsset\"\n (click)=\"edit && fileInput.click();\n $event.stopPropagation()\"\n >\n <div *ngIf=\"loading\" style=\"min-height: inherit\" class=\"flex flex-row justify-center items-center h-full\">\n <mat-spinner [diameter]=\"32\"></mat-spinner>\n </div>\n <ng-container *ngIf=\"!loading\">\n <ng-container\n *ngIf=\"_activeAsset && activeContent\"\n [ngTemplateOutlet]=\"activeContent\"\n [ngTemplateOutletContext]=\"{ $implicit: _activeAsset}\"\n ></ng-container>\n <img\n *ngIf=\"_activeAsset?.type === 'image'\"\n (mouseover)=\"showOverlay=true\"\n [src]=\"_activeAsset.url ?? _activeAsset.base64\"\n draggable=\"false\"\n class=\"relative\"\n alt=\"active-image\"\n >\n <video #activeVideo *ngIf=\"_activeAsset?.type === 'video'\" draggable=\"false\" loop [src]=\"_activeAsset.url ?? _activeAsset.base64\"></video>\n\n <div class=\"empty-state-content\" *ngIf=\"!_activeAsset\">\n <mat-icon *ngIf=\"options.upload.matIcon\">{{ options.upload.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.upload.svgIcon\" [svgIcon]=\"options.upload.svgIcon\"></mat-icon>\n <div class=\"text\">\n {{ \"nice_ui_kit.assets_carousel.upload_here\" | translate }}\n </div>\n </div>\n\n <div *ngIf=\"_activeAsset && showOverlay && edit\" class=\"active-image-overlay\">\n <div\n (mouseout)=\"showOverlay=false\"\n class=\"flex flex-col justify-center items-center w-full h-full\"\n >\n <mat-icon *ngIf=\"options.upload.matIcon\">{{ options.upload.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.upload.svgIcon\" [svgIcon]=\"options.upload.svgIcon\"></mat-icon>\n </div>\n </div>\n\n <div *ngIf=\"edit\" class=\"active-buttons\">\n <button mat-icon-button (click)=\"fileInput.click(); $event.stopPropagation()\">\n <mat-icon *ngIf=\"options.actionButtons.addPhoto.matIcon\">{{ options.actionButtons.addPhoto.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.addPhoto.svgIcon\" [svgIcon]=\"options.actionButtons.addPhoto.svgIcon\"></mat-icon>\n </button>\n <button mat-icon-button [matMenuTriggerFor]=\"assetActions\" (click)=\"$event.stopPropagation()\" [disabled]=\"!_activeAsset\">\n <mat-icon *ngIf=\"options.actionButtons.moreOptions.matIcon\">{{ options.actionButtons.moreOptions.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.moreOptions.svgIcon\" [svgIcon]=\"options.actionButtons.moreOptions.svgIcon\"></mat-icon>\n </button>\n <mat-menu class=\"nice-asset-options-menu\" [xPosition]=\"'before'\" #assetActions=\"matMenu\">\n <button\n mat-menu-item\n *ngFor=\"let action of customActions\"\n (click)=\"clickCustom(action)\"\n >\n <mat-icon *ngIf=\"action.icon.matIcon\">{{ action.icon.matIcon }}</mat-icon>\n <mat-icon [svgIcon]=\"action.icon.svgIcon\" *ngIf=\"action.icon.svgIcon\"></mat-icon>\n <span>{{ action.name | translate }}</span>\n </button>\n <button mat-menu-item (click)=\"clickRemove()\">\n <mat-icon *ngIf=\"options.actionButtons.remove.matIcon\">{{ options.actionButtons.remove.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.actionButtons.remove.svgIcon\" [svgIcon]=\"options.actionButtons.remove.svgIcon\"></mat-icon>\n <span>{{ \"nice_ui_kit.assets_carousel.delete\" | translate }}</span>\n </button>\n </mat-menu>\n </div>\n </ng-container>\n </div>\n\n <div class=\"carousel\">\n <button *ngIf=\"showAddAssetContainer || _activeAsset\" class=\"action-button left-arrow\" mat-icon-button [disabled]=\"!_active\" (click)=\"clickLeft()\">\n <mat-icon *ngIf=\"options.leftArrow.matIcon\">{{ options.leftArrow.matIcon }}</mat-icon>\n <mat-icon class=\"arrows\" *ngIf=\"options.leftArrow.svgIcon\" [svgIcon]=\"options.leftArrow.svgIcon\"></mat-icon>\n </button>\n <div class=\"asset-list-container\">\n <div *ngIf=\"showAddAssetContainer && edit\" class=\"add-asset-container\">\n <div class=\"add-asset\" matRipple (click)=\"fileInput.click()\">\n <mat-icon *ngIf=\"options.addPhoto.matIcon\">{{ options.addPhoto.matIcon }}</mat-icon>\n <mat-icon *ngIf=\"options.addPhoto.svgIcon\" [svgIcon]=\"options.addPhoto.svgIcon\"></mat-icon>\n </div>\n </div>\n <div class=\"asset-list\" [ngStyle]=\"listStyle\">\n <div\n #assets\n class=\"asset\"\n *ngFor=\"let asset of _assets; let i = index\"\n (click)=\"clickAsset(i)\"\n [ngClass]=\"color\"\n [class.active]=\"_active === i\"\n >\n <ng-container>\n <img\n *ngIf=\"asset.type === 'image'\"\n draggable=\"false\"\n [src]=\"asset.url ?? asset.base64\"\n alt=\"add-image\"\n />\n <video\n *ngIf=\"asset.type === 'video'\"\n draggable=\"false\"\n loop\n [src]=\"asset.url ?? asset.base64\"\n ></video>\n </ng-container>\n </div>\n </div>\n </div>\n <button *ngIf=\"showAddAssetContainer || _activeAsset\" class=\"action-button right-arrow\" mat-icon-button [disabled]=\"_lastAsset\" (click)=\"clickRight()\">\n <mat-icon *ngIf=\"options.rightArrow.matIcon\">{{ options.rightArrow.matIcon }}</mat-icon>\n <mat-icon class=\"arrows\" *ngIf=\"options.rightArrow.svgIcon\" [svgIcon]=\"options.rightArrow.svgIcon\"></mat-icon>\n </button>\n </div>\n</div>\n\n<input #fileInput type=\"file\" hidden [accept]=\"accept\" (change)=\"onFilesChange($event)\" [multiple]=\"multipleUpload\">\n", styles: [":root{--nice-assets-carousel-asset-width: 90px;--nice-assets-carousel-asset-height: 60px;--nice-assets-carousel-asset-gap: .75rem}\n"] }]
|
|
1971
1971
|
}], ctorParameters: function () {
|
|
1972
1972
|
return [{ type: undefined, decorators: [{
|
|
1973
1973
|
type: Optional
|
|
@@ -2735,13 +2735,13 @@ class NiceAsyncTypeaheadService {
|
|
|
2735
2735
|
var _a;
|
|
2736
2736
|
(_a = this.requestsSubscription$) === null || _a === void 0 ? void 0 : _a.unsubscribe();
|
|
2737
2737
|
}
|
|
2738
|
-
initialize(resource
|
|
2738
|
+
initialize(resource) {
|
|
2739
2739
|
return __awaiter(this, void 0, void 0, function* () {
|
|
2740
2740
|
const { initialized } = this.state$.getValue();
|
|
2741
2741
|
if (initialized) {
|
|
2742
2742
|
return;
|
|
2743
2743
|
}
|
|
2744
|
-
return this.search(resource, ""
|
|
2744
|
+
return this.search(resource, "");
|
|
2745
2745
|
});
|
|
2746
2746
|
}
|
|
2747
2747
|
sendRequest(request) {
|
|
@@ -2773,15 +2773,15 @@ class NiceAsyncTypeaheadService {
|
|
|
2773
2773
|
this.state$.next(Object.assign(Object.assign({}, this.state$.value), { loading: false, loadingPage: false }));
|
|
2774
2774
|
}));
|
|
2775
2775
|
}
|
|
2776
|
-
search(resource, searchQuery
|
|
2776
|
+
search(resource, searchQuery) {
|
|
2777
2777
|
this.requests$.next({
|
|
2778
2778
|
resource,
|
|
2779
2779
|
searchQuery,
|
|
2780
|
-
searchOptions:
|
|
2780
|
+
searchOptions: this.getSearchOptions(),
|
|
2781
2781
|
page: 0
|
|
2782
2782
|
});
|
|
2783
2783
|
}
|
|
2784
|
-
loadMore(resource
|
|
2784
|
+
loadMore(resource) {
|
|
2785
2785
|
const { loadingPage, isLastPage } = this.state$.getValue();
|
|
2786
2786
|
if (loadingPage || isLastPage) {
|
|
2787
2787
|
return;
|
|
@@ -2791,7 +2791,7 @@ class NiceAsyncTypeaheadService {
|
|
|
2791
2791
|
resource,
|
|
2792
2792
|
page,
|
|
2793
2793
|
searchQuery,
|
|
2794
|
-
searchOptions:
|
|
2794
|
+
searchOptions: this.getSearchOptions(),
|
|
2795
2795
|
});
|
|
2796
2796
|
}
|
|
2797
2797
|
getActive() {
|
|
@@ -2800,10 +2800,16 @@ class NiceAsyncTypeaheadService {
|
|
|
2800
2800
|
getInitialized() {
|
|
2801
2801
|
return this.state$.value.initialized;
|
|
2802
2802
|
}
|
|
2803
|
+
getSearchOptions() {
|
|
2804
|
+
return this.state$.value.searchOptions;
|
|
2805
|
+
}
|
|
2806
|
+
setSearchOptions(searchOptions) {
|
|
2807
|
+
this.state$.next(Object.assign(Object.assign({}, this.state$.value), { searchOptions }));
|
|
2808
|
+
}
|
|
2803
2809
|
setActive(entity) {
|
|
2804
2810
|
this.state$.next(Object.assign(Object.assign({}, this.state$.value), { active: entity !== null && entity !== void 0 ? entity : null }));
|
|
2805
2811
|
}
|
|
2806
|
-
setActiveId(resource, id
|
|
2812
|
+
setActiveId(resource, id) {
|
|
2807
2813
|
return __awaiter(this, void 0, void 0, function* () {
|
|
2808
2814
|
if (!id) {
|
|
2809
2815
|
return;
|
|
@@ -2819,21 +2825,22 @@ class NiceAsyncTypeaheadService {
|
|
|
2819
2825
|
this.state$.next(Object.assign(Object.assign({}, this.state$.value), { items: [localItem], active: localItem, page: 0, isLastPage: false }));
|
|
2820
2826
|
return;
|
|
2821
2827
|
}
|
|
2822
|
-
const entity = yield api.getById(id,
|
|
2828
|
+
const entity = yield api.getById(id, this.getSearchOptions());
|
|
2823
2829
|
if (!entity) {
|
|
2824
2830
|
return;
|
|
2825
2831
|
}
|
|
2826
2832
|
this.state$.next(Object.assign(Object.assign({}, this.state$.value), { items: [entity], active: entity, page: 0, isLastPage: false }));
|
|
2827
2833
|
}
|
|
2828
|
-
catch (_a) {
|
|
2834
|
+
catch (_a) {
|
|
2835
|
+
}
|
|
2829
2836
|
finally {
|
|
2830
2837
|
this.state$.next(Object.assign(Object.assign({}, this.state$.value), { loading: false }));
|
|
2831
2838
|
}
|
|
2832
2839
|
});
|
|
2833
2840
|
}
|
|
2834
|
-
reloadActive(resource
|
|
2841
|
+
reloadActive(resource) {
|
|
2835
2842
|
var _a;
|
|
2836
|
-
return this.setActiveId(resource, (_a = this.state$.value.active) === null || _a === void 0 ? void 0 : _a.id
|
|
2843
|
+
return this.setActiveId(resource, (_a = this.state$.value.active) === null || _a === void 0 ? void 0 : _a.id);
|
|
2837
2844
|
}
|
|
2838
2845
|
reloadFilteredItems() {
|
|
2839
2846
|
// TODO: Use a better way to trigger the items$ observable
|
|
@@ -2915,6 +2922,7 @@ class NiceAsyncTypeaheadComponent extends _BaseAsyncTypeaheadComponent {
|
|
|
2915
2922
|
this._disabled = false;
|
|
2916
2923
|
this.id = uuid.v4();
|
|
2917
2924
|
this.describedBy = "";
|
|
2925
|
+
this.componentInitialized = false;
|
|
2918
2926
|
this.propagate = () => { };
|
|
2919
2927
|
if (this.ngControl) {
|
|
2920
2928
|
this.ngControl.valueAccessor = this;
|
|
@@ -2985,35 +2993,41 @@ class NiceAsyncTypeaheadComponent extends _BaseAsyncTypeaheadComponent {
|
|
|
2985
2993
|
return this.service.getInitialized();
|
|
2986
2994
|
}
|
|
2987
2995
|
ngOnInit() {
|
|
2988
|
-
this
|
|
2989
|
-
|
|
2990
|
-
if (this.ngControl
|
|
2991
|
-
this.
|
|
2992
|
-
}
|
|
2993
|
-
this.ngControl.statusChanges.subscribe((status) => {
|
|
2994
|
-
this.disabled = status === "DISABLED";
|
|
2995
|
-
if (this._disabled) {
|
|
2996
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
2997
|
+
this.service.listenForRequest();
|
|
2998
|
+
if (this.ngControl) {
|
|
2999
|
+
if (this.ngControl.disabled) {
|
|
2996
3000
|
this.searchControl.disable({ emitEvent: false });
|
|
2997
3001
|
}
|
|
2998
|
-
|
|
2999
|
-
this.
|
|
3000
|
-
|
|
3001
|
-
|
|
3002
|
-
|
|
3003
|
-
|
|
3004
|
-
|
|
3005
|
-
|
|
3006
|
-
|
|
3007
|
-
|
|
3008
|
-
|
|
3009
|
-
|
|
3010
|
-
|
|
3011
|
-
|
|
3012
|
-
|
|
3013
|
-
|
|
3014
|
-
|
|
3015
|
-
|
|
3016
|
-
|
|
3002
|
+
this.ngControl.statusChanges.subscribe((status) => {
|
|
3003
|
+
this.disabled = status === "DISABLED";
|
|
3004
|
+
if (this._disabled) {
|
|
3005
|
+
this.searchControl.disable({ emitEvent: false });
|
|
3006
|
+
}
|
|
3007
|
+
else {
|
|
3008
|
+
this.searchControl.enable({ emitEvent: false });
|
|
3009
|
+
}
|
|
3010
|
+
});
|
|
3011
|
+
}
|
|
3012
|
+
if (this.filterFn) {
|
|
3013
|
+
this.service.setFilterFn(this.filterFn);
|
|
3014
|
+
}
|
|
3015
|
+
if (this.searchControl) {
|
|
3016
|
+
this.valueChangesSub$ = this.searchControl.valueChanges.pipe(debounceTime(500), distinctUntilChanged()).subscribe(text => {
|
|
3017
|
+
if (typeof text !== "string") {
|
|
3018
|
+
return;
|
|
3019
|
+
}
|
|
3020
|
+
this.service.search(this.resource, text);
|
|
3021
|
+
});
|
|
3022
|
+
}
|
|
3023
|
+
if (this.preloadResource) {
|
|
3024
|
+
this.service.search(this.resource, "");
|
|
3025
|
+
}
|
|
3026
|
+
this.componentInitialized = true;
|
|
3027
|
+
if (this.initialWriteValue !== undefined) {
|
|
3028
|
+
yield this.writeValue(this.initialWriteValue);
|
|
3029
|
+
}
|
|
3030
|
+
});
|
|
3017
3031
|
}
|
|
3018
3032
|
ngOnDestroy() {
|
|
3019
3033
|
this.service.closeRequestSubscription();
|
|
@@ -3022,8 +3036,9 @@ class NiceAsyncTypeaheadComponent extends _BaseAsyncTypeaheadComponent {
|
|
|
3022
3036
|
ngOnChanges(changes) {
|
|
3023
3037
|
if ("searchOptions" in changes) {
|
|
3024
3038
|
const change = changes.searchOptions;
|
|
3039
|
+
this.service.setSearchOptions(change.currentValue);
|
|
3025
3040
|
if (!change.isFirstChange() && change.currentValue !== change.previousValue && this.autoReload) {
|
|
3026
|
-
this.service.search(this.resource, ""
|
|
3041
|
+
this.service.search(this.resource, "");
|
|
3027
3042
|
this.service.items$.pipe(take(1)).subscribe(() => this.checkIfValueStillExist());
|
|
3028
3043
|
}
|
|
3029
3044
|
}
|
|
@@ -3042,6 +3057,10 @@ class NiceAsyncTypeaheadComponent extends _BaseAsyncTypeaheadComponent {
|
|
|
3042
3057
|
}
|
|
3043
3058
|
writeValue(value) {
|
|
3044
3059
|
return __awaiter(this, void 0, void 0, function* () {
|
|
3060
|
+
if (!this.componentInitialized) {
|
|
3061
|
+
this.initialWriteValue = value;
|
|
3062
|
+
return;
|
|
3063
|
+
}
|
|
3045
3064
|
if (this._value === value || (isNullOrUndefined(this._value) && isNullOrUndefined(value))) {
|
|
3046
3065
|
return;
|
|
3047
3066
|
}
|
|
@@ -3054,7 +3073,7 @@ class NiceAsyncTypeaheadComponent extends _BaseAsyncTypeaheadComponent {
|
|
|
3054
3073
|
return;
|
|
3055
3074
|
}
|
|
3056
3075
|
else {
|
|
3057
|
-
yield this.service.setActiveId(this.resource, value
|
|
3076
|
+
yield this.service.setActiveId(this.resource, value).then(() => this.updateSearchInput());
|
|
3058
3077
|
}
|
|
3059
3078
|
this.value = value;
|
|
3060
3079
|
});
|
|
@@ -3097,7 +3116,7 @@ class NiceAsyncTypeaheadComponent extends _BaseAsyncTypeaheadComponent {
|
|
|
3097
3116
|
});
|
|
3098
3117
|
}
|
|
3099
3118
|
if (this.open && !this.initialized) {
|
|
3100
|
-
this.service.initialize(this.resource
|
|
3119
|
+
this.service.initialize(this.resource);
|
|
3101
3120
|
}
|
|
3102
3121
|
if (!this.open && this.ngControl) {
|
|
3103
3122
|
this.ngControl.control.markAsTouched();
|
|
@@ -3126,7 +3145,7 @@ class NiceAsyncTypeaheadComponent extends _BaseAsyncTypeaheadComponent {
|
|
|
3126
3145
|
this.stateChanges.next();
|
|
3127
3146
|
this.entityRemoved.emit();
|
|
3128
3147
|
if (reload) {
|
|
3129
|
-
this.service.search(this.resource, ""
|
|
3148
|
+
this.service.search(this.resource, "");
|
|
3130
3149
|
}
|
|
3131
3150
|
}
|
|
3132
3151
|
formatLabel(item) {
|
|
@@ -3142,7 +3161,7 @@ class NiceAsyncTypeaheadComponent extends _BaseAsyncTypeaheadComponent {
|
|
|
3142
3161
|
return item;
|
|
3143
3162
|
}
|
|
3144
3163
|
onEndScroll() {
|
|
3145
|
-
this.service.loadMore(this.resource
|
|
3164
|
+
this.service.loadMore(this.resource);
|
|
3146
3165
|
}
|
|
3147
3166
|
focusChanged(isFocused) {
|
|
3148
3167
|
if (isFocused !== this.focused) {
|
|
@@ -3155,20 +3174,19 @@ class NiceAsyncTypeaheadComponent extends _BaseAsyncTypeaheadComponent {
|
|
|
3155
3174
|
}
|
|
3156
3175
|
reload() {
|
|
3157
3176
|
var _a, _b;
|
|
3158
|
-
|
|
3159
|
-
yield ((_a = this.service) === null || _a === void 0 ? void 0 : _a.search(this.resource, (_b = this.searchControl.value) !== null && _b !== void 0 ? _b : "", this.searchOptions));
|
|
3160
|
-
});
|
|
3177
|
+
(_a = this.service) === null || _a === void 0 ? void 0 : _a.search(this.resource, (_b = this.searchControl.value) !== null && _b !== void 0 ? _b : "");
|
|
3161
3178
|
}
|
|
3162
3179
|
reloadActive() {
|
|
3163
3180
|
var _a, _b;
|
|
3164
3181
|
return __awaiter(this, void 0, void 0, function* () {
|
|
3165
|
-
yield ((_a = this.service) === null || _a === void 0 ? void 0 : _a.reloadActive(this.resource
|
|
3182
|
+
yield ((_a = this.service) === null || _a === void 0 ? void 0 : _a.reloadActive(this.resource));
|
|
3166
3183
|
const active = (_b = this.service) === null || _b === void 0 ? void 0 : _b.getActive();
|
|
3167
3184
|
this.updateLabel(active);
|
|
3168
3185
|
});
|
|
3169
3186
|
}
|
|
3170
3187
|
setSearchOptions(options) {
|
|
3171
3188
|
this.searchOptions = options;
|
|
3189
|
+
this.service.setSearchOptions(options);
|
|
3172
3190
|
}
|
|
3173
3191
|
updateLabel(item) {
|
|
3174
3192
|
if (!item) {
|
|
@@ -10688,12 +10706,14 @@ class TranslationFormComponent {
|
|
|
10688
10706
|
setupFormControls(languages) {
|
|
10689
10707
|
for (const language of languages) {
|
|
10690
10708
|
if (!this.formGroup.controls[language]) {
|
|
10691
|
-
this.formGroup.addControl(language, new FormControl(
|
|
10709
|
+
this.formGroup.addControl(language, new FormControl(), {
|
|
10710
|
+
emitEvent: false,
|
|
10711
|
+
});
|
|
10692
10712
|
}
|
|
10693
10713
|
}
|
|
10694
10714
|
const controlToRemove = Object.keys(this.formGroup.controls).filter((key) => !languages.includes(key));
|
|
10695
10715
|
for (const key of controlToRemove) {
|
|
10696
|
-
this.formGroup.removeControl(key);
|
|
10716
|
+
this.formGroup.removeControl(key, { emitEvent: false });
|
|
10697
10717
|
}
|
|
10698
10718
|
this.currentControl = this.formGroup.get(languages[0]);
|
|
10699
10719
|
this.handleDisabledState();
|