@datarailsshared/datarailsshared 1.4.150 → 1.4.151
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/datarailsshared-datarailsshared.umd.js +6 -2
- package/bundles/datarailsshared-datarailsshared.umd.js.map +1 -1
- package/datarailsshared-datarailsshared-1.4.151.tgz +0 -0
- package/datarailsshared-datarailsshared.metadata.json +1 -1
- package/esm2015/lib/dr-tabs/dr-tab.component.js +2 -1
- package/esm2015/lib/dr-tabs/dr-tabs.component.js +6 -3
- package/fesm2015/datarailsshared-datarailsshared.js +6 -2
- package/fesm2015/datarailsshared-datarailsshared.js.map +1 -1
- package/lib/dr-tabs/dr-tab.component.d.ts +1 -0
- package/lib/dr-tabs/dr-tabs.component.d.ts +2 -0
- package/package.json +1 -1
- package/datarailsshared-datarailsshared-1.4.150.tgz +0 -0
|
@@ -18,8 +18,9 @@ DrTabComponent.decorators = [
|
|
|
18
18
|
DrTabComponent.ctorParameters = () => [];
|
|
19
19
|
DrTabComponent.propDecorators = {
|
|
20
20
|
label: [{ type: Input }],
|
|
21
|
+
icon: [{ type: Input }],
|
|
21
22
|
disabled: [{ type: Input }],
|
|
22
23
|
tooltip: [{ type: Input }],
|
|
23
24
|
contentTemplate: [{ type: ViewChild, args: [TemplateRef,] }]
|
|
24
25
|
};
|
|
25
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
26
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHItdGFiLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2RhdGFyYWlsc3NoYXJlZC9zcmMvbGliL2RyLXRhYnMvZHItdGFiLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBVSxXQUFXLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBVWpGLE1BQU0sT0FBTyxjQUFjO0lBT3ZCO0lBQ0EsQ0FBQztJQUVELFFBQVE7SUFDUixDQUFDOzs7WUFuQkosU0FBUyxTQUFDO2dCQUNQLFFBQVEsRUFBRSxRQUFRO2dCQUNsQixRQUFRLEVBQUU7Ozs7S0FJVDthQUNKOzs7O29CQUVJLEtBQUs7bUJBQ0wsS0FBSzt1QkFDTCxLQUFLO3NCQUNMLEtBQUs7OEJBQ0wsU0FBUyxTQUFDLFdBQVciLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkluaXQsIFRlbXBsYXRlUmVmLCBWaWV3Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdkci10YWInLFxuICAgIHRlbXBsYXRlOiBgXG4gICAgICAgIDxuZy10ZW1wbGF0ZT5cbiAgICAgICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICBgXG59KVxuZXhwb3J0IGNsYXNzIERyVGFiQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgICBASW5wdXQoKSBsYWJlbDogc3RyaW5nO1xuICAgIEBJbnB1dCgpIGljb246IHN0cmluZztcbiAgICBASW5wdXQoKSBkaXNhYmxlZDogYm9vbGVhbjtcbiAgICBASW5wdXQoKSB0b29sdGlwOiBzdHJpbmc7XG4gICAgQFZpZXdDaGlsZChUZW1wbGF0ZVJlZikgcHVibGljIGNvbnRlbnRUZW1wbGF0ZTogVGVtcGxhdGVSZWY8YW55PjtcblxuICAgIGNvbnN0cnVjdG9yKCkge1xuICAgIH1cblxuICAgIG5nT25Jbml0KCkge1xuICAgIH1cblxufVxuIl19
|
|
@@ -2,6 +2,7 @@ import { Component, ContentChildren, EventEmitter, Input, Output, } from '@angul
|
|
|
2
2
|
import { DrTabComponent } from './dr-tab.component';
|
|
3
3
|
export class DrTabsComponent {
|
|
4
4
|
constructor() {
|
|
5
|
+
this.theme = 'primary';
|
|
5
6
|
this.selectedTab = 0;
|
|
6
7
|
this.noBodyPadding = false;
|
|
7
8
|
this.noTabLabelsPadding = false;
|
|
@@ -15,18 +16,20 @@ export class DrTabsComponent {
|
|
|
15
16
|
DrTabsComponent.decorators = [
|
|
16
17
|
{ type: Component, args: [{
|
|
17
18
|
selector: 'dr-tabs',
|
|
18
|
-
template: "<mat-tab-group disableRipple
|
|
19
|
-
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:normal;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}\n"]
|
|
19
|
+
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",
|
|
20
|
+
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:normal;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"]
|
|
20
21
|
},] }
|
|
21
22
|
];
|
|
22
23
|
DrTabsComponent.ctorParameters = () => [];
|
|
23
24
|
DrTabsComponent.propDecorators = {
|
|
25
|
+
theme: [{ type: Input }],
|
|
24
26
|
selectedTab: [{ type: Input }],
|
|
25
27
|
withRadio: [{ type: Input }],
|
|
28
|
+
withIcon: [{ type: Input }],
|
|
26
29
|
vertical: [{ type: Input }],
|
|
27
30
|
noBodyPadding: [{ type: Input }],
|
|
28
31
|
noTabLabelsPadding: [{ type: Input }],
|
|
29
32
|
selectedTabChange: [{ type: Output }],
|
|
30
33
|
tabsContentList: [{ type: ContentChildren, args: [DrTabComponent,] }]
|
|
31
34
|
};
|
|
32
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
35
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHItdGFicy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kYXRhcmFpbHNzaGFyZWQvc3JjL2xpYi9kci10YWJzL2RyLXRhYnMuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsZUFBZSxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxHQUFjLE1BQU0sZUFBZSxDQUFDO0FBQ3BHLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQU9wRCxNQUFNLE9BQU8sZUFBZTtJQVd4QjtRQVZTLFVBQUssR0FBVyxTQUFTLENBQUM7UUFDMUIsZ0JBQVcsR0FBRyxDQUFDLENBQUM7UUFJaEIsa0JBQWEsR0FBRyxLQUFLLENBQUM7UUFDdEIsdUJBQWtCLEdBQUcsS0FBSyxDQUFDO1FBQzFCLHNCQUFpQixHQUFzQixJQUFJLFlBQVksRUFBTyxDQUFDO0lBSXpFLENBQUM7SUFFRCxtQkFBbUIsQ0FBQyxNQUFNO1FBQ3RCLElBQUksQ0FBQyxXQUFXLEdBQUcsTUFBTSxDQUFDO1FBQzFCLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7SUFDeEMsQ0FBQzs7O1lBdEJKLFNBQVMsU0FBQztnQkFDUCxRQUFRLEVBQUUsU0FBUztnQkFDbkIseWtEQUF1Qzs7YUFFMUM7Ozs7b0JBRUksS0FBSzswQkFDTCxLQUFLO3dCQUNMLEtBQUs7dUJBQ0wsS0FBSzt1QkFDTCxLQUFLOzRCQUNMLEtBQUs7aUNBQ0wsS0FBSztnQ0FDTCxNQUFNOzhCQUNOLGVBQWUsU0FBQyxjQUFjIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBDb250ZW50Q2hpbGRyZW4sIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCwgUXVlcnlMaXN0LCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRHJUYWJDb21wb25lbnQgfSBmcm9tICcuL2RyLXRhYi5jb21wb25lbnQnO1xuXG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogJ2RyLXRhYnMnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9kci10YWJzLmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi9kci10YWJzLmNvbXBvbmVudC5zY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIERyVGFic0NvbXBvbmVudCB7XG4gICAgQElucHV0KCkgdGhlbWU6IHN0cmluZyA9ICdwcmltYXJ5JztcbiAgICBASW5wdXQoKSBzZWxlY3RlZFRhYiA9IDA7XG4gICAgQElucHV0KCkgd2l0aFJhZGlvOiBib29sZWFuO1xuICAgIEBJbnB1dCgpIHdpdGhJY29uOiBib29sZWFuO1xuICAgIEBJbnB1dCgpIHZlcnRpY2FsOiBib29sZWFuO1xuICAgIEBJbnB1dCgpIG5vQm9keVBhZGRpbmcgPSBmYWxzZTtcbiAgICBASW5wdXQoKSBub1RhYkxhYmVsc1BhZGRpbmcgPSBmYWxzZTtcbiAgICBAT3V0cHV0KCkgc2VsZWN0ZWRUYWJDaGFuZ2U6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XG4gICAgQENvbnRlbnRDaGlsZHJlbihEclRhYkNvbXBvbmVudCkgcHVibGljIHRhYnNDb250ZW50TGlzdDogUXVlcnlMaXN0PERyVGFiQ29tcG9uZW50PjtcblxuICAgIGNvbnN0cnVjdG9yKCkge1xuICAgIH1cblxuICAgIHNlbGVjdGVkSW5kZXhDaGFuZ2UoJGV2ZW50KSB7XG4gICAgICAgIHRoaXMuc2VsZWN0ZWRUYWIgPSAkZXZlbnQ7XG4gICAgICAgIHRoaXMuc2VsZWN0ZWRUYWJDaGFuZ2UuZW1pdCgkZXZlbnQpO1xuICAgIH1cblxufVxuIl19
|
|
@@ -2837,6 +2837,7 @@ DrTabComponent.decorators = [
|
|
|
2837
2837
|
DrTabComponent.ctorParameters = () => [];
|
|
2838
2838
|
DrTabComponent.propDecorators = {
|
|
2839
2839
|
label: [{ type: Input }],
|
|
2840
|
+
icon: [{ type: Input }],
|
|
2840
2841
|
disabled: [{ type: Input }],
|
|
2841
2842
|
tooltip: [{ type: Input }],
|
|
2842
2843
|
contentTemplate: [{ type: ViewChild, args: [TemplateRef,] }]
|
|
@@ -2844,6 +2845,7 @@ DrTabComponent.propDecorators = {
|
|
|
2844
2845
|
|
|
2845
2846
|
class DrTabsComponent {
|
|
2846
2847
|
constructor() {
|
|
2848
|
+
this.theme = 'primary';
|
|
2847
2849
|
this.selectedTab = 0;
|
|
2848
2850
|
this.noBodyPadding = false;
|
|
2849
2851
|
this.noTabLabelsPadding = false;
|
|
@@ -2857,14 +2859,16 @@ class DrTabsComponent {
|
|
|
2857
2859
|
DrTabsComponent.decorators = [
|
|
2858
2860
|
{ type: Component, args: [{
|
|
2859
2861
|
selector: 'dr-tabs',
|
|
2860
|
-
template: "<mat-tab-group disableRipple
|
|
2861
|
-
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:normal;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}\n"]
|
|
2862
|
+
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",
|
|
2863
|
+
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:normal;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"]
|
|
2862
2864
|
},] }
|
|
2863
2865
|
];
|
|
2864
2866
|
DrTabsComponent.ctorParameters = () => [];
|
|
2865
2867
|
DrTabsComponent.propDecorators = {
|
|
2868
|
+
theme: [{ type: Input }],
|
|
2866
2869
|
selectedTab: [{ type: Input }],
|
|
2867
2870
|
withRadio: [{ type: Input }],
|
|
2871
|
+
withIcon: [{ type: Input }],
|
|
2868
2872
|
vertical: [{ type: Input }],
|
|
2869
2873
|
noBodyPadding: [{ type: Input }],
|
|
2870
2874
|
noTabLabelsPadding: [{ type: Input }],
|