@ecodev/natural 57.0.4 → 57.0.5

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.
@@ -2411,6 +2411,9 @@ class NaturalAbstractDetail extends NaturalAbstractPanel {
2411
2411
  this.#isUpdatePage = false;
2412
2412
  this.#changes = new CumulativeChanges();
2413
2413
  }
2414
+ /**
2415
+ * You probably should not override this method. Instead, consider overriding `initForm()`.
2416
+ */
2414
2417
  ngOnInit() {
2415
2418
  if (this.isPanel) {
2416
2419
  this.initForm();
@@ -2555,6 +2558,13 @@ class NaturalAbstractDetail extends NaturalAbstractPanel {
2555
2558
  preDelete(model) {
2556
2559
  // noop
2557
2560
  }
2561
+ /**
2562
+ * Initialize the form whenever it is needed.
2563
+ *
2564
+ * You should override this method, and not `ngOnInit()` if you need to customize the form. Because this will
2565
+ * correctly be called more than one time per component instance if needed, when the route changes. But `ngOnInit()`
2566
+ * will incorrectly be called exactly 1 time per component instance, even if the object changes via route navigation.
2567
+ */
2558
2568
  initForm() {
2559
2569
  this.#isUpdatePage = !!this.data.model.id;
2560
2570
  this.form = this.service.getFormGroup(this.data.model);
@@ -7116,10 +7126,10 @@ class TypeNumberComponent {
7116
7126
  }
7117
7127
  initValidators() {
7118
7128
  const validators = [Validators.required];
7119
- if (this.configuration.min) {
7129
+ if (typeof this.configuration.min === 'number') {
7120
7130
  validators.push(Validators.min(this.configuration.min));
7121
7131
  }
7122
- if (this.configuration.max) {
7132
+ if (typeof this.configuration.max === 'number') {
7123
7133
  validators.push(Validators.max(this.configuration.max));
7124
7134
  }
7125
7135
  if (this.configuration.step) {
@@ -9849,6 +9859,20 @@ const fallbackIfNoOpenedPanels = (segments) => {
9849
9859
  * </natural-relations>
9850
9860
  */
9851
9861
  class NaturalRelationsComponent extends NaturalAbstractController {
9862
+ #service;
9863
+ get service() {
9864
+ return this.#service;
9865
+ }
9866
+ set service(service) {
9867
+ this.#service = service;
9868
+ this.loading = true;
9869
+ const items$ = this.#service.watchAll(this.variablesManager).pipe(takeUntil(this.ngUnsubscribe), tap({
9870
+ next: () => (this.loading = false),
9871
+ complete: () => (this.loading = false),
9872
+ error: () => (this.loading = false),
9873
+ }));
9874
+ this.dataSource = new NaturalDataSource(items$);
9875
+ }
9852
9876
  constructor(linkMutationService, hierarchicSelectorDialog) {
9853
9877
  super();
9854
9878
  this.linkMutationService = linkMutationService;
@@ -9891,9 +9915,6 @@ class NaturalRelationsComponent extends NaturalAbstractController {
9891
9915
  this.variablesManager.set('relations-filter', { filter: filter });
9892
9916
  }
9893
9917
  ngOnChanges() {
9894
- if (this.service) {
9895
- this.queryItems();
9896
- }
9897
9918
  if (this.disabled && this.displayedColumns.includes('unlink')) {
9898
9919
  this.displayedColumns.pop();
9899
9920
  }
@@ -9916,7 +9937,7 @@ class NaturalRelationsComponent extends NaturalAbstractController {
9916
9937
  this.removing.add(relation);
9917
9938
  this.linkMutationService
9918
9939
  .unlink(this.main, relation, this.otherName)
9919
- .pipe(finalize$1(() => this.removing.delete(relation)))
9940
+ .pipe(finalize(() => this.removing.delete(relation)))
9920
9941
  .subscribe(() => this.dataSource?.remove(relation));
9921
9942
  }
9922
9943
  /**
@@ -9974,21 +9995,6 @@ class NaturalRelationsComponent extends NaturalAbstractController {
9974
9995
  }
9975
9996
  });
9976
9997
  }
9977
- /**
9978
- * Get list from database
9979
- */
9980
- queryItems() {
9981
- if (!this.service) {
9982
- return;
9983
- }
9984
- this.loading = true;
9985
- const queryRef = this.service.watchAll(this.variablesManager).pipe(takeUntil$1(this.ngUnsubscribe), tap({
9986
- next: () => (this.loading = false),
9987
- complete: () => (this.loading = false),
9988
- error: () => (this.loading = false),
9989
- }));
9990
- this.dataSource = new NaturalDataSource(queryRef);
9991
- }
9992
9998
  getSelectKey() {
9993
9999
  if (!this.hierarchicSelectorConfig) {
9994
10000
  return;
@@ -9996,7 +10002,7 @@ class NaturalRelationsComponent extends NaturalAbstractController {
9996
10002
  return this.hierarchicSelectorConfig.filter(c => !!c.selectableAtKey)[0].selectableAtKey;
9997
10003
  }
9998
10004
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: NaturalRelationsComponent, deps: [{ token: NaturalLinkMutationService }, { token: NaturalHierarchicSelectorDialogService }], target: i0.ɵɵFactoryTarget.Component }); }
9999
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: NaturalRelationsComponent, isStandalone: true, selector: "natural-relations", inputs: { service: "service", placeholder: "placeholder", autocompleteSelectorFilter: "autocompleteSelectorFilter", displayWith: "displayWith", disabled: "disabled", main: "main", hierarchicSelectorFilters: "hierarchicSelectorFilters", hierarchicSelectorConfig: "hierarchicSelectorConfig", otherName: "otherName", filter: "filter" }, outputs: { selectionChange: "selectionChange" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "select", first: true, predicate: NaturalSelectComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"body\">\n <ng-template #defaultNameCell let-item=\"item\">\n {{ getDisplayFn()(item) }}\n </ng-template>\n\n @if (dataSource) {\n <table [dataSource]=\"dataSource\" class=\"natural-row-click\" mat-table>\n <tr *matHeaderRowDef=\"displayedColumns\" mat-header-row style=\"display: none\"></tr>\n <tr *matRowDef=\"let row; columns: displayedColumns\" mat-row></tr>\n\n <ng-container matColumnDef=\"name\">\n <th *matHeaderCellDef i18n mat-header-cell>Titre</th>\n <td *matCellDef=\"let item\" mat-cell>\n <ng-template\n [ngTemplateOutletContext]=\"{item: item}\"\n [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultNameCell\"\n />\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"unlink\">\n <th *matHeaderCellDef mat-header-cell></th>\n <td *matCellDef=\"let element\" mat-cell>\n @if (!disabled) {\n <button\n (click)=\"removeRelation(element)\"\n [disabled]=\"removing.has(element)\"\n color=\"warn\"\n mat-icon-button\n i18n-matTooltip\n matTooltip=\"Dissocier\"\n >\n <mat-icon naturalIcon=\"link_off\" />\n </button>\n }\n </td>\n </ng-container>\n </table>\n }\n\n @if (dataSource?.data && (dataSource?.data?.length || 0) > (dataSource?.data?.pageSize || 0)) {\n <mat-paginator\n (page)=\"pagination($event)\"\n [length]=\"dataSource?.data?.length || 0\"\n [pageIndex]=\"dataSource?.data?.pageIndex || 0\"\n [pageSizeOptions]=\"pageSizeOptions\"\n [pageSize]=\"dataSource?.data?.pageSize || 0\"\n />\n }\n\n @if (!loading && dataSource?.data?.length === 0) {\n <div class=\"margin-v mat-body\">\n <span i18n>Aucun r\u00E9sultat</span>\n </div>\n }\n\n @if (loading) {\n <mat-progress-spinner [diameter]=\"40\" class=\"loading\" mode=\"indeterminate\" />\n }\n</div>\n\n@if (!hierarchicSelectorConfig && service && !disabled) {\n <natural-select\n (selectionChange)=\"addRelations([$event])\"\n [displayWith]=\"$any(getDisplayFn())\"\n [filter]=\"autocompleteSelectorFilter\"\n [placeholder]=\"placeholder\"\n [service]=\"service\"\n [showIcon]=\"false\"\n />\n}\n\n@if (hierarchicSelectorConfig && !disabled) {\n <div>\n <button (click)=\"openNaturalHierarchicSelector()\" color=\"primary\" mat-flat-button>{{ placeholder }}</button>\n </div>\n}\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host .body{display:flex;flex-direction:column}:host .loading{margin:20px auto}:host .mat-column-unlink{width:2.5em}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i4$3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4$3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4$3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4$3.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i4$3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4$3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4$3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4$3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4$3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4$3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i7$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NaturalIconDirective, selector: "mat-icon[naturalIcon]", inputs: ["naturalIcon", "size"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i8$2.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i8.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: NaturalSelectComponent, selector: "natural-select", inputs: ["service", "optionRequired", "searchField", "searchOperator", "filter", "disabled"] }] }); }
10005
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: NaturalRelationsComponent, isStandalone: true, selector: "natural-relations", inputs: { service: "service", placeholder: "placeholder", autocompleteSelectorFilter: "autocompleteSelectorFilter", displayWith: "displayWith", disabled: "disabled", main: "main", hierarchicSelectorFilters: "hierarchicSelectorFilters", hierarchicSelectorConfig: "hierarchicSelectorConfig", otherName: "otherName", filter: "filter" }, outputs: { selectionChange: "selectionChange" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "select", first: true, predicate: NaturalSelectComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"body\">\n <ng-template #defaultNameCell let-item=\"item\">\n {{ getDisplayFn()(item) }}\n </ng-template>\n\n <table [dataSource]=\"dataSource\" class=\"natural-row-click\" mat-table>\n <tr *matHeaderRowDef=\"displayedColumns\" mat-header-row style=\"display: none\"></tr>\n <tr *matRowDef=\"let row; columns: displayedColumns\" mat-row></tr>\n\n <ng-container matColumnDef=\"name\">\n <th *matHeaderCellDef i18n mat-header-cell>Titre</th>\n <td *matCellDef=\"let item\" mat-cell>\n <ng-template\n [ngTemplateOutletContext]=\"{item: item}\"\n [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultNameCell\"\n />\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"unlink\">\n <th *matHeaderCellDef mat-header-cell></th>\n <td *matCellDef=\"let element\" mat-cell>\n @if (!disabled) {\n <button\n (click)=\"removeRelation(element)\"\n [disabled]=\"removing.has(element)\"\n color=\"warn\"\n mat-icon-button\n i18n-matTooltip\n matTooltip=\"Dissocier\"\n >\n <mat-icon naturalIcon=\"link_off\" />\n </button>\n }\n </td>\n </ng-container>\n </table>\n\n @if (dataSource.data && (dataSource.data.length || 0) > (dataSource.data.pageSize || 0)) {\n <mat-paginator\n (page)=\"pagination($event)\"\n [length]=\"dataSource.data.length || 0\"\n [pageIndex]=\"dataSource.data.pageIndex || 0\"\n [pageSizeOptions]=\"pageSizeOptions\"\n [pageSize]=\"dataSource.data.pageSize || 0\"\n />\n }\n\n @if (!loading && dataSource.data?.length === 0) {\n <div class=\"margin-v mat-body\">\n <span i18n>Aucun r\u00E9sultat</span>\n </div>\n }\n\n @if (loading) {\n <mat-progress-spinner [diameter]=\"40\" class=\"loading\" mode=\"indeterminate\" />\n }\n</div>\n\n@if (!disabled) {\n @if (hierarchicSelectorConfig) {\n <div>\n <button (click)=\"openNaturalHierarchicSelector()\" color=\"primary\" mat-flat-button>{{ placeholder }}</button>\n </div>\n } @else {\n <natural-select\n (selectionChange)=\"addRelations([$event])\"\n [displayWith]=\"$any(getDisplayFn())\"\n [filter]=\"autocompleteSelectorFilter\"\n [placeholder]=\"placeholder\"\n [service]=\"service\"\n [showIcon]=\"false\"\n />\n }\n}\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host .body{display:flex;flex-direction:column}:host .loading{margin:20px auto}:host .mat-column-unlink{width:2.5em}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i4$3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4$3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4$3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4$3.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i4$3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4$3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4$3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4$3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4$3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4$3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i7$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NaturalIconDirective, selector: "mat-icon[naturalIcon]", inputs: ["naturalIcon", "size"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i8$2.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i8.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: NaturalSelectComponent, selector: "natural-select", inputs: ["service", "optionRequired", "searchField", "searchOperator", "filter", "disabled"] }] }); }
10000
10006
  }
10001
10007
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: NaturalRelationsComponent, decorators: [{
10002
10008
  type: Component,
@@ -10010,7 +10016,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
10010
10016
  MatPaginatorModule,
10011
10017
  MatProgressSpinnerModule,
10012
10018
  NaturalSelectComponent,
10013
- ], template: "<div class=\"body\">\n <ng-template #defaultNameCell let-item=\"item\">\n {{ getDisplayFn()(item) }}\n </ng-template>\n\n @if (dataSource) {\n <table [dataSource]=\"dataSource\" class=\"natural-row-click\" mat-table>\n <tr *matHeaderRowDef=\"displayedColumns\" mat-header-row style=\"display: none\"></tr>\n <tr *matRowDef=\"let row; columns: displayedColumns\" mat-row></tr>\n\n <ng-container matColumnDef=\"name\">\n <th *matHeaderCellDef i18n mat-header-cell>Titre</th>\n <td *matCellDef=\"let item\" mat-cell>\n <ng-template\n [ngTemplateOutletContext]=\"{item: item}\"\n [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultNameCell\"\n />\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"unlink\">\n <th *matHeaderCellDef mat-header-cell></th>\n <td *matCellDef=\"let element\" mat-cell>\n @if (!disabled) {\n <button\n (click)=\"removeRelation(element)\"\n [disabled]=\"removing.has(element)\"\n color=\"warn\"\n mat-icon-button\n i18n-matTooltip\n matTooltip=\"Dissocier\"\n >\n <mat-icon naturalIcon=\"link_off\" />\n </button>\n }\n </td>\n </ng-container>\n </table>\n }\n\n @if (dataSource?.data && (dataSource?.data?.length || 0) > (dataSource?.data?.pageSize || 0)) {\n <mat-paginator\n (page)=\"pagination($event)\"\n [length]=\"dataSource?.data?.length || 0\"\n [pageIndex]=\"dataSource?.data?.pageIndex || 0\"\n [pageSizeOptions]=\"pageSizeOptions\"\n [pageSize]=\"dataSource?.data?.pageSize || 0\"\n />\n }\n\n @if (!loading && dataSource?.data?.length === 0) {\n <div class=\"margin-v mat-body\">\n <span i18n>Aucun r\u00E9sultat</span>\n </div>\n }\n\n @if (loading) {\n <mat-progress-spinner [diameter]=\"40\" class=\"loading\" mode=\"indeterminate\" />\n }\n</div>\n\n@if (!hierarchicSelectorConfig && service && !disabled) {\n <natural-select\n (selectionChange)=\"addRelations([$event])\"\n [displayWith]=\"$any(getDisplayFn())\"\n [filter]=\"autocompleteSelectorFilter\"\n [placeholder]=\"placeholder\"\n [service]=\"service\"\n [showIcon]=\"false\"\n />\n}\n\n@if (hierarchicSelectorConfig && !disabled) {\n <div>\n <button (click)=\"openNaturalHierarchicSelector()\" color=\"primary\" mat-flat-button>{{ placeholder }}</button>\n </div>\n}\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host .body{display:flex;flex-direction:column}:host .loading{margin:20px auto}:host .mat-column-unlink{width:2.5em}\n"] }]
10019
+ ], template: "<div class=\"body\">\n <ng-template #defaultNameCell let-item=\"item\">\n {{ getDisplayFn()(item) }}\n </ng-template>\n\n <table [dataSource]=\"dataSource\" class=\"natural-row-click\" mat-table>\n <tr *matHeaderRowDef=\"displayedColumns\" mat-header-row style=\"display: none\"></tr>\n <tr *matRowDef=\"let row; columns: displayedColumns\" mat-row></tr>\n\n <ng-container matColumnDef=\"name\">\n <th *matHeaderCellDef i18n mat-header-cell>Titre</th>\n <td *matCellDef=\"let item\" mat-cell>\n <ng-template\n [ngTemplateOutletContext]=\"{item: item}\"\n [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultNameCell\"\n />\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"unlink\">\n <th *matHeaderCellDef mat-header-cell></th>\n <td *matCellDef=\"let element\" mat-cell>\n @if (!disabled) {\n <button\n (click)=\"removeRelation(element)\"\n [disabled]=\"removing.has(element)\"\n color=\"warn\"\n mat-icon-button\n i18n-matTooltip\n matTooltip=\"Dissocier\"\n >\n <mat-icon naturalIcon=\"link_off\" />\n </button>\n }\n </td>\n </ng-container>\n </table>\n\n @if (dataSource.data && (dataSource.data.length || 0) > (dataSource.data.pageSize || 0)) {\n <mat-paginator\n (page)=\"pagination($event)\"\n [length]=\"dataSource.data.length || 0\"\n [pageIndex]=\"dataSource.data.pageIndex || 0\"\n [pageSizeOptions]=\"pageSizeOptions\"\n [pageSize]=\"dataSource.data.pageSize || 0\"\n />\n }\n\n @if (!loading && dataSource.data?.length === 0) {\n <div class=\"margin-v mat-body\">\n <span i18n>Aucun r\u00E9sultat</span>\n </div>\n }\n\n @if (loading) {\n <mat-progress-spinner [diameter]=\"40\" class=\"loading\" mode=\"indeterminate\" />\n }\n</div>\n\n@if (!disabled) {\n @if (hierarchicSelectorConfig) {\n <div>\n <button (click)=\"openNaturalHierarchicSelector()\" color=\"primary\" mat-flat-button>{{ placeholder }}</button>\n </div>\n } @else {\n <natural-select\n (selectionChange)=\"addRelations([$event])\"\n [displayWith]=\"$any(getDisplayFn())\"\n [filter]=\"autocompleteSelectorFilter\"\n [placeholder]=\"placeholder\"\n [service]=\"service\"\n [showIcon]=\"false\"\n />\n }\n}\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host .body{display:flex;flex-direction:column}:host .loading{margin:20px auto}:host .mat-column-unlink{width:2.5em}\n"] }]
10014
10020
  }], ctorParameters: () => [{ type: NaturalLinkMutationService }, { type: NaturalHierarchicSelectorDialogService }], propDecorators: { select: [{
10015
10021
  type: ViewChild,
10016
10022
  args: [NaturalSelectComponent]
@@ -10018,7 +10024,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
10018
10024
  type: ContentChild,
10019
10025
  args: [TemplateRef]
10020
10026
  }], service: [{
10021
- type: Input
10027
+ type: Input,
10028
+ args: [{ required: true }]
10022
10029
  }], placeholder: [{
10023
10030
  type: Input
10024
10031
  }], autocompleteSelectorFilter: [{