@datarailsshared/datarailsshared 1.4.203-rocket → 1.4.204-rocket

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.
@@ -1,30 +1,49 @@
1
- import { Component, ContentChildren, EventEmitter, Input, Output, QueryList, } from '@angular/core';
1
+ import { ChangeDetectorRef, Component, ContentChildren, EventEmitter, Input, Output, QueryList, } from '@angular/core';
2
2
  import { DrTabComponent } from './dr-tab.component';
3
3
  import * as i0 from "@angular/core";
4
4
  import * as i1 from "@angular/common";
5
- import * as i2 from "@angular/material/legacy-tabs";
5
+ import * as i2 from "@angular/material/tabs";
6
6
  import * as i3 from "@angular/forms";
7
7
  import * as i4 from "../dr-inputs/radio-button/radio-button.component";
8
8
  import * as i5 from "../dr-tooltip/dr-tooltip.directive";
9
9
  export class DrTabsComponent {
10
- constructor() {
10
+ set selectedTab(value) {
11
+ this._selectedIndex = value || 0;
12
+ /**
13
+ * Hack to disable animation calculation in case the pre-selected tab is not at index 0.
14
+ * Otherwise, the animation of redirecting to the pre-selected tab will conflict
15
+ * with the animation of the tab at index 0.
16
+ */
17
+ if (this._selectedIndex) {
18
+ this._disableAnimation = true;
19
+ setTimeout(() => {
20
+ this._disableAnimation = false;
21
+ });
22
+ }
23
+ }
24
+ ;
25
+ constructor(cdr) {
26
+ this.cdr = cdr;
27
+ this._disableAnimation = true;
28
+ this._selectedIndex = 0;
11
29
  this.theme = 'primary';
12
- this.selectedTab = 0;
13
30
  this.noBodyPadding = false;
31
+ this.hideTabs = false;
32
+ this.noHeaderBorder = false;
14
33
  this.noTabLabelsPadding = false;
15
34
  this.selectedTabChange = new EventEmitter();
16
35
  }
17
36
  selectedIndexChange($event) {
18
- this.selectedTab = $event;
37
+ this._selectedIndex = $event;
19
38
  this.selectedTabChange.emit($event);
20
39
  }
21
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
22
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.5", type: DrTabsComponent, selector: "dr-tabs", inputs: { theme: "theme", selectedTab: "selectedTab", withRadio: "withRadio", withIcon: "withIcon", vertical: "vertical", noBodyPadding: "noBodyPadding", noTabLabelsPadding: "noTabLabelsPadding" }, outputs: { selectedTabChange: "selectedTabChange" }, queries: [{ propertyName: "tabsContentList", predicate: DrTabComponent }], ngImport: i0, template: "<mat-tab-group disableRipple\n [ngClass]=\"theme\"\n [selectedIndex]=\"selectedTab\"\n (selectedIndexChange)=\"selectedIndexChange($event)\"\n [class.with-radio]=\"withRadio\"\n [class.vertical]=\"vertical\"\n [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n [class.no-body-padding]=\"noBodyPadding\"\n [animationDuration]=\" vertical ? '0ms' : '500ms'\">\n <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n <ng-container *ngIf=\"withRadio\">\n <ng-template mat-tab-label>\n <dr-radio-button [value]=\"index\"\n [(ngModel)]=\"selectedTab\">\n </dr-radio-button>\n {{ tab.label }}\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n <ng-template mat-tab-label>\n <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"withIcon\">\n <ng-template mat-tab-label>\n <span class=\"icon-tab__wrapper\">\n <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n </span>\n </ng-template>\n </ng-container>\n <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-tab-group,:host ::ng-deep .mat-tab-body-wrapper{height:100%}:host ::ng-deep .mat-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-tab-nav-bar,:host ::ng-deep .mat-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-tab-labels{padding:0 17px}:host ::ng-deep .mat-tab-label{padding:0 8px;min-width:0;height:38px;opacity:1}:host ::ng-deep .mat-tab-label:not(:last-child){margin-right:21px}:host ::ng-deep .mat-tab-label-active .mat-tab-label-content{color:#4646ce;font-weight:700}:host ::ng-deep .mat-tab-label-content{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif}:host ::ng-deep .mat-ink-bar{height:3px;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .with-radio .mat-tab-labels{padding:0;margin-bottom:8px}:host ::ng-deep .with-radio .mat-tab-label{padding:8px 16px;min-width:0;flex-grow:1;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mat-tab-label:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mat-tab-label-active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mat-tab-label-active .mat-tab-label-content{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mat-ink-bar{display:none!important}:host ::ng-deep .vertical.mat-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-tab-label-container .mat-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-ink-bar{display:none!important}:host ::ng-deep .vertical .mat-tab-label{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-tab-label:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0}:host ::ng-deep .vertical .mat-tab-label-active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-tab-label-active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-tab-label-active .mat-tab-label-content{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep mat-tab-group.no-body-padding .mat-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-tab-labels{padding:0}:host .secondary ::ng-deep .mat-tab-header{border-bottom:none}:host .secondary ::ng-deep .mat-tab-labels{justify-content:space-evenly;padding:0;background:#F2F2FB}:host .secondary ::ng-deep .mat-tab-label{flex:1;margin:0;border-bottom:1px solid #DFE0E3}:host .secondary ::ng-deep .mat-tab-label+.mat-tab-label{border-left:1px solid #DFE0E3}:host .secondary ::ng-deep .mat-tab-label-active{background:white;border-bottom:none}:host .secondary ::ng-deep .mat-tab-label-active .mat-tab-label-content{color:#25258c}:host .secondary ::ng-deep .mat-ink-bar{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.MatLegacyTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { kind: "directive", type: i2.MatLegacyTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i2.MatLegacyTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.RadioButtonComponent, selector: "dr-radio-button", inputs: ["name", "value", "disabled"], outputs: ["valueChange"] }, { kind: "directive", type: i5.DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }] }); }
40
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrTabsComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
41
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.5", type: DrTabsComponent, selector: "dr-tabs", inputs: { theme: "theme", selectedTab: "selectedTab", withRadio: "withRadio", withIcon: "withIcon", vertical: "vertical", noBodyPadding: "noBodyPadding", hideTabs: "hideTabs", noHeaderBorder: "noHeaderBorder", noTabLabelsPadding: "noTabLabelsPadding" }, outputs: { selectedTabChange: "selectedTabChange" }, queries: [{ propertyName: "tabsContentList", predicate: DrTabComponent }], ngImport: i0, template: "<mat-tab-group disableRipple\n [ngClass]=\"theme\"\n [selectedIndex]=\"_selectedIndex\"\n (selectedIndexChange)=\"selectedIndexChange($event)\"\n [class.with-radio]=\"withRadio\"\n [class.vertical]=\"vertical\"\n [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n [class.no-body-padding]=\"noBodyPadding\"\n [class.no-tabs]=\"hideTabs\"\n [class.no-header-border]=\"noHeaderBorder\"\n [animationDuration]=\"vertical || _disableAnimation ? '0ms' : '500ms'\">\n <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n <ng-container *ngIf=\"withRadio\">\n <ng-template mat-tab-label>\n <dr-radio-button [value]=\"index\"\n [(ngModel)]=\"_selectedIndex\">\n </dr-radio-button>\n {{ tab.label }}\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n <ng-template mat-tab-label>\n <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"withIcon\">\n <ng-template mat-tab-label>\n <span class=\"icon-tab__wrapper\">\n <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n </span>\n </ng-template>\n </ng-container>\n <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-mdc-tab-group,:host ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host ::ng-deep .mat-mdc-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-mdc-tab-nav-bar,:host ::ng-deep .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-mdc-tab-labels{padding:0 17px}:host ::ng-deep .mat-mdc-tab,:host ::ng-deep .mat-mdc-tab:hover{-webkit-tap-highlight-color:#FFFFFF}:host ::ng-deep .mat-mdc-tab .mdc-tab__text-label,:host ::ng-deep .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}:host ::ng-deep .mat-mdc-tab .mdc-tab__ripple{display:none}:host ::ng-deep .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}:host ::ng-deep .mdc-tab:not(:last-child){margin-right:21px}:host ::ng-deep .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}:host ::ng-deep .mdc-tab--active .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}:host ::ng-deep .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}:host ::ng-deep .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mdc-tab:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical.mat-mdc-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}:host ::ng-deep .vertical .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep .secondary .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#F2F2FB}:host ::ng-deep .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #DFE0E3}:host ::ng-deep .secondary .mdc-tab+.mdc-tab{border-left:1px solid #DFE0E3}:host ::ng-deep .secondary .mdc-tab--active{background:white;border-bottom:none}:host ::ng-deep .secondary .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}:host ::ng-deep .secondary .mdc-tab-indicator{display:none}:host ::ng-deep mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}:host ::ng-deep mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}:host ::ng-deep mat-tab-group.no-header-border .mat-mdc-tab-header{border-bottom:none!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple", "fitInkBarToContent", "mat-stretch-tabs"], exportAs: ["matTabGroup"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.RadioButtonComponent, selector: "dr-radio-button", inputs: ["name", "value", "disabled"], outputs: ["valueChange"] }, { kind: "directive", type: i5.DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }] }); }
23
42
  }
24
43
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrTabsComponent, decorators: [{
25
44
  type: Component,
26
- args: [{ selector: 'dr-tabs', template: "<mat-tab-group disableRipple\n [ngClass]=\"theme\"\n [selectedIndex]=\"selectedTab\"\n (selectedIndexChange)=\"selectedIndexChange($event)\"\n [class.with-radio]=\"withRadio\"\n [class.vertical]=\"vertical\"\n [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n [class.no-body-padding]=\"noBodyPadding\"\n [animationDuration]=\" vertical ? '0ms' : '500ms'\">\n <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n <ng-container *ngIf=\"withRadio\">\n <ng-template mat-tab-label>\n <dr-radio-button [value]=\"index\"\n [(ngModel)]=\"selectedTab\">\n </dr-radio-button>\n {{ tab.label }}\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n <ng-template mat-tab-label>\n <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"withIcon\">\n <ng-template mat-tab-label>\n <span class=\"icon-tab__wrapper\">\n <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n </span>\n </ng-template>\n </ng-container>\n <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-tab-group,:host ::ng-deep .mat-tab-body-wrapper{height:100%}:host ::ng-deep .mat-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-tab-nav-bar,:host ::ng-deep .mat-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-tab-labels{padding:0 17px}:host ::ng-deep .mat-tab-label{padding:0 8px;min-width:0;height:38px;opacity:1}:host ::ng-deep .mat-tab-label:not(:last-child){margin-right:21px}:host ::ng-deep .mat-tab-label-active .mat-tab-label-content{color:#4646ce;font-weight:700}:host ::ng-deep .mat-tab-label-content{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif}:host ::ng-deep .mat-ink-bar{height:3px;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .with-radio .mat-tab-labels{padding:0;margin-bottom:8px}:host ::ng-deep .with-radio .mat-tab-label{padding:8px 16px;min-width:0;flex-grow:1;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mat-tab-label:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mat-tab-label-active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mat-tab-label-active .mat-tab-label-content{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mat-ink-bar{display:none!important}:host ::ng-deep .vertical.mat-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-tab-label-container .mat-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-ink-bar{display:none!important}:host ::ng-deep .vertical .mat-tab-label{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-tab-label:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0}:host ::ng-deep .vertical .mat-tab-label-active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-tab-label-active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-tab-label-active .mat-tab-label-content{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep mat-tab-group.no-body-padding .mat-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-tab-labels{padding:0}:host .secondary ::ng-deep .mat-tab-header{border-bottom:none}:host .secondary ::ng-deep .mat-tab-labels{justify-content:space-evenly;padding:0;background:#F2F2FB}:host .secondary ::ng-deep .mat-tab-label{flex:1;margin:0;border-bottom:1px solid #DFE0E3}:host .secondary ::ng-deep .mat-tab-label+.mat-tab-label{border-left:1px solid #DFE0E3}:host .secondary ::ng-deep .mat-tab-label-active{background:white;border-bottom:none}:host .secondary ::ng-deep .mat-tab-label-active .mat-tab-label-content{color:#25258c}:host .secondary ::ng-deep .mat-ink-bar{display:none}\n"] }]
27
- }], ctorParameters: function () { return []; }, propDecorators: { theme: [{
45
+ args: [{ selector: 'dr-tabs', template: "<mat-tab-group disableRipple\n [ngClass]=\"theme\"\n [selectedIndex]=\"_selectedIndex\"\n (selectedIndexChange)=\"selectedIndexChange($event)\"\n [class.with-radio]=\"withRadio\"\n [class.vertical]=\"vertical\"\n [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n [class.no-body-padding]=\"noBodyPadding\"\n [class.no-tabs]=\"hideTabs\"\n [class.no-header-border]=\"noHeaderBorder\"\n [animationDuration]=\"vertical || _disableAnimation ? '0ms' : '500ms'\">\n <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n <ng-container *ngIf=\"withRadio\">\n <ng-template mat-tab-label>\n <dr-radio-button [value]=\"index\"\n [(ngModel)]=\"_selectedIndex\">\n </dr-radio-button>\n {{ tab.label }}\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n <ng-template mat-tab-label>\n <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"withIcon\">\n <ng-template mat-tab-label>\n <span class=\"icon-tab__wrapper\">\n <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n </span>\n </ng-template>\n </ng-container>\n <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-mdc-tab-group,:host ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host ::ng-deep .mat-mdc-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-mdc-tab-nav-bar,:host ::ng-deep .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-mdc-tab-labels{padding:0 17px}:host ::ng-deep .mat-mdc-tab,:host ::ng-deep .mat-mdc-tab:hover{-webkit-tap-highlight-color:#FFFFFF}:host ::ng-deep .mat-mdc-tab .mdc-tab__text-label,:host ::ng-deep .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}:host ::ng-deep .mat-mdc-tab .mdc-tab__ripple{display:none}:host ::ng-deep .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}:host ::ng-deep .mdc-tab:not(:last-child){margin-right:21px}:host ::ng-deep .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}:host ::ng-deep .mdc-tab--active .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}:host ::ng-deep .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}:host ::ng-deep .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mdc-tab:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical.mat-mdc-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}:host ::ng-deep .vertical .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep .secondary .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#F2F2FB}:host ::ng-deep .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #DFE0E3}:host ::ng-deep .secondary .mdc-tab+.mdc-tab{border-left:1px solid #DFE0E3}:host ::ng-deep .secondary .mdc-tab--active{background:white;border-bottom:none}:host ::ng-deep .secondary .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}:host ::ng-deep .secondary .mdc-tab-indicator{display:none}:host ::ng-deep mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}:host ::ng-deep mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}:host ::ng-deep mat-tab-group.no-header-border .mat-mdc-tab-header{border-bottom:none!important}\n"] }]
46
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { theme: [{
28
47
  type: Input
29
48
  }], selectedTab: [{
30
49
  type: Input
@@ -36,6 +55,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImpor
36
55
  type: Input
37
56
  }], noBodyPadding: [{
38
57
  type: Input
58
+ }], hideTabs: [{
59
+ type: Input
60
+ }], noHeaderBorder: [{
61
+ type: Input
39
62
  }], noTabLabelsPadding: [{
40
63
  type: Input
41
64
  }], selectedTabChange: [{
@@ -44,4 +67,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImpor
44
67
  type: ContentChildren,
45
68
  args: [DrTabComponent]
46
69
  }] } });
47
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHItdGFicy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kYXRhcmFpbHNzaGFyZWQvc3JjL2xpYi9kci10YWJzL2RyLXRhYnMuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZGF0YXJhaWxzc2hhcmVkL3NyYy9saWIvZHItdGFicy9kci10YWJzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsZUFBZSxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFNBQVMsR0FBRyxNQUFNLGVBQWUsQ0FBQztBQUNwRyxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sb0JBQW9CLENBQUM7Ozs7Ozs7QUFPcEQsTUFBTSxPQUFPLGVBQWU7SUFXeEI7UUFWUyxVQUFLLEdBQVcsU0FBUyxDQUFDO1FBQzFCLGdCQUFXLEdBQUcsQ0FBQyxDQUFDO1FBSWhCLGtCQUFhLEdBQUcsS0FBSyxDQUFDO1FBQ3RCLHVCQUFrQixHQUFHLEtBQUssQ0FBQztRQUMxQixzQkFBaUIsR0FBc0IsSUFBSSxZQUFZLEVBQU8sQ0FBQztJQUl6RSxDQUFDO0lBRUQsbUJBQW1CLENBQUMsTUFBTTtRQUN0QixJQUFJLENBQUMsV0FBVyxHQUFHLE1BQU0sQ0FBQztRQUMxQixJQUFJLENBQUMsaUJBQWlCLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO0lBQ3hDLENBQUM7aUlBakJRLGVBQWU7cUhBQWYsZUFBZSwwVUFTUCxjQUFjLDZCQ2pCbkMsK2pEQWlDQTs7MkZEekJhLGVBQWU7a0JBTDNCLFNBQVM7K0JBQ0ksU0FBUzswRUFLVixLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxhQUFhO3NCQUFyQixLQUFLO2dCQUNHLGtCQUFrQjtzQkFBMUIsS0FBSztnQkFDSSxpQkFBaUI7c0JBQTFCLE1BQU07Z0JBQ2lDLGVBQWU7c0JBQXRELGVBQWU7dUJBQUMsY0FBYyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgQ29udGVudENoaWxkcmVuLCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQsIFF1ZXJ5TGlzdCwgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IERyVGFiQ29tcG9uZW50IH0gZnJvbSAnLi9kci10YWIuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdkci10YWJzJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vZHItdGFicy5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vZHItdGFicy5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBEclRhYnNDb21wb25lbnQge1xuICAgIEBJbnB1dCgpIHRoZW1lOiBzdHJpbmcgPSAncHJpbWFyeSc7XG4gICAgQElucHV0KCkgc2VsZWN0ZWRUYWIgPSAwO1xuICAgIEBJbnB1dCgpIHdpdGhSYWRpbzogYm9vbGVhbjtcbiAgICBASW5wdXQoKSB3aXRoSWNvbjogYm9vbGVhbjtcbiAgICBASW5wdXQoKSB2ZXJ0aWNhbDogYm9vbGVhbjtcbiAgICBASW5wdXQoKSBub0JvZHlQYWRkaW5nID0gZmFsc2U7XG4gICAgQElucHV0KCkgbm9UYWJMYWJlbHNQYWRkaW5nID0gZmFsc2U7XG4gICAgQE91dHB1dCgpIHNlbGVjdGVkVGFiQ2hhbmdlOiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xuICAgIEBDb250ZW50Q2hpbGRyZW4oRHJUYWJDb21wb25lbnQpIHB1YmxpYyB0YWJzQ29udGVudExpc3Q6IFF1ZXJ5TGlzdDxEclRhYkNvbXBvbmVudD47XG5cbiAgICBjb25zdHJ1Y3RvcigpIHtcbiAgICB9XG5cbiAgICBzZWxlY3RlZEluZGV4Q2hhbmdlKCRldmVudCkge1xuICAgICAgICB0aGlzLnNlbGVjdGVkVGFiID0gJGV2ZW50O1xuICAgICAgICB0aGlzLnNlbGVjdGVkVGFiQ2hhbmdlLmVtaXQoJGV2ZW50KTtcbiAgICB9XG5cbn1cbiIsIjxtYXQtdGFiLWdyb3VwIGRpc2FibGVSaXBwbGVcbiAgICAgICAgICAgICAgIFtuZ0NsYXNzXT1cInRoZW1lXCJcbiAgICAgICAgICAgICAgIFtzZWxlY3RlZEluZGV4XT1cInNlbGVjdGVkVGFiXCJcbiAgICAgICAgICAgICAgIChzZWxlY3RlZEluZGV4Q2hhbmdlKT1cInNlbGVjdGVkSW5kZXhDaGFuZ2UoJGV2ZW50KVwiXG4gICAgICAgICAgICAgICBbY2xhc3Mud2l0aC1yYWRpb109XCJ3aXRoUmFkaW9cIlxuICAgICAgICAgICAgICAgW2NsYXNzLnZlcnRpY2FsXT1cInZlcnRpY2FsXCJcbiAgICAgICAgICAgICAgIFtjbGFzcy5uby10YWItbGFiZWxzLXBhZGRpbmddPVwibm9UYWJMYWJlbHNQYWRkaW5nXCJcbiAgICAgICAgICAgICAgIFtjbGFzcy5uby1ib2R5LXBhZGRpbmddPVwibm9Cb2R5UGFkZGluZ1wiXG4gICAgICAgICAgICAgICBbYW5pbWF0aW9uRHVyYXRpb25dPVwiIHZlcnRpY2FsID8gJzBtcycgOiAnNTAwbXMnXCI+XG4gICAgPG1hdC10YWIgKm5nRm9yPVwibGV0IHRhYiBvZiB0YWJzQ29udGVudExpc3Q7IGxldCBpbmRleCA9IGluZGV4XCIgbGFiZWw9XCJ7eyB0YWIubGFiZWwgfX1cIiBbZGlzYWJsZWRdPVwidGFiLmRpc2FibGVkXCI+XG4gICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJ3aXRoUmFkaW9cIj5cbiAgICAgICAgICAgIDxuZy10ZW1wbGF0ZSBtYXQtdGFiLWxhYmVsPlxuICAgICAgICAgICAgICAgIDxkci1yYWRpby1idXR0b24gW3ZhbHVlXT1cImluZGV4XCJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIFsobmdNb2RlbCldPVwic2VsZWN0ZWRUYWJcIj5cbiAgICAgICAgICAgICAgICA8L2RyLXJhZGlvLWJ1dHRvbj5cbiAgICAgICAgICAgICAgICB7eyB0YWIubGFiZWwgfX1cbiAgICAgICAgICAgIDwvbmctdGVtcGxhdGU+XG4gICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwidGFiLnRvb2x0aXAgJiYgIXdpdGhSYWRpbyAmJiAhd2l0aEljb25cIj5cbiAgICAgICAgICAgIDxuZy10ZW1wbGF0ZSBtYXQtdGFiLWxhYmVsPlxuICAgICAgICAgICAgICAgIDxsYWJlbCBjbGFzcz1cImN1cnNvci1wb2ludGVyXCIgW2RyVG9vbHRpcF09XCJ0YWIudG9vbHRpcFwiPnt7IHRhYi5sYWJlbCB9fTwvbGFiZWw+XG4gICAgICAgICAgICA8L25nLXRlbXBsYXRlPlxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIndpdGhJY29uXCI+XG4gICAgICAgICAgICA8bmctdGVtcGxhdGUgbWF0LXRhYi1sYWJlbD5cbiAgICAgICAgICAgICAgICA8c3BhbiBjbGFzcz1cImljb24tdGFiX193cmFwcGVyXCI+XG4gICAgICAgICAgICAgICAgICAgIDxpIFtuZ0NsYXNzXT1cInRhYi5pY29uXCIgY2xhc3M9XCJjdXJzb3ItcG9pbnRlclwiPjwvaT5cbiAgICAgICAgICAgICAgICA8L3NwYW4+XG4gICAgICAgICAgICA8L25nLXRlbXBsYXRlPlxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cInRhYi5jb250ZW50VGVtcGxhdGVcIj48L25nLWNvbnRhaW5lcj5cbiAgICA8L21hdC10YWI+XG48L21hdC10YWItZ3JvdXA+XG4iXX0=
70
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHItdGFicy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kYXRhcmFpbHNzaGFyZWQvc3JjL2xpYi9kci10YWJzL2RyLXRhYnMuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZGF0YXJhaWxzc2hhcmVkL3NyYy9saWIvZHItdGFicy9kci10YWJzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxTQUFTLEVBQUUsZUFBZSxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFNBQVMsR0FBRyxNQUFNLGVBQWUsQ0FBQztBQUN2SCxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sb0JBQW9CLENBQUM7Ozs7Ozs7QUFPcEQsTUFBTSxPQUFPLGVBQWU7SUFJeEIsSUFBYSxXQUFXLENBQUMsS0FBSztRQUMxQixJQUFJLENBQUMsY0FBYyxHQUFHLEtBQUssSUFBSSxDQUFDLENBQUM7UUFFakM7Ozs7V0FJRztRQUNILElBQUksSUFBSSxDQUFDLGNBQWMsRUFBRTtZQUNyQixJQUFJLENBQUMsaUJBQWlCLEdBQUcsSUFBSSxDQUFDO1lBQzlCLFVBQVUsQ0FBQyxHQUFHLEVBQUU7Z0JBQ1osSUFBSSxDQUFDLGlCQUFpQixHQUFHLEtBQUssQ0FBQztZQUNuQyxDQUFDLENBQUMsQ0FBQztTQUNOO0lBQ0wsQ0FBQztJQUFBLENBQUM7SUFXRixZQUFzQixHQUFzQjtRQUF0QixRQUFHLEdBQUgsR0FBRyxDQUFtQjtRQTVCNUMsc0JBQWlCLEdBQUcsSUFBSSxDQUFDO1FBQ3pCLG1CQUFjLEdBQUcsQ0FBQyxDQUFDO1FBQ1YsVUFBSyxHQUFXLFNBQVMsQ0FBQztRQW1CMUIsa0JBQWEsR0FBRyxLQUFLLENBQUM7UUFDdEIsYUFBUSxHQUFHLEtBQUssQ0FBQztRQUNqQixtQkFBYyxHQUFHLEtBQUssQ0FBQztRQUN2Qix1QkFBa0IsR0FBRyxLQUFLLENBQUM7UUFDMUIsc0JBQWlCLEdBQXNCLElBQUksWUFBWSxFQUFPLENBQUM7SUFJekUsQ0FBQztJQUVELG1CQUFtQixDQUFDLE1BQU07UUFDdEIsSUFBSSxDQUFDLGNBQWMsR0FBRyxNQUFNLENBQUM7UUFDN0IsSUFBSSxDQUFDLGlCQUFpQixDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQztJQUN4QyxDQUFDO2lJQW5DUSxlQUFlO3FIQUFmLGVBQWUsa1lBMkJQLGNBQWMsNkJDbkNuQyxrc0RBbUNBOzsyRkQzQmEsZUFBZTtrQkFMM0IsU0FBUzsrQkFDSSxTQUFTO3dHQU9WLEtBQUs7c0JBQWIsS0FBSztnQkFDTyxXQUFXO3NCQUF2QixLQUFLO2dCQWVHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLGFBQWE7c0JBQXJCLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxjQUFjO3NCQUF0QixLQUFLO2dCQUNHLGtCQUFrQjtzQkFBMUIsS0FBSztnQkFDSSxpQkFBaUI7c0JBQTFCLE1BQU07Z0JBQ2lDLGVBQWU7c0JBQXRELGVBQWU7dUJBQUMsY0FBYyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdG9yUmVmLCBDb21wb25lbnQsIENvbnRlbnRDaGlsZHJlbiwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0LCBRdWVyeUxpc3QsIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBEclRhYkNvbXBvbmVudCB9IGZyb20gJy4vZHItdGFiLmNvbXBvbmVudCc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnZHItdGFicycsXG4gICAgdGVtcGxhdGVVcmw6ICcuL2RyLXRhYnMuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL2RyLXRhYnMuY29tcG9uZW50LnNjc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgRHJUYWJzQ29tcG9uZW50IHtcbiAgICBfZGlzYWJsZUFuaW1hdGlvbiA9IHRydWU7XG4gICAgX3NlbGVjdGVkSW5kZXggPSAwO1xuICAgIEBJbnB1dCgpIHRoZW1lOiBzdHJpbmcgPSAncHJpbWFyeSc7XG4gICAgQElucHV0KCkgc2V0IHNlbGVjdGVkVGFiKHZhbHVlKSB7XG4gICAgICAgIHRoaXMuX3NlbGVjdGVkSW5kZXggPSB2YWx1ZSB8fCAwO1xuXG4gICAgICAgIC8qKlxuICAgICAgICAgKiBIYWNrIHRvIGRpc2FibGUgYW5pbWF0aW9uIGNhbGN1bGF0aW9uIGluIGNhc2UgdGhlIHByZS1zZWxlY3RlZCB0YWIgaXMgbm90IGF0IGluZGV4IDAuXG4gICAgICAgICAqIE90aGVyd2lzZSwgdGhlIGFuaW1hdGlvbiBvZiByZWRpcmVjdGluZyB0byB0aGUgcHJlLXNlbGVjdGVkIHRhYiB3aWxsIGNvbmZsaWN0XG4gICAgICAgICAqIHdpdGggdGhlIGFuaW1hdGlvbiBvZiB0aGUgdGFiIGF0IGluZGV4IDAuXG4gICAgICAgICAqL1xuICAgICAgICBpZiAodGhpcy5fc2VsZWN0ZWRJbmRleCkge1xuICAgICAgICAgICAgdGhpcy5fZGlzYWJsZUFuaW1hdGlvbiA9IHRydWU7XG4gICAgICAgICAgICBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgICAgICAgICAgICB0aGlzLl9kaXNhYmxlQW5pbWF0aW9uID0gZmFsc2U7XG4gICAgICAgICAgICB9KTtcbiAgICAgICAgfVxuICAgIH07XG4gICAgQElucHV0KCkgd2l0aFJhZGlvOiBib29sZWFuO1xuICAgIEBJbnB1dCgpIHdpdGhJY29uOiBib29sZWFuO1xuICAgIEBJbnB1dCgpIHZlcnRpY2FsOiBib29sZWFuO1xuICAgIEBJbnB1dCgpIG5vQm9keVBhZGRpbmcgPSBmYWxzZTtcbiAgICBASW5wdXQoKSBoaWRlVGFicyA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIG5vSGVhZGVyQm9yZGVyID0gZmFsc2U7XG4gICAgQElucHV0KCkgbm9UYWJMYWJlbHNQYWRkaW5nID0gZmFsc2U7XG4gICAgQE91dHB1dCgpIHNlbGVjdGVkVGFiQ2hhbmdlOiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xuICAgIEBDb250ZW50Q2hpbGRyZW4oRHJUYWJDb21wb25lbnQpIHB1YmxpYyB0YWJzQ29udGVudExpc3Q6IFF1ZXJ5TGlzdDxEclRhYkNvbXBvbmVudD47XG5cbiAgICBjb25zdHJ1Y3Rvcihwcm90ZWN0ZWQgY2RyOiBDaGFuZ2VEZXRlY3RvclJlZikge1xuICAgIH1cblxuICAgIHNlbGVjdGVkSW5kZXhDaGFuZ2UoJGV2ZW50KSB7XG4gICAgICAgIHRoaXMuX3NlbGVjdGVkSW5kZXggPSAkZXZlbnQ7XG4gICAgICAgIHRoaXMuc2VsZWN0ZWRUYWJDaGFuZ2UuZW1pdCgkZXZlbnQpO1xuICAgIH1cblxufVxuIiwiPG1hdC10YWItZ3JvdXAgZGlzYWJsZVJpcHBsZVxuICAgICAgICAgICAgICAgW25nQ2xhc3NdPVwidGhlbWVcIlxuICAgICAgICAgICAgICAgW3NlbGVjdGVkSW5kZXhdPVwiX3NlbGVjdGVkSW5kZXhcIlxuICAgICAgICAgICAgICAgKHNlbGVjdGVkSW5kZXhDaGFuZ2UpPVwic2VsZWN0ZWRJbmRleENoYW5nZSgkZXZlbnQpXCJcbiAgICAgICAgICAgICAgIFtjbGFzcy53aXRoLXJhZGlvXT1cIndpdGhSYWRpb1wiXG4gICAgICAgICAgICAgICBbY2xhc3MudmVydGljYWxdPVwidmVydGljYWxcIlxuICAgICAgICAgICAgICAgW2NsYXNzLm5vLXRhYi1sYWJlbHMtcGFkZGluZ109XCJub1RhYkxhYmVsc1BhZGRpbmdcIlxuICAgICAgICAgICAgICAgW2NsYXNzLm5vLWJvZHktcGFkZGluZ109XCJub0JvZHlQYWRkaW5nXCJcbiAgICAgICAgICAgICAgIFtjbGFzcy5uby10YWJzXT1cImhpZGVUYWJzXCJcbiAgICAgICAgICAgICAgIFtjbGFzcy5uby1oZWFkZXItYm9yZGVyXT1cIm5vSGVhZGVyQm9yZGVyXCJcbiAgICAgICAgICAgICAgIFthbmltYXRpb25EdXJhdGlvbl09XCJ2ZXJ0aWNhbCB8fCBfZGlzYWJsZUFuaW1hdGlvbiA/ICcwbXMnIDogJzUwMG1zJ1wiPlxuICAgIDxtYXQtdGFiICpuZ0Zvcj1cImxldCB0YWIgb2YgdGFic0NvbnRlbnRMaXN0OyBsZXQgaW5kZXggPSBpbmRleFwiIGxhYmVsPVwie3sgdGFiLmxhYmVsIH19XCIgW2Rpc2FibGVkXT1cInRhYi5kaXNhYmxlZFwiPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwid2l0aFJhZGlvXCI+XG4gICAgICAgICAgICA8bmctdGVtcGxhdGUgbWF0LXRhYi1sYWJlbD5cbiAgICAgICAgICAgICAgICA8ZHItcmFkaW8tYnV0dG9uIFt2YWx1ZV09XCJpbmRleFwiXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBbKG5nTW9kZWwpXT1cIl9zZWxlY3RlZEluZGV4XCI+XG4gICAgICAgICAgICAgICAgPC9kci1yYWRpby1idXR0b24+XG4gICAgICAgICAgICAgICAge3sgdGFiLmxhYmVsIH19XG4gICAgICAgICAgICA8L25nLXRlbXBsYXRlPlxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cInRhYi50b29sdGlwICYmICF3aXRoUmFkaW8gJiYgIXdpdGhJY29uXCI+XG4gICAgICAgICAgICA8bmctdGVtcGxhdGUgbWF0LXRhYi1sYWJlbD5cbiAgICAgICAgICAgICAgICA8bGFiZWwgY2xhc3M9XCJjdXJzb3ItcG9pbnRlclwiIFtkclRvb2x0aXBdPVwidGFiLnRvb2x0aXBcIj57eyB0YWIubGFiZWwgfX08L2xhYmVsPlxuICAgICAgICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJ3aXRoSWNvblwiPlxuICAgICAgICAgICAgPG5nLXRlbXBsYXRlIG1hdC10YWItbGFiZWw+XG4gICAgICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJpY29uLXRhYl9fd3JhcHBlclwiPlxuICAgICAgICAgICAgICAgICAgICA8aSBbbmdDbGFzc109XCJ0YWIuaWNvblwiIGNsYXNzPVwiY3Vyc29yLXBvaW50ZXJcIj48L2k+XG4gICAgICAgICAgICAgICAgPC9zcGFuPlxuICAgICAgICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJ0YWIuY29udGVudFRlbXBsYXRlXCI+PC9uZy1jb250YWluZXI+XG4gICAgPC9tYXQtdGFiPlxuPC9tYXQtdGFiLWdyb3VwPlxuIl19
@@ -2,7 +2,7 @@ import { NgModule } from '@angular/core';
2
2
  import { CommonModule } from '@angular/common';
3
3
  import { DrTabsComponent } from './dr-tabs.component';
4
4
  import { DrTabComponent } from './dr-tab.component';
5
- import { MatLegacyTabsModule as MatTabsModule } from '@angular/material/legacy-tabs';
5
+ import { MatTabsModule } from '@angular/material/tabs';
6
6
  import { DrInputsModule } from '../dr-inputs/dr-inputs.module';
7
7
  import { FormsModule, ReactiveFormsModule } from '@angular/forms';
8
8
  import { DrTooltipModule } from '../dr-tooltip/dr-tooltip.module';
@@ -46,4 +46,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImpor
46
46
  ],
47
47
  }]
48
48
  }] });
49
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHItdGFicy5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kYXRhcmFpbHNzaGFyZWQvc3JjL2xpYi9kci10YWJzL2RyLXRhYnMubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQztBQUN0RCxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFDcEQsT0FBTyxFQUFFLG1CQUFtQixJQUFJLGFBQWEsRUFBRSxNQUFNLCtCQUErQixDQUFDO0FBQ3JGLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUMvRCxPQUFPLEVBQUUsV0FBVyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDbEUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGlDQUFpQyxDQUFDOztBQXNCbEUsTUFBTSxPQUFPLFlBQVk7aUlBQVosWUFBWTtrSUFBWixZQUFZLGlCQUxqQixlQUFlO1lBQ2YsY0FBYyxhQWRkLFlBQVk7WUFDWixhQUFhO1lBQ2IsV0FBVztZQUNYLG1CQUFtQjtZQUNuQixjQUFjO1lBQ2QsZUFBZSxhQUdmLGVBQWU7WUFDZixjQUFjO2tJQVNULFlBQVksWUFsQmpCLFlBQVk7WUFDWixhQUFhO1lBQ2IsV0FBVztZQUNYLG1CQUFtQjtZQUNuQixjQUFjO1lBQ2QsZUFBZTs7MkZBYVYsWUFBWTtrQkFwQnhCLFFBQVE7bUJBQUM7b0JBQ04sT0FBTyxFQUFFO3dCQUNMLFlBQVk7d0JBQ1osYUFBYTt3QkFDYixXQUFXO3dCQUNYLG1CQUFtQjt3QkFDbkIsY0FBYzt3QkFDZCxlQUFlO3FCQUNsQjtvQkFDRCxPQUFPLEVBQUU7d0JBQ0wsZUFBZTt3QkFDZixjQUFjO3FCQUNqQjtvQkFDRCxTQUFTLEVBQUUsRUFBRTtvQkFDYixZQUFZLEVBQUU7d0JBQ1YsZUFBZTt3QkFDZixjQUFjO3FCQUNqQjtpQkFDSiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgRHJUYWJzQ29tcG9uZW50IH0gZnJvbSAnLi9kci10YWJzLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBEclRhYkNvbXBvbmVudCB9IGZyb20gJy4vZHItdGFiLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBNYXRMZWdhY3lUYWJzTW9kdWxlIGFzIE1hdFRhYnNNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9sZWdhY3ktdGFicyc7XG5pbXBvcnQgeyBEcklucHV0c01vZHVsZSB9IGZyb20gJy4uL2RyLWlucHV0cy9kci1pbnB1dHMubW9kdWxlJztcbmltcG9ydCB7IEZvcm1zTW9kdWxlLCBSZWFjdGl2ZUZvcm1zTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgRHJUb29sdGlwTW9kdWxlIH0gZnJvbSAnLi4vZHItdG9vbHRpcC9kci10b29sdGlwLm1vZHVsZSc7XG5cbkBOZ01vZHVsZSh7XG4gICAgaW1wb3J0czogW1xuICAgICAgICBDb21tb25Nb2R1bGUsXG4gICAgICAgIE1hdFRhYnNNb2R1bGUsXG4gICAgICAgIEZvcm1zTW9kdWxlLFxuICAgICAgICBSZWFjdGl2ZUZvcm1zTW9kdWxlLFxuICAgICAgICBEcklucHV0c01vZHVsZSxcbiAgICAgICAgRHJUb29sdGlwTW9kdWxlXG4gICAgXSxcbiAgICBleHBvcnRzOiBbXG4gICAgICAgIERyVGFic0NvbXBvbmVudCxcbiAgICAgICAgRHJUYWJDb21wb25lbnRcbiAgICBdLFxuICAgIHByb3ZpZGVyczogW10sXG4gICAgZGVjbGFyYXRpb25zOiBbXG4gICAgICAgIERyVGFic0NvbXBvbmVudCxcbiAgICAgICAgRHJUYWJDb21wb25lbnRcbiAgICBdLFxufSlcblxuZXhwb3J0IGNsYXNzIERyVGFic01vZHVsZSB7XG59XG4iXX0=
49
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHItdGFicy5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kYXRhcmFpbHNzaGFyZWQvc3JjL2xpYi9kci10YWJzL2RyLXRhYnMubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQztBQUN0RCxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFDcEQsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUMvRCxPQUFPLEVBQUUsV0FBVyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDbEUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGlDQUFpQyxDQUFDOztBQXNCbEUsTUFBTSxPQUFPLFlBQVk7aUlBQVosWUFBWTtrSUFBWixZQUFZLGlCQUxqQixlQUFlO1lBQ2YsY0FBYyxhQWRkLFlBQVk7WUFDWixhQUFhO1lBQ2IsV0FBVztZQUNYLG1CQUFtQjtZQUNuQixjQUFjO1lBQ2QsZUFBZSxhQUdmLGVBQWU7WUFDZixjQUFjO2tJQVNULFlBQVksWUFsQmpCLFlBQVk7WUFDWixhQUFhO1lBQ2IsV0FBVztZQUNYLG1CQUFtQjtZQUNuQixjQUFjO1lBQ2QsZUFBZTs7MkZBYVYsWUFBWTtrQkFwQnhCLFFBQVE7bUJBQUM7b0JBQ04sT0FBTyxFQUFFO3dCQUNMLFlBQVk7d0JBQ1osYUFBYTt3QkFDYixXQUFXO3dCQUNYLG1CQUFtQjt3QkFDbkIsY0FBYzt3QkFDZCxlQUFlO3FCQUNsQjtvQkFDRCxPQUFPLEVBQUU7d0JBQ0wsZUFBZTt3QkFDZixjQUFjO3FCQUNqQjtvQkFDRCxTQUFTLEVBQUUsRUFBRTtvQkFDYixZQUFZLEVBQUU7d0JBQ1YsZUFBZTt3QkFDZixjQUFjO3FCQUNqQjtpQkFDSiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgRHJUYWJzQ29tcG9uZW50IH0gZnJvbSAnLi9kci10YWJzLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBEclRhYkNvbXBvbmVudCB9IGZyb20gJy4vZHItdGFiLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBNYXRUYWJzTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvdGFicyc7XG5pbXBvcnQgeyBEcklucHV0c01vZHVsZSB9IGZyb20gJy4uL2RyLWlucHV0cy9kci1pbnB1dHMubW9kdWxlJztcbmltcG9ydCB7IEZvcm1zTW9kdWxlLCBSZWFjdGl2ZUZvcm1zTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgRHJUb29sdGlwTW9kdWxlIH0gZnJvbSAnLi4vZHItdG9vbHRpcC9kci10b29sdGlwLm1vZHVsZSc7XG5cbkBOZ01vZHVsZSh7XG4gICAgaW1wb3J0czogW1xuICAgICAgICBDb21tb25Nb2R1bGUsXG4gICAgICAgIE1hdFRhYnNNb2R1bGUsXG4gICAgICAgIEZvcm1zTW9kdWxlLFxuICAgICAgICBSZWFjdGl2ZUZvcm1zTW9kdWxlLFxuICAgICAgICBEcklucHV0c01vZHVsZSxcbiAgICAgICAgRHJUb29sdGlwTW9kdWxlXG4gICAgXSxcbiAgICBleHBvcnRzOiBbXG4gICAgICAgIERyVGFic0NvbXBvbmVudCxcbiAgICAgICAgRHJUYWJDb21wb25lbnRcbiAgICBdLFxuICAgIHByb3ZpZGVyczogW10sXG4gICAgZGVjbGFyYXRpb25zOiBbXG4gICAgICAgIERyVGFic0NvbXBvbmVudCxcbiAgICAgICAgRHJUYWJDb21wb25lbnRcbiAgICBdLFxufSlcblxuZXhwb3J0IGNsYXNzIERyVGFic01vZHVsZSB7XG59XG4iXX0=
@@ -23,8 +23,8 @@ import { NgSelectComponent, NgSelectModule } from '@ng-select/ng-select';
23
23
  import * as i1$5 from '@angular/platform-browser';
24
24
  import * as i1$6 from '@angular/material/legacy-tooltip';
25
25
  import { MatLegacyTooltipModule } from '@angular/material/legacy-tooltip';
26
- import * as i2 from '@angular/material/legacy-tabs';
27
- import { MatLegacyTabsModule } from '@angular/material/legacy-tabs';
26
+ import * as i2 from '@angular/material/tabs';
27
+ import { MatTabsModule } from '@angular/material/tabs';
28
28
  import * as i1$7 from '@angular/material/legacy-dialog';
29
29
  import { MAT_LEGACY_DIALOG_DATA, MatLegacyDialogModule, MatLegacyDialogRef } from '@angular/material/legacy-dialog';
30
30
 
@@ -5264,24 +5264,43 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImpor
5264
5264
  }] } });
5265
5265
 
5266
5266
  class DrTabsComponent {
5267
- constructor() {
5267
+ set selectedTab(value) {
5268
+ this._selectedIndex = value || 0;
5269
+ /**
5270
+ * Hack to disable animation calculation in case the pre-selected tab is not at index 0.
5271
+ * Otherwise, the animation of redirecting to the pre-selected tab will conflict
5272
+ * with the animation of the tab at index 0.
5273
+ */
5274
+ if (this._selectedIndex) {
5275
+ this._disableAnimation = true;
5276
+ setTimeout(() => {
5277
+ this._disableAnimation = false;
5278
+ });
5279
+ }
5280
+ }
5281
+ ;
5282
+ constructor(cdr) {
5283
+ this.cdr = cdr;
5284
+ this._disableAnimation = true;
5285
+ this._selectedIndex = 0;
5268
5286
  this.theme = 'primary';
5269
- this.selectedTab = 0;
5270
5287
  this.noBodyPadding = false;
5288
+ this.hideTabs = false;
5289
+ this.noHeaderBorder = false;
5271
5290
  this.noTabLabelsPadding = false;
5272
5291
  this.selectedTabChange = new EventEmitter();
5273
5292
  }
5274
5293
  selectedIndexChange($event) {
5275
- this.selectedTab = $event;
5294
+ this._selectedIndex = $event;
5276
5295
  this.selectedTabChange.emit($event);
5277
5296
  }
5278
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5279
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.5", type: DrTabsComponent, selector: "dr-tabs", inputs: { theme: "theme", selectedTab: "selectedTab", withRadio: "withRadio", withIcon: "withIcon", vertical: "vertical", noBodyPadding: "noBodyPadding", noTabLabelsPadding: "noTabLabelsPadding" }, outputs: { selectedTabChange: "selectedTabChange" }, queries: [{ propertyName: "tabsContentList", predicate: DrTabComponent }], ngImport: i0, template: "<mat-tab-group disableRipple\n [ngClass]=\"theme\"\n [selectedIndex]=\"selectedTab\"\n (selectedIndexChange)=\"selectedIndexChange($event)\"\n [class.with-radio]=\"withRadio\"\n [class.vertical]=\"vertical\"\n [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n [class.no-body-padding]=\"noBodyPadding\"\n [animationDuration]=\" vertical ? '0ms' : '500ms'\">\n <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n <ng-container *ngIf=\"withRadio\">\n <ng-template mat-tab-label>\n <dr-radio-button [value]=\"index\"\n [(ngModel)]=\"selectedTab\">\n </dr-radio-button>\n {{ tab.label }}\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n <ng-template mat-tab-label>\n <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"withIcon\">\n <ng-template mat-tab-label>\n <span class=\"icon-tab__wrapper\">\n <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n </span>\n </ng-template>\n </ng-container>\n <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-tab-group,:host ::ng-deep .mat-tab-body-wrapper{height:100%}:host ::ng-deep .mat-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-tab-nav-bar,:host ::ng-deep .mat-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-tab-labels{padding:0 17px}:host ::ng-deep .mat-tab-label{padding:0 8px;min-width:0;height:38px;opacity:1}:host ::ng-deep .mat-tab-label:not(:last-child){margin-right:21px}:host ::ng-deep .mat-tab-label-active .mat-tab-label-content{color:#4646ce;font-weight:700}:host ::ng-deep .mat-tab-label-content{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif}:host ::ng-deep .mat-ink-bar{height:3px;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .with-radio .mat-tab-labels{padding:0;margin-bottom:8px}:host ::ng-deep .with-radio .mat-tab-label{padding:8px 16px;min-width:0;flex-grow:1;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mat-tab-label:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mat-tab-label-active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mat-tab-label-active .mat-tab-label-content{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mat-ink-bar{display:none!important}:host ::ng-deep .vertical.mat-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-tab-label-container .mat-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-ink-bar{display:none!important}:host ::ng-deep .vertical .mat-tab-label{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-tab-label:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0}:host ::ng-deep .vertical .mat-tab-label-active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-tab-label-active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-tab-label-active .mat-tab-label-content{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep mat-tab-group.no-body-padding .mat-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-tab-labels{padding:0}:host .secondary ::ng-deep .mat-tab-header{border-bottom:none}:host .secondary ::ng-deep .mat-tab-labels{justify-content:space-evenly;padding:0;background:#F2F2FB}:host .secondary ::ng-deep .mat-tab-label{flex:1;margin:0;border-bottom:1px solid #DFE0E3}:host .secondary ::ng-deep .mat-tab-label+.mat-tab-label{border-left:1px solid #DFE0E3}:host .secondary ::ng-deep .mat-tab-label-active{background:white;border-bottom:none}:host .secondary ::ng-deep .mat-tab-label-active .mat-tab-label-content{color:#25258c}:host .secondary ::ng-deep .mat-ink-bar{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.MatLegacyTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { kind: "directive", type: i2.MatLegacyTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i2.MatLegacyTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: RadioButtonComponent, selector: "dr-radio-button", inputs: ["name", "value", "disabled"], outputs: ["valueChange"] }, { kind: "directive", type: DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }] }); }
5297
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrTabsComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
5298
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.5", type: DrTabsComponent, selector: "dr-tabs", inputs: { theme: "theme", selectedTab: "selectedTab", withRadio: "withRadio", withIcon: "withIcon", vertical: "vertical", noBodyPadding: "noBodyPadding", hideTabs: "hideTabs", noHeaderBorder: "noHeaderBorder", noTabLabelsPadding: "noTabLabelsPadding" }, outputs: { selectedTabChange: "selectedTabChange" }, queries: [{ propertyName: "tabsContentList", predicate: DrTabComponent }], ngImport: i0, template: "<mat-tab-group disableRipple\n [ngClass]=\"theme\"\n [selectedIndex]=\"_selectedIndex\"\n (selectedIndexChange)=\"selectedIndexChange($event)\"\n [class.with-radio]=\"withRadio\"\n [class.vertical]=\"vertical\"\n [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n [class.no-body-padding]=\"noBodyPadding\"\n [class.no-tabs]=\"hideTabs\"\n [class.no-header-border]=\"noHeaderBorder\"\n [animationDuration]=\"vertical || _disableAnimation ? '0ms' : '500ms'\">\n <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n <ng-container *ngIf=\"withRadio\">\n <ng-template mat-tab-label>\n <dr-radio-button [value]=\"index\"\n [(ngModel)]=\"_selectedIndex\">\n </dr-radio-button>\n {{ tab.label }}\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n <ng-template mat-tab-label>\n <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"withIcon\">\n <ng-template mat-tab-label>\n <span class=\"icon-tab__wrapper\">\n <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n </span>\n </ng-template>\n </ng-container>\n <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-mdc-tab-group,:host ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host ::ng-deep .mat-mdc-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-mdc-tab-nav-bar,:host ::ng-deep .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-mdc-tab-labels{padding:0 17px}:host ::ng-deep .mat-mdc-tab,:host ::ng-deep .mat-mdc-tab:hover{-webkit-tap-highlight-color:#FFFFFF}:host ::ng-deep .mat-mdc-tab .mdc-tab__text-label,:host ::ng-deep .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}:host ::ng-deep .mat-mdc-tab .mdc-tab__ripple{display:none}:host ::ng-deep .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}:host ::ng-deep .mdc-tab:not(:last-child){margin-right:21px}:host ::ng-deep .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}:host ::ng-deep .mdc-tab--active .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}:host ::ng-deep .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}:host ::ng-deep .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mdc-tab:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical.mat-mdc-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}:host ::ng-deep .vertical .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep .secondary .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#F2F2FB}:host ::ng-deep .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #DFE0E3}:host ::ng-deep .secondary .mdc-tab+.mdc-tab{border-left:1px solid #DFE0E3}:host ::ng-deep .secondary .mdc-tab--active{background:white;border-bottom:none}:host ::ng-deep .secondary .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}:host ::ng-deep .secondary .mdc-tab-indicator{display:none}:host ::ng-deep mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}:host ::ng-deep mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}:host ::ng-deep mat-tab-group.no-header-border .mat-mdc-tab-header{border-bottom:none!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple", "fitInkBarToContent", "mat-stretch-tabs"], exportAs: ["matTabGroup"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: RadioButtonComponent, selector: "dr-radio-button", inputs: ["name", "value", "disabled"], outputs: ["valueChange"] }, { kind: "directive", type: DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }] }); }
5280
5299
  }
5281
5300
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrTabsComponent, decorators: [{
5282
5301
  type: Component,
5283
- args: [{ selector: 'dr-tabs', template: "<mat-tab-group disableRipple\n [ngClass]=\"theme\"\n [selectedIndex]=\"selectedTab\"\n (selectedIndexChange)=\"selectedIndexChange($event)\"\n [class.with-radio]=\"withRadio\"\n [class.vertical]=\"vertical\"\n [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n [class.no-body-padding]=\"noBodyPadding\"\n [animationDuration]=\" vertical ? '0ms' : '500ms'\">\n <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n <ng-container *ngIf=\"withRadio\">\n <ng-template mat-tab-label>\n <dr-radio-button [value]=\"index\"\n [(ngModel)]=\"selectedTab\">\n </dr-radio-button>\n {{ tab.label }}\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n <ng-template mat-tab-label>\n <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"withIcon\">\n <ng-template mat-tab-label>\n <span class=\"icon-tab__wrapper\">\n <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n </span>\n </ng-template>\n </ng-container>\n <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-tab-group,:host ::ng-deep .mat-tab-body-wrapper{height:100%}:host ::ng-deep .mat-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-tab-nav-bar,:host ::ng-deep .mat-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-tab-labels{padding:0 17px}:host ::ng-deep .mat-tab-label{padding:0 8px;min-width:0;height:38px;opacity:1}:host ::ng-deep .mat-tab-label:not(:last-child){margin-right:21px}:host ::ng-deep .mat-tab-label-active .mat-tab-label-content{color:#4646ce;font-weight:700}:host ::ng-deep .mat-tab-label-content{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif}:host ::ng-deep .mat-ink-bar{height:3px;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .with-radio .mat-tab-labels{padding:0;margin-bottom:8px}:host ::ng-deep .with-radio .mat-tab-label{padding:8px 16px;min-width:0;flex-grow:1;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mat-tab-label:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mat-tab-label-active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mat-tab-label-active .mat-tab-label-content{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mat-ink-bar{display:none!important}:host ::ng-deep .vertical.mat-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-tab-label-container .mat-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-ink-bar{display:none!important}:host ::ng-deep .vertical .mat-tab-label{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-tab-label:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0}:host ::ng-deep .vertical .mat-tab-label-active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-tab-label-active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-tab-label-active .mat-tab-label-content{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep mat-tab-group.no-body-padding .mat-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-tab-labels{padding:0}:host .secondary ::ng-deep .mat-tab-header{border-bottom:none}:host .secondary ::ng-deep .mat-tab-labels{justify-content:space-evenly;padding:0;background:#F2F2FB}:host .secondary ::ng-deep .mat-tab-label{flex:1;margin:0;border-bottom:1px solid #DFE0E3}:host .secondary ::ng-deep .mat-tab-label+.mat-tab-label{border-left:1px solid #DFE0E3}:host .secondary ::ng-deep .mat-tab-label-active{background:white;border-bottom:none}:host .secondary ::ng-deep .mat-tab-label-active .mat-tab-label-content{color:#25258c}:host .secondary ::ng-deep .mat-ink-bar{display:none}\n"] }]
5284
- }], ctorParameters: function () { return []; }, propDecorators: { theme: [{
5302
+ args: [{ selector: 'dr-tabs', template: "<mat-tab-group disableRipple\n [ngClass]=\"theme\"\n [selectedIndex]=\"_selectedIndex\"\n (selectedIndexChange)=\"selectedIndexChange($event)\"\n [class.with-radio]=\"withRadio\"\n [class.vertical]=\"vertical\"\n [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n [class.no-body-padding]=\"noBodyPadding\"\n [class.no-tabs]=\"hideTabs\"\n [class.no-header-border]=\"noHeaderBorder\"\n [animationDuration]=\"vertical || _disableAnimation ? '0ms' : '500ms'\">\n <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n <ng-container *ngIf=\"withRadio\">\n <ng-template mat-tab-label>\n <dr-radio-button [value]=\"index\"\n [(ngModel)]=\"_selectedIndex\">\n </dr-radio-button>\n {{ tab.label }}\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n <ng-template mat-tab-label>\n <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"withIcon\">\n <ng-template mat-tab-label>\n <span class=\"icon-tab__wrapper\">\n <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n </span>\n </ng-template>\n </ng-container>\n <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-mdc-tab-group,:host ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host ::ng-deep .mat-mdc-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-mdc-tab-nav-bar,:host ::ng-deep .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-mdc-tab-labels{padding:0 17px}:host ::ng-deep .mat-mdc-tab,:host ::ng-deep .mat-mdc-tab:hover{-webkit-tap-highlight-color:#FFFFFF}:host ::ng-deep .mat-mdc-tab .mdc-tab__text-label,:host ::ng-deep .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}:host ::ng-deep .mat-mdc-tab .mdc-tab__ripple{display:none}:host ::ng-deep .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}:host ::ng-deep .mdc-tab:not(:last-child){margin-right:21px}:host ::ng-deep .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}:host ::ng-deep .mdc-tab--active .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}:host ::ng-deep .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}:host ::ng-deep .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mdc-tab:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical.mat-mdc-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}:host ::ng-deep .vertical .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep .secondary .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#F2F2FB}:host ::ng-deep .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #DFE0E3}:host ::ng-deep .secondary .mdc-tab+.mdc-tab{border-left:1px solid #DFE0E3}:host ::ng-deep .secondary .mdc-tab--active{background:white;border-bottom:none}:host ::ng-deep .secondary .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}:host ::ng-deep .secondary .mdc-tab-indicator{display:none}:host ::ng-deep mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}:host ::ng-deep mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}:host ::ng-deep mat-tab-group.no-header-border .mat-mdc-tab-header{border-bottom:none!important}\n"] }]
5303
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { theme: [{
5285
5304
  type: Input
5286
5305
  }], selectedTab: [{
5287
5306
  type: Input
@@ -5293,6 +5312,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImpor
5293
5312
  type: Input
5294
5313
  }], noBodyPadding: [{
5295
5314
  type: Input
5315
+ }], hideTabs: [{
5316
+ type: Input
5317
+ }], noHeaderBorder: [{
5318
+ type: Input
5296
5319
  }], noTabLabelsPadding: [{
5297
5320
  type: Input
5298
5321
  }], selectedTabChange: [{
@@ -7194,14 +7217,14 @@ class DrTabsModule {
7194
7217
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrTabsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
7195
7218
  /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.5", ngImport: i0, type: DrTabsModule, declarations: [DrTabsComponent,
7196
7219
  DrTabComponent], imports: [CommonModule,
7197
- MatLegacyTabsModule,
7220
+ MatTabsModule,
7198
7221
  FormsModule,
7199
7222
  ReactiveFormsModule,
7200
7223
  DrInputsModule,
7201
7224
  DrTooltipModule], exports: [DrTabsComponent,
7202
7225
  DrTabComponent] }); }
7203
7226
  /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrTabsModule, imports: [CommonModule,
7204
- MatLegacyTabsModule,
7227
+ MatTabsModule,
7205
7228
  FormsModule,
7206
7229
  ReactiveFormsModule,
7207
7230
  DrInputsModule,
@@ -7212,7 +7235,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImpor
7212
7235
  args: [{
7213
7236
  imports: [
7214
7237
  CommonModule,
7215
- MatLegacyTabsModule,
7238
+ MatTabsModule,
7216
7239
  FormsModule,
7217
7240
  ReactiveFormsModule,
7218
7241
  DrInputsModule,