geonetwork-ui 2.4.0-dev.ac57b75b → 2.4.0-dev.c5f4c491

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.
@@ -26331,8 +26331,7 @@ class ImageInputComponent {
26331
26331
  const file = new File([blob], name);
26332
26332
  this.fileChange.emit(file);
26333
26333
  },
26334
- error: (error) => {
26335
- console.error(error);
26334
+ error: () => {
26336
26335
  this.downloadError = true;
26337
26336
  this.cd.markForCheck();
26338
26337
  this.urlChange.emit(this.urlInputValue);
@@ -26368,7 +26367,6 @@ class ImageInputComponent {
26368
26367
  }
26369
26368
  }
26370
26369
  handleDelete() {
26371
- this.formControl.markAsDirty();
26372
26370
  this.delete.emit();
26373
26371
  }
26374
26372
  toggleAltTextInput() {
@@ -26391,7 +26389,7 @@ class ImageInputComponent {
26391
26389
  });
26392
26390
  }
26393
26391
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ImageInputComponent, deps: [{ token: i1.HttpClient }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
26394
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ImageInputComponent, isStandalone: true, selector: "gn-ui-image-input", inputs: { formControl: "formControl", maxSizeMB: "maxSizeMB", previewUrl: "previewUrl", altText: "altText", uploadProgress: "uploadProgress", uploadError: "uploadError" }, outputs: { fileChange: "fileChange", urlChange: "urlChange", uploadCancel: "uploadCancel", delete: "delete", altTextChange: "altTextChange" }, ngImport: i0, template: "<ng-container *ngIf=\"previewUrl; then withImage; else withoutImage\">\n</ng-container>\n\n<ng-template #withImage>\n <div class=\"w-full h-full flex flex-col gap-2\">\n <div class=\"flex-1 group relative\">\n <img\n class=\"w-full h-full object-cover border-2 border-gray-300 rounded-lg\"\n [alt]=\"altText\"\n loading=\"lazy\"\n [src]=\"previewUrl\"\n />\n <gn-ui-button\n [extraClass]=\"\n 'bg-gray-200 absolute right-2 bottom-2 invisible group-hover:visible'\n \"\n (buttonClick)=\"handleDelete()\"\n >\n <mat-icon class=\"material-symbols-outlined\">delete</mat-icon>\n </gn-ui-button>\n </div>\n <input\n *ngIf=\"showAltTextInput\"\n type=\"text\"\n class=\"py-3 px-2 border-2 border-gray-300 rounded-lg text-sm font-medium\"\n [placeholder]=\"'input.image.altTextPlaceholder' | translate\"\n [value]=\"altText\"\n (change)=\"handleAltTextChange($event)\"\n />\n <div class=\"flex flex-row gap-2\">\n <gn-ui-button\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"handleDelete()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">delete</mat-icon>\n {{ 'input.image.delete' | translate }}\n </gn-ui-button>\n <gn-ui-button\n *ngIf=\"!showAltTextInput\"\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"toggleAltTextInput()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">add</mat-icon>\n {{ 'input.image.displayAltTextInput' | translate }}\n </gn-ui-button>\n </div>\n </div>\n</ng-template>\n\n<ng-template #withoutImage>\n <div class=\"w-full h-full flex flex-col gap-2\">\n <label\n gnUiFilesDrop\n class=\"block flex-1 border-2 border-dashed border-gray-300 rounded-lg p-6 flex flex-col items-center justify-center gap-4 hover:cursor-pointer\"\n (dragFilesOver)=\"handleDragFilesOver($event)\"\n (dropFiles)=\"handleDropFiles($event)\"\n >\n <div class=\"w-14 h-14 rounded-md bg-gray-200 grid\">\n <mat-icon\n *ngIf=\"!dragFilesOver && !uploadProgress && !uploadError\"\n class=\"material-symbols-outlined place-self-center text-blue-500\"\n >image</mat-icon\n >\n <mat-icon\n *ngIf=\"dragFilesOver && !uploadProgress && !uploadError\"\n class=\"material-symbols-outlined place-self-center text-blue-500\"\n >add_box</mat-icon\n >\n <div *ngIf=\"uploadProgress\">\n <mat-progress-spinner\n class=\"place-self-center\"\n [diameter]=\"56\"\n [mode]=\"'determinate'\"\n [value]=\"uploadProgress\"\n ></mat-progress-spinner>\n <span\n class=\"text-sm font-medium relative inline-block width-[30px] bottom-[40px] left-[15px]\"\n >\n {{ uploadProgress }}%\n </span>\n </div>\n <mat-icon\n *ngIf=\"uploadError\"\n class=\"material-symbols-outlined place-self-center text-rose-500\"\n >broken_image</mat-icon\n >\n </div>\n <div class=\"flex flex-col items-center gap-1\">\n <p class=\"font-medium\">{{ getPrimaryText() | translate }}</p>\n <p\n class=\"text-sm\"\n [class]=\"\n uploadProgress || uploadError\n ? 'font-bold text-blue-500 cursor-pointer'\n : 'font-medium text-gray-500'\n \"\n (click)=\"handleSecondaryTextClick()\"\n >\n {{ getSecondaryText() | translate }}\n </p>\n </div>\n <input\n type=\"file\"\n class=\"hidden\"\n (change)=\"handleFileInput($event)\"\n [disabled]=\"showUrlInput || uploadProgress || uploadError\"\n />\n </label>\n <div *ngIf=\"!showUrlInput\" class=\"flex-none\">\n <gn-ui-button\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"displayUrlInput()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">link</mat-icon>\n {{ 'input.image.displayUrlInput' | translate }}\n </gn-ui-button>\n </div>\n <div *ngIf=\"showUrlInput\" class=\"flex-none flex flex-col gap-2\">\n <div class=\"h-2\"></div>\n <div class=\"flex gap-2 items-center\">\n <div class=\"flex-1 flex rounded-lg\">\n <span\n class=\"material-symbols-outlined px-4 inline-flex items-center min-w-fit rounded-s-lg border-2 border-e-0 border-gray-300\"\n >link</span\n >\n <input\n type=\"text\"\n class=\"py-3 ps-1 block w-full border-2 border-s-0 border-e-0 border-gray-300 text-sm font-medium\"\n placeholder=\"https://exemple.com/image.jpg\"\n (change)=\"handleUrlChange($event)\"\n />\n <gn-ui-button\n class=\"px-1 inline-flex items-center min-w-fit rounded-e-lg border-2 border-s-0 border-gray-300 text-white\"\n [extraClass]=\"\n urlInputValue && !downloadError ? 'bg-blue-500' : 'bg-gray-500'\n \"\n [disabled]=\"!urlInputValue || downloadError\"\n (buttonClick)=\"downloadUrl()\"\n >\n <mat-icon class=\"material-symbols-outlined\">arrow_upward</mat-icon>\n </gn-ui-button>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: FilesDropDirective, selector: "[gnUiFilesDrop]", outputs: ["dragFilesOver", "dropFiles"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
26392
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ImageInputComponent, isStandalone: true, selector: "gn-ui-image-input", inputs: { maxSizeMB: "maxSizeMB", previewUrl: "previewUrl", altText: "altText", uploadProgress: "uploadProgress", uploadError: "uploadError" }, outputs: { fileChange: "fileChange", urlChange: "urlChange", uploadCancel: "uploadCancel", delete: "delete", altTextChange: "altTextChange" }, ngImport: i0, template: "<ng-container *ngIf=\"previewUrl; then withImage; else withoutImage\">\n</ng-container>\n\n<ng-template #withImage>\n <div class=\"w-full h-full flex flex-col gap-2\">\n <div class=\"flex-1 group relative\">\n <img\n class=\"w-full h-full object-cover border-2 border-gray-300 rounded-lg\"\n [alt]=\"altText\"\n loading=\"lazy\"\n [src]=\"previewUrl\"\n />\n <gn-ui-button\n [extraClass]=\"\n 'bg-gray-200 absolute right-2 bottom-2 invisible group-hover:visible'\n \"\n (buttonClick)=\"handleDelete()\"\n >\n <mat-icon class=\"material-symbols-outlined\">delete</mat-icon>\n </gn-ui-button>\n </div>\n <input\n *ngIf=\"showAltTextInput\"\n type=\"text\"\n class=\"py-3 px-2 border-2 border-gray-300 rounded-lg text-sm font-medium\"\n [placeholder]=\"'input.image.altTextPlaceholder' | translate\"\n [value]=\"altText\"\n (change)=\"handleAltTextChange($event)\"\n />\n <div class=\"flex flex-row gap-2\">\n <gn-ui-button\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"handleDelete()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">delete</mat-icon>\n {{ 'input.image.delete' | translate }}\n </gn-ui-button>\n <gn-ui-button\n *ngIf=\"!showAltTextInput\"\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"toggleAltTextInput()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">add</mat-icon>\n {{ 'input.image.displayAltTextInput' | translate }}\n </gn-ui-button>\n </div>\n </div>\n</ng-template>\n\n<ng-template #withoutImage>\n <div class=\"w-full h-full flex flex-col gap-2\">\n <label\n gnUiFilesDrop\n class=\"block flex-1 border-2 border-dashed border-gray-300 rounded-lg p-6 flex flex-col items-center justify-center gap-4\"\n (dragFilesOver)=\"handleDragFilesOver($event)\"\n (dropFiles)=\"handleDropFiles($event)\"\n >\n <div class=\"w-14 h-14 rounded-md bg-gray-200 grid\">\n <mat-icon\n *ngIf=\"!dragFilesOver && !uploadProgress && !uploadError\"\n class=\"material-symbols-outlined place-self-center text-blue-500\"\n >image</mat-icon\n >\n <mat-icon\n *ngIf=\"dragFilesOver && !uploadProgress && !uploadError\"\n class=\"material-symbols-outlined place-self-center text-blue-500\"\n >add_box</mat-icon\n >\n <div *ngIf=\"uploadProgress\">\n <mat-progress-spinner\n class=\"place-self-center\"\n [diameter]=\"56\"\n [mode]=\"'determinate'\"\n [value]=\"uploadProgress\"\n ></mat-progress-spinner>\n <span\n class=\"text-sm font-medium relative inline-block width-[30px] bottom-[40px] left-[15px]\"\n >\n {{ uploadProgress }}%\n </span>\n </div>\n <mat-icon\n *ngIf=\"uploadError\"\n class=\"material-symbols-outlined place-self-center text-rose-500\"\n >broken_image</mat-icon\n >\n </div>\n <div class=\"flex flex-col items-center gap-1\">\n <p class=\"font-medium\">{{ getPrimaryText() | translate }}</p>\n <p\n class=\"text-sm\"\n [class]=\"\n uploadProgress || uploadError\n ? 'font-bold text-blue-500 cursor-pointer'\n : 'font-medium text-gray-500'\n \"\n (click)=\"handleSecondaryTextClick()\"\n >\n {{ getSecondaryText() | translate }}\n </p>\n </div>\n <input\n type=\"file\"\n class=\"hidden\"\n (change)=\"handleFileInput($event)\"\n [disabled]=\"showUrlInput || uploadProgress || uploadError\"\n />\n </label>\n <div *ngIf=\"!showUrlInput\" class=\"flex-none\">\n <gn-ui-button\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"displayUrlInput()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">link</mat-icon>\n {{ 'input.image.displayUrlInput' | translate }}\n </gn-ui-button>\n </div>\n <div *ngIf=\"showUrlInput\" class=\"flex-none flex flex-col gap-2\">\n <div class=\"h-2\"></div>\n <div class=\"flex gap-2 items-center\">\n <div class=\"flex-1 flex rounded-lg\">\n <span\n class=\"material-symbols-outlined px-4 inline-flex items-center min-w-fit rounded-s-lg border-2 border-e-0 border-gray-300\"\n >link</span\n >\n <input\n type=\"text\"\n class=\"py-3 ps-1 block w-full border-2 border-s-0 border-e-0 border-gray-300 text-sm font-medium\"\n placeholder=\"https://exemple.com/image.jpg\"\n (change)=\"handleUrlChange($event)\"\n />\n <gn-ui-button\n class=\"px-1 inline-flex items-center min-w-fit rounded-e-lg border-2 border-s-0 border-gray-300 text-white\"\n [extraClass]=\"\n urlInputValue && !downloadError ? 'bg-blue-500' : 'bg-gray-500'\n \"\n [disabled]=\"!urlInputValue || downloadError\"\n (buttonClick)=\"downloadUrl()\"\n >\n <mat-icon class=\"material-symbols-outlined\">arrow_upward</mat-icon>\n </gn-ui-button>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "gn-ui-button", inputs: ["type", "disabled", "extraClass"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: FilesDropDirective, selector: "[gnUiFilesDrop]", outputs: ["dragFilesOver", "dropFiles"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
26395
26393
  }
26396
26394
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ImageInputComponent, decorators: [{
26397
26395
  type: Component,
@@ -26402,11 +26400,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
26402
26400
  FilesDropDirective,
26403
26401
  MatProgressSpinnerModule,
26404
26402
  TranslateModule,
26405
- ReactiveFormsModule,
26406
- ], template: "<ng-container *ngIf=\"previewUrl; then withImage; else withoutImage\">\n</ng-container>\n\n<ng-template #withImage>\n <div class=\"w-full h-full flex flex-col gap-2\">\n <div class=\"flex-1 group relative\">\n <img\n class=\"w-full h-full object-cover border-2 border-gray-300 rounded-lg\"\n [alt]=\"altText\"\n loading=\"lazy\"\n [src]=\"previewUrl\"\n />\n <gn-ui-button\n [extraClass]=\"\n 'bg-gray-200 absolute right-2 bottom-2 invisible group-hover:visible'\n \"\n (buttonClick)=\"handleDelete()\"\n >\n <mat-icon class=\"material-symbols-outlined\">delete</mat-icon>\n </gn-ui-button>\n </div>\n <input\n *ngIf=\"showAltTextInput\"\n type=\"text\"\n class=\"py-3 px-2 border-2 border-gray-300 rounded-lg text-sm font-medium\"\n [placeholder]=\"'input.image.altTextPlaceholder' | translate\"\n [value]=\"altText\"\n (change)=\"handleAltTextChange($event)\"\n />\n <div class=\"flex flex-row gap-2\">\n <gn-ui-button\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"handleDelete()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">delete</mat-icon>\n {{ 'input.image.delete' | translate }}\n </gn-ui-button>\n <gn-ui-button\n *ngIf=\"!showAltTextInput\"\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"toggleAltTextInput()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">add</mat-icon>\n {{ 'input.image.displayAltTextInput' | translate }}\n </gn-ui-button>\n </div>\n </div>\n</ng-template>\n\n<ng-template #withoutImage>\n <div class=\"w-full h-full flex flex-col gap-2\">\n <label\n gnUiFilesDrop\n class=\"block flex-1 border-2 border-dashed border-gray-300 rounded-lg p-6 flex flex-col items-center justify-center gap-4 hover:cursor-pointer\"\n (dragFilesOver)=\"handleDragFilesOver($event)\"\n (dropFiles)=\"handleDropFiles($event)\"\n >\n <div class=\"w-14 h-14 rounded-md bg-gray-200 grid\">\n <mat-icon\n *ngIf=\"!dragFilesOver && !uploadProgress && !uploadError\"\n class=\"material-symbols-outlined place-self-center text-blue-500\"\n >image</mat-icon\n >\n <mat-icon\n *ngIf=\"dragFilesOver && !uploadProgress && !uploadError\"\n class=\"material-symbols-outlined place-self-center text-blue-500\"\n >add_box</mat-icon\n >\n <div *ngIf=\"uploadProgress\">\n <mat-progress-spinner\n class=\"place-self-center\"\n [diameter]=\"56\"\n [mode]=\"'determinate'\"\n [value]=\"uploadProgress\"\n ></mat-progress-spinner>\n <span\n class=\"text-sm font-medium relative inline-block width-[30px] bottom-[40px] left-[15px]\"\n >\n {{ uploadProgress }}%\n </span>\n </div>\n <mat-icon\n *ngIf=\"uploadError\"\n class=\"material-symbols-outlined place-self-center text-rose-500\"\n >broken_image</mat-icon\n >\n </div>\n <div class=\"flex flex-col items-center gap-1\">\n <p class=\"font-medium\">{{ getPrimaryText() | translate }}</p>\n <p\n class=\"text-sm\"\n [class]=\"\n uploadProgress || uploadError\n ? 'font-bold text-blue-500 cursor-pointer'\n : 'font-medium text-gray-500'\n \"\n (click)=\"handleSecondaryTextClick()\"\n >\n {{ getSecondaryText() | translate }}\n </p>\n </div>\n <input\n type=\"file\"\n class=\"hidden\"\n (change)=\"handleFileInput($event)\"\n [disabled]=\"showUrlInput || uploadProgress || uploadError\"\n />\n </label>\n <div *ngIf=\"!showUrlInput\" class=\"flex-none\">\n <gn-ui-button\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"displayUrlInput()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">link</mat-icon>\n {{ 'input.image.displayUrlInput' | translate }}\n </gn-ui-button>\n </div>\n <div *ngIf=\"showUrlInput\" class=\"flex-none flex flex-col gap-2\">\n <div class=\"h-2\"></div>\n <div class=\"flex gap-2 items-center\">\n <div class=\"flex-1 flex rounded-lg\">\n <span\n class=\"material-symbols-outlined px-4 inline-flex items-center min-w-fit rounded-s-lg border-2 border-e-0 border-gray-300\"\n >link</span\n >\n <input\n type=\"text\"\n class=\"py-3 ps-1 block w-full border-2 border-s-0 border-e-0 border-gray-300 text-sm font-medium\"\n placeholder=\"https://exemple.com/image.jpg\"\n (change)=\"handleUrlChange($event)\"\n />\n <gn-ui-button\n class=\"px-1 inline-flex items-center min-w-fit rounded-e-lg border-2 border-s-0 border-gray-300 text-white\"\n [extraClass]=\"\n urlInputValue && !downloadError ? 'bg-blue-500' : 'bg-gray-500'\n \"\n [disabled]=\"!urlInputValue || downloadError\"\n (buttonClick)=\"downloadUrl()\"\n >\n <mat-icon class=\"material-symbols-outlined\">arrow_upward</mat-icon>\n </gn-ui-button>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n" }]
26407
- }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { formControl: [{
26408
- type: Input
26409
- }], maxSizeMB: [{
26403
+ ], template: "<ng-container *ngIf=\"previewUrl; then withImage; else withoutImage\">\n</ng-container>\n\n<ng-template #withImage>\n <div class=\"w-full h-full flex flex-col gap-2\">\n <div class=\"flex-1 group relative\">\n <img\n class=\"w-full h-full object-cover border-2 border-gray-300 rounded-lg\"\n [alt]=\"altText\"\n loading=\"lazy\"\n [src]=\"previewUrl\"\n />\n <gn-ui-button\n [extraClass]=\"\n 'bg-gray-200 absolute right-2 bottom-2 invisible group-hover:visible'\n \"\n (buttonClick)=\"handleDelete()\"\n >\n <mat-icon class=\"material-symbols-outlined\">delete</mat-icon>\n </gn-ui-button>\n </div>\n <input\n *ngIf=\"showAltTextInput\"\n type=\"text\"\n class=\"py-3 px-2 border-2 border-gray-300 rounded-lg text-sm font-medium\"\n [placeholder]=\"'input.image.altTextPlaceholder' | translate\"\n [value]=\"altText\"\n (change)=\"handleAltTextChange($event)\"\n />\n <div class=\"flex flex-row gap-2\">\n <gn-ui-button\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"handleDelete()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">delete</mat-icon>\n {{ 'input.image.delete' | translate }}\n </gn-ui-button>\n <gn-ui-button\n *ngIf=\"!showAltTextInput\"\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"toggleAltTextInput()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">add</mat-icon>\n {{ 'input.image.displayAltTextInput' | translate }}\n </gn-ui-button>\n </div>\n </div>\n</ng-template>\n\n<ng-template #withoutImage>\n <div class=\"w-full h-full flex flex-col gap-2\">\n <label\n gnUiFilesDrop\n class=\"block flex-1 border-2 border-dashed border-gray-300 rounded-lg p-6 flex flex-col items-center justify-center gap-4\"\n (dragFilesOver)=\"handleDragFilesOver($event)\"\n (dropFiles)=\"handleDropFiles($event)\"\n >\n <div class=\"w-14 h-14 rounded-md bg-gray-200 grid\">\n <mat-icon\n *ngIf=\"!dragFilesOver && !uploadProgress && !uploadError\"\n class=\"material-symbols-outlined place-self-center text-blue-500\"\n >image</mat-icon\n >\n <mat-icon\n *ngIf=\"dragFilesOver && !uploadProgress && !uploadError\"\n class=\"material-symbols-outlined place-self-center text-blue-500\"\n >add_box</mat-icon\n >\n <div *ngIf=\"uploadProgress\">\n <mat-progress-spinner\n class=\"place-self-center\"\n [diameter]=\"56\"\n [mode]=\"'determinate'\"\n [value]=\"uploadProgress\"\n ></mat-progress-spinner>\n <span\n class=\"text-sm font-medium relative inline-block width-[30px] bottom-[40px] left-[15px]\"\n >\n {{ uploadProgress }}%\n </span>\n </div>\n <mat-icon\n *ngIf=\"uploadError\"\n class=\"material-symbols-outlined place-self-center text-rose-500\"\n >broken_image</mat-icon\n >\n </div>\n <div class=\"flex flex-col items-center gap-1\">\n <p class=\"font-medium\">{{ getPrimaryText() | translate }}</p>\n <p\n class=\"text-sm\"\n [class]=\"\n uploadProgress || uploadError\n ? 'font-bold text-blue-500 cursor-pointer'\n : 'font-medium text-gray-500'\n \"\n (click)=\"handleSecondaryTextClick()\"\n >\n {{ getSecondaryText() | translate }}\n </p>\n </div>\n <input\n type=\"file\"\n class=\"hidden\"\n (change)=\"handleFileInput($event)\"\n [disabled]=\"showUrlInput || uploadProgress || uploadError\"\n />\n </label>\n <div *ngIf=\"!showUrlInput\" class=\"flex-none\">\n <gn-ui-button\n [extraClass]=\"'bg-gray-200 font-bold'\"\n (buttonClick)=\"displayUrlInput()\"\n >\n <mat-icon class=\"material-symbols-outlined me-1\">link</mat-icon>\n {{ 'input.image.displayUrlInput' | translate }}\n </gn-ui-button>\n </div>\n <div *ngIf=\"showUrlInput\" class=\"flex-none flex flex-col gap-2\">\n <div class=\"h-2\"></div>\n <div class=\"flex gap-2 items-center\">\n <div class=\"flex-1 flex rounded-lg\">\n <span\n class=\"material-symbols-outlined px-4 inline-flex items-center min-w-fit rounded-s-lg border-2 border-e-0 border-gray-300\"\n >link</span\n >\n <input\n type=\"text\"\n class=\"py-3 ps-1 block w-full border-2 border-s-0 border-e-0 border-gray-300 text-sm font-medium\"\n placeholder=\"https://exemple.com/image.jpg\"\n (change)=\"handleUrlChange($event)\"\n />\n <gn-ui-button\n class=\"px-1 inline-flex items-center min-w-fit rounded-e-lg border-2 border-s-0 border-gray-300 text-white\"\n [extraClass]=\"\n urlInputValue && !downloadError ? 'bg-blue-500' : 'bg-gray-500'\n \"\n [disabled]=\"!urlInputValue || downloadError\"\n (buttonClick)=\"downloadUrl()\"\n >\n <mat-icon class=\"material-symbols-outlined\">arrow_upward</mat-icon>\n </gn-ui-button>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n" }]
26404
+ }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { maxSizeMB: [{
26410
26405
  type: Input
26411
26406
  }], previewUrl: [{
26412
26407
  type: Input
@@ -35984,22 +35979,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
35984
35979
  type: Input
35985
35980
  }] } });
35986
35981
 
35987
- const extractFileNameFromUrl = (url) => {
35988
- const pattern = new RegExp(`attachments/([^/?#]+)(?:[/?#]|$)`, 'i');
35989
- const match = url.match(pattern);
35990
- return match ? match[1] : '';
35991
- };
35992
35982
  class OverviewUploadComponent {
35993
35983
  constructor(recordsApiService, cd) {
35994
35984
  this.recordsApiService = recordsApiService;
35995
35985
  this.cd = cd;
35996
35986
  this.overviewChange = new EventEmitter();
35997
35987
  this.altTextChange = new EventEmitter();
35998
- this.resourceAltText = ''; // = ressourceFileName by default
35999
- this.resourceFileName = '';
36000
35988
  this.errorHandle = (error) => {
36001
35989
  console.error(error);
36002
- this.resourceUrl = null;
35990
+ this.resourceUrl = '';
36003
35991
  this.resourceAltText = '';
36004
35992
  this.resourceFileName = '';
36005
35993
  this.overviewChange.emit(null);
@@ -36010,15 +35998,14 @@ class OverviewUploadComponent {
36010
35998
  this.recordsApiService.getAllResources(this.metadataUuid).subscribe({
36011
35999
  next: (resources) => {
36012
36000
  if (resources && resources.length > 0) {
36013
- this.resourceUrl = new URL(resources[0]?.url);
36014
- this.resourceAltText =
36015
- this.resourceAltText === ''
36016
- ? resources[0].filename
36017
- : this.resourceAltText;
36018
- this.resourceFileName = extractFileNameFromUrl(resources[0]?.url);
36001
+ this.resourceUrl = resources[0].url;
36002
+ this.resourceFileName = resources[0].filename;
36003
+ if (!this.resourceAltText) {
36004
+ this.resourceAltText = this.resourceFileName;
36005
+ }
36019
36006
  }
36020
36007
  else {
36021
- this.resourceUrl = null;
36008
+ this.resourceUrl = '';
36022
36009
  this.resourceAltText = '';
36023
36010
  this.resourceFileName = '';
36024
36011
  }
@@ -36032,7 +36019,7 @@ class OverviewUploadComponent {
36032
36019
  .putResource(this.metadataUuid, file, 'public')
36033
36020
  .subscribe({
36034
36021
  next: (resource) => {
36035
- this.resourceUrl = new URL(resource.url);
36022
+ this.resourceUrl = resource.url;
36036
36023
  this.resourceAltText = resource.filename;
36037
36024
  this.overviewChange.emit({
36038
36025
  url: new URL(resource.url),
@@ -36048,7 +36035,7 @@ class OverviewUploadComponent {
36048
36035
  .putResourceFromURL(this.metadataUuid, url, 'public')
36049
36036
  .subscribe({
36050
36037
  next: (resource) => {
36051
- this.resourceUrl = new URL(resource.url);
36038
+ this.resourceUrl = resource.url;
36052
36039
  this.resourceAltText = resource.filename;
36053
36040
  this.overviewChange.emit({
36054
36041
  url: new URL(resource.url),
@@ -36062,18 +36049,19 @@ class OverviewUploadComponent {
36062
36049
  handleAltTextChange(newAltText) {
36063
36050
  this.resourceAltText = newAltText;
36064
36051
  this.overviewChange.emit({
36065
- url: this.resourceUrl,
36052
+ url: new URL(this.resourceUrl),
36066
36053
  description: this.resourceAltText,
36067
36054
  });
36068
36055
  this.cd.markForCheck();
36069
36056
  }
36070
36057
  handleDelete() {
36058
+ //this.formControl.markAsDirty()
36071
36059
  this.recordsApiService
36072
36060
  .delResource(this.metadataUuid, this.resourceFileName)
36073
36061
  .subscribe({
36074
36062
  next: () => {
36075
- this.resourceAltText = null;
36076
- this.resourceUrl = null;
36063
+ this.resourceAltText = '';
36064
+ this.resourceUrl = '';
36077
36065
  this.overviewChange.emit(null);
36078
36066
  this.cd.markForCheck();
36079
36067
  },
@@ -36092,18 +36080,18 @@ class OverviewUploadComponent {
36092
36080
  else {
36093
36081
  return;
36094
36082
  }
36095
- if (overview.description && overview.description !== '') {
36083
+ if (overview.description) {
36096
36084
  this.resourceAltText = overview.description;
36097
36085
  this.cd.markForCheck();
36098
36086
  }
36099
36087
  }
36100
36088
  }
36101
36089
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OverviewUploadComponent, deps: [{ token: RecordsApiService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
36102
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OverviewUploadComponent, isStandalone: true, selector: "gn-ui-overview-upload", inputs: { metadataUuid: "metadataUuid", formControl: "formControl" }, outputs: { overviewChange: "overviewChange", altTextChange: "altTextChange" }, usesOnChanges: true, ngImport: i0, template: "<gn-ui-image-input\n [maxSizeMB]=\"5\"\n [previewUrl]=\"resourceUrl\"\n [altText]=\"resourceAltText\"\n [formControl]=\"formControl\"\n (fileChange)=\"handleFileChange($event)\"\n (urlChange)=\"handleUrlChange($event)\"\n (altTextChange)=\"handleAltTextChange($event)\"\n (delete)=\"handleDelete()\"\n></gn-ui-image-input>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: UiInputsModule }, { kind: "component", type: ImageInputComponent, selector: "gn-ui-image-input", inputs: ["formControl", "maxSizeMB", "previewUrl", "altText", "uploadProgress", "uploadError"], outputs: ["fileChange", "urlChange", "uploadCancel", "delete", "altTextChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
36090
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OverviewUploadComponent, isStandalone: true, selector: "gn-ui-overview-upload", inputs: { metadataUuid: "metadataUuid", formControl: "formControl" }, outputs: { overviewChange: "overviewChange", altTextChange: "altTextChange" }, usesOnChanges: true, ngImport: i0, template: "<gn-ui-image-input\n [maxSizeMB]=\"5\"\n [previewUrl]=\"resourceUrl\"\n [altText]=\"resourceAltText\"\n (fileChange)=\"handleFileChange($event)\"\n (urlChange)=\"handleUrlChange($event)\"\n (altTextChange)=\"handleAltTextChange($event)\"\n (delete)=\"handleDelete()\"\n></gn-ui-image-input>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: UiInputsModule }, { kind: "component", type: ImageInputComponent, selector: "gn-ui-image-input", inputs: ["maxSizeMB", "previewUrl", "altText", "uploadProgress", "uploadError"], outputs: ["fileChange", "urlChange", "uploadCancel", "delete", "altTextChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
36103
36091
  }
36104
36092
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OverviewUploadComponent, decorators: [{
36105
36093
  type: Component,
36106
- args: [{ selector: 'gn-ui-overview-upload', standalone: true, imports: [CommonModule, UiInputsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<gn-ui-image-input\n [maxSizeMB]=\"5\"\n [previewUrl]=\"resourceUrl\"\n [altText]=\"resourceAltText\"\n [formControl]=\"formControl\"\n (fileChange)=\"handleFileChange($event)\"\n (urlChange)=\"handleUrlChange($event)\"\n (altTextChange)=\"handleAltTextChange($event)\"\n (delete)=\"handleDelete()\"\n></gn-ui-image-input>\n" }]
36094
+ args: [{ selector: 'gn-ui-overview-upload', standalone: true, imports: [CommonModule, UiInputsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<gn-ui-image-input\n [maxSizeMB]=\"5\"\n [previewUrl]=\"resourceUrl\"\n [altText]=\"resourceAltText\"\n (fileChange)=\"handleFileChange($event)\"\n (urlChange)=\"handleUrlChange($event)\"\n (altTextChange)=\"handleAltTextChange($event)\"\n (delete)=\"handleDelete()\"\n></gn-ui-image-input>\n" }]
36107
36095
  }], ctorParameters: function () { return [{ type: RecordsApiService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { metadataUuid: [{
36108
36096
  type: Input
36109
36097
  }], formControl: [{
@@ -36228,7 +36216,6 @@ class RecordFormComponent {
36228
36216
  if (!model) {
36229
36217
  return;
36230
36218
  }
36231
- console.log(newValue);
36232
36219
  this.facade.updateRecordField(model, newValue);
36233
36220
  }
36234
36221
  fieldTracker(index, field) {