nuxeo-development-framework 5.2.5 → 5.2.6

package/bundles/nuxeo-development-framework.umd.js

@@ -19927,7 +19927,7 @@
       return FiltersPanelComponent;
   }(BaseFiltersPanel));
   FiltersPanelComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FiltersPanelComponent, deps: [{ token: i1__namespace.TranslateService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  FiltersPanelComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FiltersPanelComponent, selector: "app-filters-panel", inputs: { aggregations: "aggregations", fields: "fields", activeQuery: "activeQuery" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0__namespace, template: "<div [formGroup]=\"formGroup\" class=\"filters-panel\" [dir]=\"direction$ | async\">\r\n\t<div class=\"reset-filter flex reset-container\">\r\n\t\t<button mat-stroked-button class=\"w-full\" (click)=\"resetFilters()\" [disabled]=\"!hasValues\">\r\n\t\t\t{{ 'BUTTONS.clearFilter' | translate }}\r\n\t\t</button>\r\n\t</div>\r\n\t<ng-container *ngFor=\"let field of fields | filterByRoles; trackBy: trackByFieldKey\">\r\n\t\t<ng-container *permission=\"{ name: field.config?.permission }\">\r\n\t\t\t<app-predicate-field\r\n\t\t\t\t*ngIf=\"field.type == fieldTypes.predicate\"\r\n\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t></app-predicate-field>\r\n\t\t\t<app-aggregation-field\r\n\t\t\t\t*ngIf=\"field.type == fieldTypes.aggregation && !!aggregations\"\r\n\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t[aggregation]=\"aggregations[field.config.aggregation]\"\r\n\t\t\t\t[contentTemplate]=\"getContentTemplate(field.config.render.type)\"\r\n\t\t\t></app-aggregation-field>\r\n\t\t\t<app-custom-field\r\n\t\t\t\t*ngIf=\"field.type == fieldTypes.custom\"\r\n\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t\t[aggregations]=\"aggregations\"\r\n\t\t\t></app-custom-field>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</div>\r\n", styles: [".filters-panel{display:var(--filters-panel-display, flex);flex-direction:var(--filters-panel-direction, column);grid-gap:var(--filters-panel-gap, .5rem);gap:var(--filters-panel-gap, .5rem);flex-wrap:var(--filters-panel-wrap, wrap);max-width:100%;box-sizing:border-box}.aggregation-field{padding-inline:var(--af-padding-inline, var(--ff-padding-inline, .5rem));padding-block:var(--af-padding-block, var(--ff-padding-block, 0));max-width:100%}.reset-container{padding:.5rem;position:sticky;top:-8px;z-index:4;background:var(--reset-filter-panel-bg, #fff)}.reset-container button.mat-button-base{background-color:var(--reset-filter-panel-btn-bg, transparent);border-color:var(--reset-filter-panel-btn-bg, #e2e8f0)}\n"], components: [{ type: i1__namespace$b.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"] }, { type: PredicateFieldComponent, selector: "app-predicate-field" }, { type: AggregationFieldComponent, selector: "app-aggregation-field", inputs: ["aggregation", "contentTemplate"] }, { type: CustomFieldComponent, selector: "app-custom-field", inputs: ["aggregations"] }], directives: [{ type: i2__namespace$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4__namespace.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$5.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "async": i4__namespace$1.AsyncPipe, "translate": i1__namespace.TranslatePipe, "filterByRoles": FiltersByRolesPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+  FiltersPanelComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FiltersPanelComponent, selector: "app-filters-panel", inputs: { aggregations: "aggregations", fields: "fields", activeQuery: "activeQuery" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0__namespace, template: "<div [formGroup]=\"formGroup\" class=\"filters-panel\" [dir]=\"direction$ | async\">\r\n\t<div class=\"reset-filter flex reset-container\">\r\n\t\t<button mat-stroked-button class=\"w-full\" (click)=\"resetFilters()\" [disabled]=\"!hasValues\">\r\n\t\t\t{{ 'BUTTONS.clearFilter' | translate }}\r\n\t\t</button>\r\n\t</div>\r\n\t<ng-container *ngFor=\"let field of fields | filterByRoles; trackBy: trackByFieldKey\">\r\n\t\t<ng-container *permission=\"{ name: field.config?.permission }\">\r\n\t\t\t<app-predicate-field\r\n\t\t\t\t*ngIf=\"field.type == fieldTypes.predicate\"\r\n\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t></app-predicate-field>\r\n\t\t\t<app-aggregation-field\r\n\t\t\t\t*ngIf=\"field.type == fieldTypes.aggregation && !!aggregations\"\r\n\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t[aggregation]=\"aggregations[field.config.aggregation]\"\r\n\t\t\t\t[contentTemplate]=\"getContentTemplate(field.config.render.type)\"\r\n\t\t\t></app-aggregation-field>\r\n\t\t\t<app-custom-field\r\n\t\t\t\t*ngIf=\"field.type == fieldTypes.custom\"\r\n\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t\t[aggregations]=\"aggregations\"\r\n\t\t\t></app-custom-field>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</div>\r\n", styles: [".filters-panel{display:var(--filters-panel-display, flex);flex-direction:var(--filters-panel-direction, column);grid-gap:var(--filters-panel-gap, .5rem);gap:var(--filters-panel-gap, .5rem);flex-wrap:var(--filters-panel-wrap, wrap);max-width:100%;box-sizing:border-box}.aggregation-field{padding-inline:var(--af-padding-inline, var(--ff-padding-inline, .5rem));padding-block:var(--af-padding-block, var(--ff-padding-block, 0));max-width:100%}.reset-container{padding:.5rem;position:sticky;top:-8px;z-index:4;background:var(--reset-filter-panel-bg, #fff)}.reset-container button.mat-button-base{background-color:var(--reset-filter-panel-btn-bg, transparent);border-color:var(--reset-filter-panel-btn-bg, #e2e8f0);color:var(--reset-filter-panel-btn-color, currentColor)}\n"], components: [{ type: i1__namespace$b.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"] }, { type: PredicateFieldComponent, selector: "app-predicate-field" }, { type: AggregationFieldComponent, selector: "app-aggregation-field", inputs: ["aggregation", "contentTemplate"] }, { type: CustomFieldComponent, selector: "app-custom-field", inputs: ["aggregations"] }], directives: [{ type: i2__namespace$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4__namespace.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$5.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "async": i4__namespace$1.AsyncPipe, "translate": i1__namespace.TranslatePipe, "filterByRoles": FiltersByRolesPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FiltersPanelComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -42522,6 +42522,172 @@
     legendMargin: legendMargin
   });
 
+  var NdfTabsComponent = /** @class */ (function (_super) {
+      __extends(NdfTabsComponent, _super);
+      function NdfTabsComponent(injector, evaluatorsService) {
+          var _this = _super.call(this, injector) || this;
+          _this.evaluatorsService = evaluatorsService;
+          _this._showHeader = true;
+          _this.isAllowdTabFn = function (_) { return true; };
+          _this.activeTabEmitter = new i0.EventEmitter();
+          _this.checkingPermission = false;
+          return _this;
+      }
+      Object.defineProperty(NdfTabsComponent.prototype, "showHeader", {
+          get: function () {
+              return this._showHeader;
+          },
+          set: function (value) {
+              this._showHeader = value;
+          },
+          enumerable: false,
+          configurable: true
+      });
+      NdfTabsComponent.prototype.ngOnInit = function () {
+          this.checkTabsPermissions();
+      };
+      NdfTabsComponent.prototype.checkTabsPermissions = function () {
+          var _this = this;
+          this.checkingPermission = true;
+          var permissionCalls = [];
+          var createPermissionCall = function (id, permission, secondaryTab) {
+              if (secondaryTab === void 0) { secondaryTab = false; }
+              if (permission) {
+                  return rxjs.from(_this.evaluatorsService.evaluateRule(permission)).pipe(operators.map(function (res) { return ({ id: id, enabled: res, secondaryTab: secondaryTab }); }));
+              }
+              return rxjs.of({ id: id, enabled: true, secondaryTab: secondaryTab });
+          };
+          this.tabs.forEach(function (tab) {
+              var _a;
+              permissionCalls.push(createPermissionCall(tab.id, tab.permission));
+              (_a = tab.secondary_tabs) === null || _a === void 0 ? void 0 : _a.forEach(function (subTab) {
+                  permissionCalls.push(createPermissionCall(subTab.id, subTab.permission, true));
+              });
+          });
+          rxjs.forkJoin(permissionCalls)
+              .pipe(operators.takeUntil(this.destroy$), operators.tap(function (results) {
+              var secondaryTabsPerms = results.filter(function (r) { return r.secondaryTab; });
+              var primaryTabsPerms = results.filter(function (r) { return !r.secondaryTab; });
+              var filteredTabs = _.cloneDeep(_this.tabs);
+              filteredTabs = filteredTabs
+                  .filter(function (tab) { return primaryTabsPerms.some(function (p) { return p.id === tab.id && p.enabled; }); })
+                  .map(function (tab) {
+                  var _a;
+                  if ((_a = tab.secondary_tabs) === null || _a === void 0 ? void 0 : _a.length) {
+                      tab.secondary_tabs = tab.secondary_tabs.filter(function (sub) { return secondaryTabsPerms.some(function (p) { return p.id === sub.id && p.enabled; }); });
+                  }
+                  return tab;
+              });
+              _this.tabs = filteredTabs;
+          }))
+              .subscribe(function () {
+              if (_this.tabs.length) {
+                  _this.activateTab(_this.tabs[0]);
+              }
+              _this.checkingPermission = false;
+          });
+      };
+      Object.defineProperty(NdfTabsComponent.prototype, "activatedTabId", {
+          get: function () {
+              var _a, _b, _c;
+              return (_a = this.activeTab) !== null && _a !== void 0 ? _a : (_c = (_b = this.tabs) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.id;
+          },
+          enumerable: false,
+          configurable: true
+      });
+      Object.defineProperty(NdfTabsComponent.prototype, "activatedTab", {
+          get: function () {
+              var _this = this;
+              return this.tabs.find(function (_d) {
+                  var id = _d.id;
+                  return id === _this.activatedTabId;
+              });
+          },
+          enumerable: false,
+          configurable: true
+      });
+      NdfTabsComponent.prototype.activateTab = function (tab) {
+          this.activeTab = tab.id;
+          this.activeTabEmitter.emit(tab);
+      };
+      NdfTabsComponent.prototype.ngOnDestroy = function () {
+          this.destroy$.next();
+          this.destroy$.complete();
+      };
+      NdfTabsComponent.prototype.isEnabledTab = function (tabId) {
+          var _a;
+          return (_a = tabId.isEnable) !== null && _a !== void 0 ? _a : true;
+      };
+      return NdfTabsComponent;
+  }(BaseComponent));
+  NdfTabsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NdfTabsComponent, deps: [{ token: i0__namespace.Injector }, { token: EvaluatorsService }], target: i0__namespace.ɵɵFactoryTarget.Component });
+  NdfTabsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: NdfTabsComponent, selector: "ndf-tabs", inputs: { tabs: "tabs", showHeader: "showHeader", isAllowdTabFn: "isAllowdTabFn" }, outputs: { activeTabEmitter: "activeTabEmitter" }, host: { classAttribute: "w-full h-full" }, queries: [{ propertyName: "tabHeader", first: true, predicate: ["tabHeader"], descendants: true, read: i0.TemplateRef }, { propertyName: "headerOptions", first: true, predicate: ["headerOptions"], descendants: true, read: i0.TemplateRef }, { propertyName: "tabBody", first: true, predicate: ["tabBody"], descendants: true, read: i0.TemplateRef }], usesInheritance: true, ngImport: i0__namespace, template: "<div class=\"flex flex-col ndf-tabs-wrapper rounded-md overflow-auto px-0.5\" *ngIf=\"!checkingPermission\">\r\n\t<div\r\n\t\tclass=\"tabs-header flex justify-between items-center w-full border-b\"\r\n\t\t[@visibilitySlide]=\"showHeader\"\r\n\t\t[class.overflow-hidden]=\"!showHeader\"\r\n\t>\r\n\t\t<div class=\"tabs-wrapper flex justify-start items-center gap-2.5 self-stretch\">\r\n\t\t\t<ng-container *ngFor=\"let tab of tabs\">\r\n\t\t\t\t<ng-container *ngIf=\"isEnabledTab(tab) && isAllowdTabFn(tab)\">\r\n\t\t\t\t\t<div\r\n\t\t\t\t\t\t[ngClass]=\"{\r\n\t\t\t\t\t\t\t'selected-tab': activeTab === tab.id\r\n\t\t\t\t\t\t}\"\r\n\t\t\t\t\t\tclass=\"tab-item flex p-4 justify-center items-center gap-2.5 rounded-t-md font-medium text-xl cursor-pointer\"\r\n\t\t\t\t\t\t(click)=\"activateTab(tab)\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t<ng-template\r\n\t\t\t\t\t\t\t[ngTemplateOutlet]=\"tabHeader || defaultHeader\"\r\n\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: tab }\"\r\n\t\t\t\t\t\t></ng-template>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</ng-container>\r\n\t\t\t</ng-container>\r\n\t\t</div>\r\n\t\t<ng-template\r\n\t\t\t[ngTemplateOutlet]=\"headerOptions\"\r\n\t\t\t[ngTemplateOutletContext]=\"{ $implicit: activatedTab }\"\r\n\t\t></ng-template>\r\n\t</div>\r\n\t<ng-template\r\n\t\t[ngTemplateOutlet]=\"tabBody || defaultBody\"\r\n\t\t[ngTemplateOutletContext]=\"{ $implicit: activatedTab }\"\r\n\t></ng-template>\r\n</div>\r\n\r\n<ng-template #defaultHeader let-tab>{{ tab.label | translate }}</ng-template>\r\n<ng-template #defaultBody>Default Body</ng-template>\r\n", styles: [":host{display:block}.ndf-tabs-wrapper{background-color:var(--ndf-tabs-body, #fff);border-radius:8px 8px 0 0;overflow:hidden!important;height:calc(100vh - 100px)}.ndf-tabs-wrapper .tabs-header{background-color:var(--ndf-tabs-header, #fff)}\n"], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "translate": i1__namespace.TranslatePipe }, animations: [
+          animations.trigger('visibilitySlide', [
+              animations.state('true', animations.style({ height: '*', visibility: '*' })),
+              animations.state('false', animations.style({ height: '0', visibility: 'hidden' })),
+              animations.transition('false => true', animations.animate('150ms ease-out')),
+              animations.transition('true => false', animations.animate('150ms ease-in'))
+          ])
+      ] });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NdfTabsComponent, decorators: [{
+              type: i0.Component,
+              args: [{
+                      selector: 'ndf-tabs',
+                      templateUrl: './ndf-tabs.component.html',
+                      styleUrls: ['./ndf-tabs.component.scss'],
+                      host: { class: 'w-full h-full' },
+                      animations: [
+                          animations.trigger('visibilitySlide', [
+                              animations.state('true', animations.style({ height: '*', visibility: '*' })),
+                              animations.state('false', animations.style({ height: '0', visibility: 'hidden' })),
+                              animations.transition('false => true', animations.animate('150ms ease-out')),
+                              animations.transition('true => false', animations.animate('150ms ease-in'))
+                          ])
+                      ]
+                  }]
+          }], ctorParameters: function () { return [{ type: i0__namespace.Injector }, { type: EvaluatorsService }]; }, propDecorators: { tabHeader: [{
+                  type: i0.ContentChild,
+                  args: ['tabHeader', { read: i0.TemplateRef }]
+              }], headerOptions: [{
+                  type: i0.ContentChild,
+                  args: ['headerOptions', { read: i0.TemplateRef }]
+              }], tabBody: [{
+                  type: i0.ContentChild,
+                  args: ['tabBody', { read: i0.TemplateRef }]
+              }], tabs: [{
+                  type: i0.Input
+              }], showHeader: [{
+                  type: i0.Input
+              }], isAllowdTabFn: [{
+                  type: i0.Input
+              }], activeTabEmitter: [{
+                  type: i0.Output
+              }] } });
+
+  var NdfTabsModule = /** @class */ (function () {
+      function NdfTabsModule() {
+      }
+      return NdfTabsModule;
+  }());
+  NdfTabsModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NdfTabsModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+  NdfTabsModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NdfTabsModule, declarations: [NdfTabsComponent], imports: [i4.CommonModule,
+          i1.TranslateModule], exports: [NdfTabsComponent] });
+  NdfTabsModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NdfTabsModule, imports: [[
+              i4.CommonModule,
+              i1.TranslateModule
+          ]] });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NdfTabsModule, decorators: [{
+              type: i0.NgModule,
+              args: [{
+                      declarations: [NdfTabsComponent],
+                      imports: [
+                          i4.CommonModule,
+                          i1.TranslateModule
+                      ],
+                      exports: [NdfTabsComponent]
+                  }]
+          }] });
+
   /*
    * Public API Surface of nuxeo-development-framework
    */
@@ -42823,6 +42989,8 @@
   exports.NdfTableComponent = NdfTableComponent;
   exports.NdfTableModule = NdfTableModule;
   exports.NdfTableService = NdfTableService;
+  exports.NdfTabsComponent = NdfTabsComponent;
+  exports.NdfTabsModule = NdfTabsModule;
   exports.NdfTransformService = NdfTransformService;
   exports.NgxHijriGregorianDatepickerModule = NgxHijriGregorianDatepickerModule;
   exports.NoDataComponent = NoDataComponent;