@mintplayer/ng-bootstrap 15.22.0 → 15.22.1
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/dock/src/dock/dock.component.d.ts +8 -1
- package/dock/src/dock-pane-renderer/dock-pane-renderer.component.d.ts +4 -1
- package/dock/src/dock-panel/dock-panel.component.d.ts +5 -3
- package/dock/src/dock-panel-header/dock-panel-header.component.d.ts +4 -1
- package/dock/src/panes/floating-pane.d.ts +1 -0
- package/dock/src/panes/tab-group-pane.d.ts +2 -1
- package/esm2020/dock/src/dock/dock.component.mjs +45 -10
- package/esm2020/dock/src/dock-pane-renderer/dock-pane-renderer.component.mjs +9 -7
- package/esm2020/dock/src/dock-panel/dock-panel.component.mjs +17 -12
- package/esm2020/dock/src/dock-panel-header/dock-panel-header.component.mjs +28 -9
- package/esm2020/dock/src/panes/floating-pane.mjs +4 -1
- package/esm2020/dock/src/panes/tab-group-pane.mjs +1 -1
- package/esm2020/navbar/src/navbar-content/navbar-content.directive.mjs +4 -4
- package/esm2020/tab-control/src/index.mjs +2 -1
- package/esm2020/tab-control/src/tab-control/tab-control.component.mjs +4 -5
- package/esm2020/tab-control/src/tab-control.module.mjs +8 -3
- package/esm2020/tab-control/src/tab-page/tab-page.component.mjs +5 -4
- package/esm2020/tab-control/src/tab-page-header/tab-page-header.directive.mjs +16 -0
- package/fesm2015/mintplayer-ng-bootstrap-dock.mjs +92 -37
- package/fesm2015/mintplayer-ng-bootstrap-dock.mjs.map +1 -1
- package/fesm2015/mintplayer-ng-bootstrap-navbar.mjs +3 -3
- package/fesm2015/mintplayer-ng-bootstrap-navbar.mjs.map +1 -1
- package/fesm2015/mintplayer-ng-bootstrap-tab-control.mjs +27 -10
- package/fesm2015/mintplayer-ng-bootstrap-tab-control.mjs.map +1 -1
- package/fesm2020/mintplayer-ng-bootstrap-dock.mjs +92 -36
- package/fesm2020/mintplayer-ng-bootstrap-dock.mjs.map +1 -1
- package/fesm2020/mintplayer-ng-bootstrap-navbar.mjs +3 -3
- package/fesm2020/mintplayer-ng-bootstrap-navbar.mjs.map +1 -1
- package/fesm2020/mintplayer-ng-bootstrap-tab-control.mjs +27 -10
- package/fesm2020/mintplayer-ng-bootstrap-tab-control.mjs.map +1 -1
- package/navbar/src/navbar-content/navbar-content.directive.d.ts +1 -1
- package/package.json +1 -1
- package/tab-control/src/index.d.ts +1 -0
- package/tab-control/src/tab-control.module.d.ts +6 -5
- package/tab-control/src/tab-page/tab-page.component.d.ts +3 -2
- package/tab-control/src/tab-page-header/tab-page-header.directive.d.ts +8 -0
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import {
|
|
2
|
+
import { Directive, Component, Input, ContentChild, HostBinding, ContentChildren, NgModule } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import * as i2$1 from '@angular/cdk/drag-drop';
|
|
@@ -10,6 +10,20 @@ import * as i2 from '@mintplayer/ng-bootstrap/no-noscript';
|
|
|
10
10
|
import { BsNoNoscriptModule } from '@mintplayer/ng-bootstrap/no-noscript';
|
|
11
11
|
import { BehaviorSubject, combineLatest, map, Subject, filter, takeUntil } from 'rxjs';
|
|
12
12
|
|
|
13
|
+
class BsTabPageHeaderDirective {
|
|
14
|
+
constructor(template) {
|
|
15
|
+
this.template = template;
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
BsTabPageHeaderDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsTabPageHeaderDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
19
|
+
BsTabPageHeaderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.3", type: BsTabPageHeaderDirective, selector: "[bsTabPageHeader]", ngImport: i0 });
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsTabPageHeaderDirective, decorators: [{
|
|
21
|
+
type: Directive,
|
|
22
|
+
args: [{
|
|
23
|
+
selector: '[bsTabPageHeader]'
|
|
24
|
+
}]
|
|
25
|
+
}], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
|
|
26
|
+
|
|
13
27
|
class BsTabPageComponent {
|
|
14
28
|
constructor(tabControl, element) {
|
|
15
29
|
this.disabled = false;
|
|
@@ -21,7 +35,7 @@ class BsTabPageComponent {
|
|
|
21
35
|
}
|
|
22
36
|
}
|
|
23
37
|
BsTabPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsTabPageComponent, deps: [{ token: BsTabControlComponent }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
24
|
-
BsTabPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsTabPageComponent, selector: "bs-tab-page", inputs: { disabled: "disabled" }, queries: [{ propertyName: "headerTemplate", first: true, predicate:
|
|
38
|
+
BsTabPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsTabPageComponent, selector: "bs-tab-page", inputs: { disabled: "disabled" }, queries: [{ propertyName: "headerTemplate", first: true, predicate: BsTabPageHeaderDirective, descendants: true }], ngImport: i0, template: "<input type=\"radio\" bsNoNoscript class=\"d-none\" [name]=\"tabControl.tabControlName$ | async\" [id]=\"tabName$ | async\">\n<div class=\"tab-page-content\" [class.d-block]=\"(tabControl.activeTab$ | async) === this\">\n <ng-content></ng-content>\n</div>", styles: [".tab-page-content{display:none}input[type=radio].noscript:checked+.tab-page-content{display:block}\n"], dependencies: [{ kind: "directive", type: i2.BsNoNoscriptDirective, selector: "[bsNoNoscript]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
|
|
25
39
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsTabPageComponent, decorators: [{
|
|
26
40
|
type: Component,
|
|
27
41
|
args: [{ selector: 'bs-tab-page', template: "<input type=\"radio\" bsNoNoscript class=\"d-none\" [name]=\"tabControl.tabControlName$ | async\" [id]=\"tabName$ | async\">\n<div class=\"tab-page-content\" [class.d-block]=\"(tabControl.activeTab$ | async) === this\">\n <ng-content></ng-content>\n</div>", styles: [".tab-page-content{display:none}input[type=radio].noscript:checked+.tab-page-content{display:block}\n"] }]
|
|
@@ -29,7 +43,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImpor
|
|
|
29
43
|
type: Input
|
|
30
44
|
}], headerTemplate: [{
|
|
31
45
|
type: ContentChild,
|
|
32
|
-
args: [
|
|
46
|
+
args: [BsTabPageHeaderDirective]
|
|
33
47
|
}] } });
|
|
34
48
|
|
|
35
49
|
class BsTabControlComponent {
|
|
@@ -59,14 +73,13 @@ class BsTabControlComponent {
|
|
|
59
73
|
.subscribe(([tabPages, activeTab, selectFirstTab]) => {
|
|
60
74
|
const notDisabled = tabPages.filter((tp) => !tp.disabled);
|
|
61
75
|
if (notDisabled.length > 0) {
|
|
62
|
-
this.activeTab$.next(notDisabled[0]);
|
|
76
|
+
setTimeout(() => this.activeTab$.next(notDisabled[0]));
|
|
63
77
|
}
|
|
64
78
|
});
|
|
65
79
|
this.topTabs$ = this.tabsPosition$.pipe(map(position => position === 'top'));
|
|
66
80
|
this.bottomTabs$ = this.tabsPosition$.pipe(map(position => position === 'bottom'));
|
|
67
81
|
}
|
|
68
82
|
set setTabPages(value) {
|
|
69
|
-
console.log('tabpages', value);
|
|
70
83
|
this.tabPages$.next(value);
|
|
71
84
|
const missing = value.filter(tp => !this.orderedTabPages.includes(tp));
|
|
72
85
|
this.orderedTabPages = this.orderedTabPages.concat(missing);
|
|
@@ -111,10 +124,10 @@ class BsTabControlComponent {
|
|
|
111
124
|
}
|
|
112
125
|
BsTabControlComponent.tabControlCounter = 0;
|
|
113
126
|
BsTabControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsTabControlComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
114
|
-
BsTabControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsTabControlComponent, selector: "bs-tab-control", inputs: { border: "border", restrictDragging: "restrictDragging", selectFirstTab: "selectFirstTab", tabsPosition: "tabsPosition" }, host: { properties: { "class.d-block": "this.dBlock", "class.position-relative": "this.positionRelative" } }, queries: [{ propertyName: "setTabPages", predicate: BsTabPageComponent }], ngImport: i0, template: "<ng-container *bsLet=\"(activeTab$ | async) as activeTab\">\n\t<div class=\"overflow-hidden mw-100 tsc\" *ngIf=\"topTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n\t<div class=\"tab-content\" bsNoNoscript [class.border]=\"border && activeTab\" [class.border-top]=\"border && !activeTab\">\n\t\t<ng-content></ng-content>\n\t</div>\n\t<div class=\"overflow-hidden mw-100 tsc bottom-tabs\" *ngIf=\"bottomTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n</ng-container>", styles: [":host ::ng-deep .nav{--bs-nav-link-padding-x: 1rem;--bs-nav-link-padding-y: .5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color: var(--bs-link-color);--bs-nav-link-hover-color: var(--bs-link-hover-color);--bs-nav-link-disabled-color: #6c757d;display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}:host ::ng-deep .nav-link{display:block;padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);font-size:var(--bs-nav-link-font-size);font-weight:var(--bs-nav-link-font-weight);color:var(--bs-nav-link-color);text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out}@media (prefers-reduced-motion: reduce){:host ::ng-deep .nav-link{transition:none}}:host ::ng-deep .nav-link:hover,:host ::ng-deep .nav-link:focus{color:var(--bs-nav-link-hover-color)}:host ::ng-deep .nav-link.disabled{color:var(--bs-nav-link-disabled-color);pointer-events:none;cursor:default}:host ::ng-deep .nav-tabs{--bs-nav-tabs-border-width: 1px;--bs-nav-tabs-border-color: #dee2e6;--bs-nav-tabs-border-radius: .375rem;--bs-nav-tabs-link-hover-border-color: #e9ecef #e9ecef #dee2e6;--bs-nav-tabs-link-active-color: #495057;--bs-nav-tabs-link-active-bg: #fff;--bs-nav-tabs-link-active-border-color: #dee2e6 #dee2e6 #fff;border-bottom:var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color)}:host ::ng-deep .nav-tabs .nav-link{margin-bottom:calc(-1 * var(--bs-nav-tabs-border-width));background:none;border:var(--bs-nav-tabs-border-width) solid transparent;border-top-left-radius:var(--bs-nav-tabs-border-radius);border-top-right-radius:var(--bs-nav-tabs-border-radius)}:host ::ng-deep .nav-tabs .nav-link:hover,:host ::ng-deep .nav-tabs .nav-link:focus{isolation:isolate;border-color:var(--bs-nav-tabs-link-hover-border-color)}:host ::ng-deep .nav-tabs .nav-link.disabled,:host ::ng-deep .nav-tabs .nav-link:disabled{color:var(--bs-nav-link-disabled-color);background-color:transparent;border-color:transparent}:host ::ng-deep .nav-tabs .nav-link.active,:host ::ng-deep .nav-tabs .nav-item.show .nav-link{color:var(--bs-nav-tabs-link-active-color);background-color:var(--bs-nav-tabs-link-active-bg);border-color:var(--bs-nav-tabs-link-active-border-color)}:host ::ng-deep .nav-tabs .dropdown-menu{margin-top:calc(-1 * var(--bs-nav-tabs-border-width));border-top-left-radius:0;border-top-right-radius:0}:host ::ng-deep .nav-pills{--bs-nav-pills-border-radius: .375rem;--bs-nav-pills-link-active-color: #fff;--bs-nav-pills-link-active-bg: #0d6efd}:host ::ng-deep .nav-pills .nav-link{background:none;border:0;border-radius:var(--bs-nav-pills-border-radius)}:host ::ng-deep .nav-pills .nav-link:disabled{color:var(--bs-nav-link-disabled-color);background-color:transparent;border-color:transparent}:host ::ng-deep .nav-pills .nav-link.active,:host ::ng-deep .nav-pills .show>.nav-link{color:var(--bs-nav-pills-link-active-color);background-color:var(--bs-nav-pills-link-active-bg)}:host ::ng-deep .nav-fill>.nav-link,:host ::ng-deep .nav-fill .nav-item{flex:1 1 auto;text-align:center}:host ::ng-deep .nav-justified>.nav-link,:host ::ng-deep .nav-justified .nav-item{flex-basis:0;flex-grow:1;text-align:center}:host ::ng-deep .nav-fill .nav-item .nav-link,:host ::ng-deep .nav-justified .nav-item .nav-link{width:100%}:host ::ng-deep .tab-content>.tab-pane{display:none}:host ::ng-deep .tab-content>.active{display:block}:host ::ng-deep .tab-content{margin-top:-1px}.tsc{max-height:41px;top:2px}.tsc .nav.nav-tabs{border-bottom:0}.tsc.bottom-tabs{margin-top:-1px}.tsc.bottom-tabs .nav.nav-tabs{border-bottom-width:0px}.tsc.bottom-tabs .nav.nav-tabs .nav-link{border:1px solid transparent;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:.25rem;border-bottom-right-radius:.25rem}.tsc.bottom-tabs .nav.nav-tabs .nav-item{margin-bottom:2px;margin-top:-1px}.tsc.bottom-tabs .nav.nav-tabs .nav-item.show .nav-link,.tsc.bottom-tabs .nav.nav-tabs .nav-link.active{border-color:#fff #dee2e6 #dee2e6 #dee2e6}.tab-content.noscript::ng-deep>bs-tab-page>.tab-page-content{border:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;margin-top:-1px}.overflow-y-hidden{overflow-y:hidden}\n"], dependencies: [{ 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$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i3.BsLetDirective, selector: "[bsLet]", inputs: ["bsLet"] }, { kind: "directive", type: i2.BsNoNoscriptDirective, selector: "[bsNoNoscript]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
|
|
127
|
+
BsTabControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsTabControlComponent, selector: "bs-tab-control", inputs: { border: "border", restrictDragging: "restrictDragging", selectFirstTab: "selectFirstTab", tabsPosition: "tabsPosition" }, host: { properties: { "class.d-block": "this.dBlock", "class.position-relative": "this.positionRelative" } }, queries: [{ propertyName: "setTabPages", predicate: BsTabPageComponent }], ngImport: i0, template: "<ng-container *bsLet=\"(activeTab$ | async) as activeTab\">\n\t<div class=\"overflow-hidden mw-100 tsc\" *ngIf=\"topTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate.template\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n\t<div class=\"tab-content flex-grow-1\" bsNoNoscript [class.border]=\"border && activeTab\" [class.border-top]=\"border && !activeTab\">\n\t\t<ng-content></ng-content>\n\t</div>\n\t<div class=\"overflow-hidden mw-100 tsc bottom-tabs\" *ngIf=\"bottomTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate.template\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n</ng-container>", styles: [":host ::ng-deep .nav{--bs-nav-link-padding-x: 1rem;--bs-nav-link-padding-y: .5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color: var(--bs-link-color);--bs-nav-link-hover-color: var(--bs-link-hover-color);--bs-nav-link-disabled-color: #6c757d;display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}:host ::ng-deep .nav-link{display:block;padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);font-size:var(--bs-nav-link-font-size);font-weight:var(--bs-nav-link-font-weight);color:var(--bs-nav-link-color);text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out}@media (prefers-reduced-motion: reduce){:host ::ng-deep .nav-link{transition:none}}:host ::ng-deep .nav-link:hover,:host ::ng-deep .nav-link:focus{color:var(--bs-nav-link-hover-color)}:host ::ng-deep .nav-link.disabled{color:var(--bs-nav-link-disabled-color);pointer-events:none;cursor:default}:host ::ng-deep .nav-tabs{--bs-nav-tabs-border-width: 1px;--bs-nav-tabs-border-color: #dee2e6;--bs-nav-tabs-border-radius: .375rem;--bs-nav-tabs-link-hover-border-color: #e9ecef #e9ecef #dee2e6;--bs-nav-tabs-link-active-color: #495057;--bs-nav-tabs-link-active-bg: #fff;--bs-nav-tabs-link-active-border-color: #dee2e6 #dee2e6 #fff;border-bottom:var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color)}:host ::ng-deep .nav-tabs .nav-link{margin-bottom:calc(-1 * var(--bs-nav-tabs-border-width));background:none;border:var(--bs-nav-tabs-border-width) solid transparent;border-top-left-radius:var(--bs-nav-tabs-border-radius);border-top-right-radius:var(--bs-nav-tabs-border-radius)}:host ::ng-deep .nav-tabs .nav-link:hover,:host ::ng-deep .nav-tabs .nav-link:focus{isolation:isolate;border-color:var(--bs-nav-tabs-link-hover-border-color)}:host ::ng-deep .nav-tabs .nav-link.disabled,:host ::ng-deep .nav-tabs .nav-link:disabled{color:var(--bs-nav-link-disabled-color);background-color:transparent;border-color:transparent}:host ::ng-deep .nav-tabs .nav-link.active,:host ::ng-deep .nav-tabs .nav-item.show .nav-link{color:var(--bs-nav-tabs-link-active-color);background-color:var(--bs-nav-tabs-link-active-bg);border-color:var(--bs-nav-tabs-link-active-border-color)}:host ::ng-deep .nav-tabs .dropdown-menu{margin-top:calc(-1 * var(--bs-nav-tabs-border-width));border-top-left-radius:0;border-top-right-radius:0}:host ::ng-deep .nav-pills{--bs-nav-pills-border-radius: .375rem;--bs-nav-pills-link-active-color: #fff;--bs-nav-pills-link-active-bg: #0d6efd}:host ::ng-deep .nav-pills .nav-link{background:none;border:0;border-radius:var(--bs-nav-pills-border-radius)}:host ::ng-deep .nav-pills .nav-link:disabled{color:var(--bs-nav-link-disabled-color);background-color:transparent;border-color:transparent}:host ::ng-deep .nav-pills .nav-link.active,:host ::ng-deep .nav-pills .show>.nav-link{color:var(--bs-nav-pills-link-active-color);background-color:var(--bs-nav-pills-link-active-bg)}:host ::ng-deep .nav-fill>.nav-link,:host ::ng-deep .nav-fill .nav-item{flex:1 1 auto;text-align:center}:host ::ng-deep .nav-justified>.nav-link,:host ::ng-deep .nav-justified .nav-item{flex-basis:0;flex-grow:1;text-align:center}:host ::ng-deep .nav-fill .nav-item .nav-link,:host ::ng-deep .nav-justified .nav-item .nav-link{width:100%}:host ::ng-deep .tab-content>.tab-pane{display:none}:host ::ng-deep .tab-content>.active{display:block}:host ::ng-deep .tab-content{margin-top:-1px}.tsc{max-height:41px;top:2px;z-index:10;flex-shrink:0}.tsc .nav.nav-tabs{border-bottom:0}.tsc.bottom-tabs{margin-top:-1px}.tsc.bottom-tabs .nav.nav-tabs{border-bottom-width:0px}.tsc.bottom-tabs .nav.nav-tabs .nav-link{border:1px solid transparent;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:.25rem;border-bottom-right-radius:.25rem}.tsc.bottom-tabs .nav.nav-tabs .nav-item{margin-bottom:2px;margin-top:-1px}.tsc.bottom-tabs .nav.nav-tabs .nav-item.show .nav-link,.tsc.bottom-tabs .nav.nav-tabs .nav-link.active{border-color:#fff #dee2e6 #dee2e6 #dee2e6}.tab-content.noscript::ng-deep>bs-tab-page>.tab-page-content{border:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;margin-top:-1px}.overflow-y-hidden{overflow-y:hidden}\n"], dependencies: [{ 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$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i3.BsLetDirective, selector: "[bsLet]", inputs: ["bsLet"] }, { kind: "directive", type: i2.BsNoNoscriptDirective, selector: "[bsNoNoscript]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
|
|
115
128
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsTabControlComponent, decorators: [{
|
|
116
129
|
type: Component,
|
|
117
|
-
args: [{ selector: 'bs-tab-control', template: "<ng-container *bsLet=\"(activeTab$ | async) as activeTab\">\n\t<div class=\"overflow-hidden mw-100 tsc\" *ngIf=\"topTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n\t<div class=\"tab-content\" bsNoNoscript [class.border]=\"border && activeTab\" [class.border-top]=\"border && !activeTab\">\n\t\t<ng-content></ng-content>\n\t</div>\n\t<div class=\"overflow-hidden mw-100 tsc bottom-tabs\" *ngIf=\"bottomTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n</ng-container>", styles: [":host ::ng-deep .nav{--bs-nav-link-padding-x: 1rem;--bs-nav-link-padding-y: .5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color: var(--bs-link-color);--bs-nav-link-hover-color: var(--bs-link-hover-color);--bs-nav-link-disabled-color: #6c757d;display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}:host ::ng-deep .nav-link{display:block;padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);font-size:var(--bs-nav-link-font-size);font-weight:var(--bs-nav-link-font-weight);color:var(--bs-nav-link-color);text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out}@media (prefers-reduced-motion: reduce){:host ::ng-deep .nav-link{transition:none}}:host ::ng-deep .nav-link:hover,:host ::ng-deep .nav-link:focus{color:var(--bs-nav-link-hover-color)}:host ::ng-deep .nav-link.disabled{color:var(--bs-nav-link-disabled-color);pointer-events:none;cursor:default}:host ::ng-deep .nav-tabs{--bs-nav-tabs-border-width: 1px;--bs-nav-tabs-border-color: #dee2e6;--bs-nav-tabs-border-radius: .375rem;--bs-nav-tabs-link-hover-border-color: #e9ecef #e9ecef #dee2e6;--bs-nav-tabs-link-active-color: #495057;--bs-nav-tabs-link-active-bg: #fff;--bs-nav-tabs-link-active-border-color: #dee2e6 #dee2e6 #fff;border-bottom:var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color)}:host ::ng-deep .nav-tabs .nav-link{margin-bottom:calc(-1 * var(--bs-nav-tabs-border-width));background:none;border:var(--bs-nav-tabs-border-width) solid transparent;border-top-left-radius:var(--bs-nav-tabs-border-radius);border-top-right-radius:var(--bs-nav-tabs-border-radius)}:host ::ng-deep .nav-tabs .nav-link:hover,:host ::ng-deep .nav-tabs .nav-link:focus{isolation:isolate;border-color:var(--bs-nav-tabs-link-hover-border-color)}:host ::ng-deep .nav-tabs .nav-link.disabled,:host ::ng-deep .nav-tabs .nav-link:disabled{color:var(--bs-nav-link-disabled-color);background-color:transparent;border-color:transparent}:host ::ng-deep .nav-tabs .nav-link.active,:host ::ng-deep .nav-tabs .nav-item.show .nav-link{color:var(--bs-nav-tabs-link-active-color);background-color:var(--bs-nav-tabs-link-active-bg);border-color:var(--bs-nav-tabs-link-active-border-color)}:host ::ng-deep .nav-tabs .dropdown-menu{margin-top:calc(-1 * var(--bs-nav-tabs-border-width));border-top-left-radius:0;border-top-right-radius:0}:host ::ng-deep .nav-pills{--bs-nav-pills-border-radius: .375rem;--bs-nav-pills-link-active-color: #fff;--bs-nav-pills-link-active-bg: #0d6efd}:host ::ng-deep .nav-pills .nav-link{background:none;border:0;border-radius:var(--bs-nav-pills-border-radius)}:host ::ng-deep .nav-pills .nav-link:disabled{color:var(--bs-nav-link-disabled-color);background-color:transparent;border-color:transparent}:host ::ng-deep .nav-pills .nav-link.active,:host ::ng-deep .nav-pills .show>.nav-link{color:var(--bs-nav-pills-link-active-color);background-color:var(--bs-nav-pills-link-active-bg)}:host ::ng-deep .nav-fill>.nav-link,:host ::ng-deep .nav-fill .nav-item{flex:1 1 auto;text-align:center}:host ::ng-deep .nav-justified>.nav-link,:host ::ng-deep .nav-justified .nav-item{flex-basis:0;flex-grow:1;text-align:center}:host ::ng-deep .nav-fill .nav-item .nav-link,:host ::ng-deep .nav-justified .nav-item .nav-link{width:100%}:host ::ng-deep .tab-content>.tab-pane{display:none}:host ::ng-deep .tab-content>.active{display:block}:host ::ng-deep .tab-content{margin-top:-1px}.tsc{max-height:41px;top:2px}.tsc .nav.nav-tabs{border-bottom:0}.tsc.bottom-tabs{margin-top:-1px}.tsc.bottom-tabs .nav.nav-tabs{border-bottom-width:0px}.tsc.bottom-tabs .nav.nav-tabs .nav-link{border:1px solid transparent;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:.25rem;border-bottom-right-radius:.25rem}.tsc.bottom-tabs .nav.nav-tabs .nav-item{margin-bottom:2px;margin-top:-1px}.tsc.bottom-tabs .nav.nav-tabs .nav-item.show .nav-link,.tsc.bottom-tabs .nav.nav-tabs .nav-link.active{border-color:#fff #dee2e6 #dee2e6 #dee2e6}.tab-content.noscript::ng-deep>bs-tab-page>.tab-page-content{border:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;margin-top:-1px}.overflow-y-hidden{overflow-y:hidden}\n"] }]
|
|
130
|
+
args: [{ selector: 'bs-tab-control', template: "<ng-container *bsLet=\"(activeTab$ | async) as activeTab\">\n\t<div class=\"overflow-hidden mw-100 tsc\" *ngIf=\"topTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate.template\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n\t<div class=\"tab-content flex-grow-1\" bsNoNoscript [class.border]=\"border && activeTab\" [class.border-top]=\"border && !activeTab\">\n\t\t<ng-content></ng-content>\n\t</div>\n\t<div class=\"overflow-hidden mw-100 tsc bottom-tabs\" *ngIf=\"bottomTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate.template\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n</ng-container>", styles: [":host ::ng-deep .nav{--bs-nav-link-padding-x: 1rem;--bs-nav-link-padding-y: .5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color: var(--bs-link-color);--bs-nav-link-hover-color: var(--bs-link-hover-color);--bs-nav-link-disabled-color: #6c757d;display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}:host ::ng-deep .nav-link{display:block;padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);font-size:var(--bs-nav-link-font-size);font-weight:var(--bs-nav-link-font-weight);color:var(--bs-nav-link-color);text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out}@media (prefers-reduced-motion: reduce){:host ::ng-deep .nav-link{transition:none}}:host ::ng-deep .nav-link:hover,:host ::ng-deep .nav-link:focus{color:var(--bs-nav-link-hover-color)}:host ::ng-deep .nav-link.disabled{color:var(--bs-nav-link-disabled-color);pointer-events:none;cursor:default}:host ::ng-deep .nav-tabs{--bs-nav-tabs-border-width: 1px;--bs-nav-tabs-border-color: #dee2e6;--bs-nav-tabs-border-radius: .375rem;--bs-nav-tabs-link-hover-border-color: #e9ecef #e9ecef #dee2e6;--bs-nav-tabs-link-active-color: #495057;--bs-nav-tabs-link-active-bg: #fff;--bs-nav-tabs-link-active-border-color: #dee2e6 #dee2e6 #fff;border-bottom:var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color)}:host ::ng-deep .nav-tabs .nav-link{margin-bottom:calc(-1 * var(--bs-nav-tabs-border-width));background:none;border:var(--bs-nav-tabs-border-width) solid transparent;border-top-left-radius:var(--bs-nav-tabs-border-radius);border-top-right-radius:var(--bs-nav-tabs-border-radius)}:host ::ng-deep .nav-tabs .nav-link:hover,:host ::ng-deep .nav-tabs .nav-link:focus{isolation:isolate;border-color:var(--bs-nav-tabs-link-hover-border-color)}:host ::ng-deep .nav-tabs .nav-link.disabled,:host ::ng-deep .nav-tabs .nav-link:disabled{color:var(--bs-nav-link-disabled-color);background-color:transparent;border-color:transparent}:host ::ng-deep .nav-tabs .nav-link.active,:host ::ng-deep .nav-tabs .nav-item.show .nav-link{color:var(--bs-nav-tabs-link-active-color);background-color:var(--bs-nav-tabs-link-active-bg);border-color:var(--bs-nav-tabs-link-active-border-color)}:host ::ng-deep .nav-tabs .dropdown-menu{margin-top:calc(-1 * var(--bs-nav-tabs-border-width));border-top-left-radius:0;border-top-right-radius:0}:host ::ng-deep .nav-pills{--bs-nav-pills-border-radius: .375rem;--bs-nav-pills-link-active-color: #fff;--bs-nav-pills-link-active-bg: #0d6efd}:host ::ng-deep .nav-pills .nav-link{background:none;border:0;border-radius:var(--bs-nav-pills-border-radius)}:host ::ng-deep .nav-pills .nav-link:disabled{color:var(--bs-nav-link-disabled-color);background-color:transparent;border-color:transparent}:host ::ng-deep .nav-pills .nav-link.active,:host ::ng-deep .nav-pills .show>.nav-link{color:var(--bs-nav-pills-link-active-color);background-color:var(--bs-nav-pills-link-active-bg)}:host ::ng-deep .nav-fill>.nav-link,:host ::ng-deep .nav-fill .nav-item{flex:1 1 auto;text-align:center}:host ::ng-deep .nav-justified>.nav-link,:host ::ng-deep .nav-justified .nav-item{flex-basis:0;flex-grow:1;text-align:center}:host ::ng-deep .nav-fill .nav-item .nav-link,:host ::ng-deep .nav-justified .nav-item .nav-link{width:100%}:host ::ng-deep .tab-content>.tab-pane{display:none}:host ::ng-deep .tab-content>.active{display:block}:host ::ng-deep .tab-content{margin-top:-1px}.tsc{max-height:41px;top:2px;z-index:10;flex-shrink:0}.tsc .nav.nav-tabs{border-bottom:0}.tsc.bottom-tabs{margin-top:-1px}.tsc.bottom-tabs .nav.nav-tabs{border-bottom-width:0px}.tsc.bottom-tabs .nav.nav-tabs .nav-link{border:1px solid transparent;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:.25rem;border-bottom-right-radius:.25rem}.tsc.bottom-tabs .nav.nav-tabs .nav-item{margin-bottom:2px;margin-top:-1px}.tsc.bottom-tabs .nav.nav-tabs .nav-item.show .nav-link,.tsc.bottom-tabs .nav.nav-tabs .nav-link.active{border-color:#fff #dee2e6 #dee2e6 #dee2e6}.tab-content.noscript::ng-deep>bs-tab-page>.tab-page-content{border:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;margin-top:-1px}.overflow-y-hidden{overflow-y:hidden}\n"] }]
|
|
118
131
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { dBlock: [{
|
|
119
132
|
type: HostBinding,
|
|
120
133
|
args: ['class.d-block']
|
|
@@ -138,11 +151,13 @@ class BsTabControlModule {
|
|
|
138
151
|
}
|
|
139
152
|
BsTabControlModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsTabControlModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
140
153
|
BsTabControlModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.3", ngImport: i0, type: BsTabControlModule, declarations: [BsTabControlComponent,
|
|
141
|
-
BsTabPageComponent
|
|
154
|
+
BsTabPageComponent,
|
|
155
|
+
BsTabPageHeaderDirective], imports: [CommonModule,
|
|
142
156
|
DragDropModule,
|
|
143
157
|
BsLetModule,
|
|
144
158
|
BsNoNoscriptModule], exports: [BsTabControlComponent,
|
|
145
|
-
BsTabPageComponent
|
|
159
|
+
BsTabPageComponent,
|
|
160
|
+
BsTabPageHeaderDirective] });
|
|
146
161
|
BsTabControlModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsTabControlModule, imports: [CommonModule,
|
|
147
162
|
DragDropModule,
|
|
148
163
|
BsLetModule,
|
|
@@ -153,6 +168,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImpor
|
|
|
153
168
|
declarations: [
|
|
154
169
|
BsTabControlComponent,
|
|
155
170
|
BsTabPageComponent,
|
|
171
|
+
BsTabPageHeaderDirective,
|
|
156
172
|
],
|
|
157
173
|
imports: [
|
|
158
174
|
CommonModule,
|
|
@@ -163,6 +179,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImpor
|
|
|
163
179
|
exports: [
|
|
164
180
|
BsTabControlComponent,
|
|
165
181
|
BsTabPageComponent,
|
|
182
|
+
BsTabPageHeaderDirective,
|
|
166
183
|
]
|
|
167
184
|
}]
|
|
168
185
|
}] });
|
|
@@ -171,5 +188,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImpor
|
|
|
171
188
|
* Generated bundle index. Do not edit.
|
|
172
189
|
*/
|
|
173
190
|
|
|
174
|
-
export { BsTabControlComponent, BsTabControlModule, BsTabPageComponent };
|
|
191
|
+
export { BsTabControlComponent, BsTabControlModule, BsTabPageComponent, BsTabPageHeaderDirective };
|
|
175
192
|
//# sourceMappingURL=mintplayer-ng-bootstrap-tab-control.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mintplayer-ng-bootstrap-tab-control.mjs","sources":["../../../../libs/mintplayer-ng-bootstrap/tab-control/src/tab-page/tab-page.component.ts","../../../../libs/mintplayer-ng-bootstrap/tab-control/src/tab-page/tab-page.component.html","../../../../libs/mintplayer-ng-bootstrap/tab-control/src/tab-control/tab-control.component.ts","../../../../libs/mintplayer-ng-bootstrap/tab-control/src/tab-control/tab-control.component.html","../../../../libs/mintplayer-ng-bootstrap/tab-control/src/tab-control.module.ts","../../../../libs/mintplayer-ng-bootstrap/tab-control/mintplayer-ng-bootstrap-tab-control.ts"],"sourcesContent":["import { Component, ContentChild, TemplateRef, Input, ElementRef } from '@angular/core';\nimport { BehaviorSubject, combineLatest, map, Observable } from 'rxjs';\nimport { BsTabControlComponent } from '../tab-control/tab-control.component';\n\n@Component({\n selector: 'bs-tab-page',\n templateUrl: './tab-page.component.html',\n styleUrls: ['./tab-page.component.scss']\n})\nexport class BsTabPageComponent {\n\n constructor(tabControl: BsTabControlComponent, element: ElementRef<any>) {\n this.element = element;\n this.tabControl = tabControl;\n this.tabId$ = new BehaviorSubject<number>(++this.tabControl.tabCounter);\n this.tabName$ = combineLatest([this.tabControl.tabControlName$, this.tabId$])\n .pipe(map(([tabControlName, tabId]) => `${tabControlName}-${tabId}`));\n }\n\n element: ElementRef<any>;\n tabControl: BsTabControlComponent;\n tabId$: BehaviorSubject<number>;\n tabName$: Observable<string>;\n\n @Input() disabled = false;\n @ContentChild(TemplateRef) headerTemplate!: TemplateRef<any>;\n\n}\n","<input type=\"radio\" bsNoNoscript class=\"d-none\" [name]=\"tabControl.tabControlName$ | async\" [id]=\"tabName$ | async\">\n<div class=\"tab-page-content\" [class.d-block]=\"(tabControl.activeTab$ | async) === this\">\n <ng-content></ng-content>\n</div>","import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';\nimport { Component, ContentChildren, ElementRef, HostBinding, Input, OnDestroy, QueryList, Renderer2 } from '@angular/core';\nimport { BehaviorSubject, combineLatest, filter, map, Observable, Subject, takeUntil } from 'rxjs';\nimport { BsTabPageComponent } from '../tab-page/tab-page.component';\nimport { BsTabsPosition } from '../tabs-position';\n\n@Component({\n selector: 'bs-tab-control',\n templateUrl: './tab-control.component.html',\n styleUrls: ['./tab-control.component.scss']\n})\nexport class BsTabControlComponent implements OnDestroy {\n\n constructor(element: ElementRef<any>) {\n this.tabControlId$ = new BehaviorSubject<number>(++BsTabControlComponent.tabControlCounter);\n this.tabControlName$ = this.tabControlId$.pipe(map((id) => `bs-tab-control-${id}`));\n this.element = element;\n combineLatest([this.tabPages$, this.activeTab$, this.selectFirstTab$])\n .pipe(filter(([tabPages, activeTab, selectFirstTab]) => {\n return !!tabPages && (!activeTab || !tabPages.some(tp => tp === activeTab)) && selectFirstTab;\n }))\n .pipe(takeUntil(this.destroyed$))\n .subscribe(([tabPages, activeTab, selectFirstTab]) => {\n const notDisabled = tabPages!.filter((tp) => !tp.disabled);\n if (notDisabled.length > 0) {\n this.activeTab$.next(notDisabled[0]);\n }\n });\n this.topTabs$ = this.tabsPosition$.pipe(map(position => position === 'top'));\n this.bottomTabs$ = this.tabsPosition$.pipe(map(position => position === 'bottom'));\n }\n\n @HostBinding('class.d-block') dBlock = true;\n @HostBinding('class.position-relative') positionRelative = true;\n @ContentChildren(BsTabPageComponent) set setTabPages(value: QueryList<BsTabPageComponent>) {\n console.log('tabpages', value);\n this.tabPages$.next(value);\n const missing = value.filter(tp => !this.orderedTabPages.includes(tp));\n this.orderedTabPages = this.orderedTabPages.concat(missing);\n }\n @Input() public border = true;\n @Input() public set restrictDragging(value: boolean) {\n this.dragBoundarySelector = value ? 'ul' : '';\n }\n dragBoundarySelector = '';\n element: ElementRef<any>;\n tabPages$ = new BehaviorSubject<QueryList<BsTabPageComponent> | null>(null);\n activeTab$ = new BehaviorSubject<BsTabPageComponent | null>(null);\n orderedTabPages: BsTabPageComponent[] = [];\n tabControlId$: BehaviorSubject<number>;\n tabControlName$: Observable<string>;\n topTabs$: Observable<boolean>;\n bottomTabs$: Observable<boolean>;\n static tabControlCounter = 0;\n tabCounter = 0;\n destroyed$ = new Subject()\n\n //#region SelectFirstTab\n selectFirstTab$ = new BehaviorSubject<boolean>(true);\n public get selectFirstTab() {\n return this.selectFirstTab$.value;\n }\n @Input() public set selectFirstTab(value: boolean) {\n this.selectFirstTab$.next(value);\n }\n //#endregion\n //#region TabsPosition\n tabsPosition$ = new BehaviorSubject<BsTabsPosition>('top');\n public get tabsPosition() {\n return this.tabsPosition$.value;\n }\n @Input() public set tabsPosition(value: BsTabsPosition) {\n this.tabsPosition$.next(value);\n }\n //#endregion\n\n setActiveTab(tab: BsTabPageComponent) {\n if (!tab.disabled) {\n this.activeTab$.next(tab);\n }\n return false;\n }\n\n moveTab(ev: CdkDragDrop<QueryList<BsTabPageComponent> | null>) {\n if (ev.previousContainer === ev.container) {\n moveItemInArray(\n this.orderedTabPages,\n ev.previousIndex, \n ev.currentIndex);\n } else {\n // transferArrayItem(\n // ev.previousContainer.data,\n // ev.container.data,\n // ev.previousIndex,\n // ev.currentIndex);\n }\n }\n\n ngOnDestroy() {\n this.destroyed$.next(true);\n }\n\n}\n","<ng-container *bsLet=\"(activeTab$ | async) as activeTab\">\n\t<div class=\"overflow-hidden mw-100 tsc\" *ngIf=\"topTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n\t<div class=\"tab-content\" bsNoNoscript [class.border]=\"border && activeTab\" [class.border-top]=\"border && !activeTab\">\n\t\t<ng-content></ng-content>\n\t</div>\n\t<div class=\"overflow-hidden mw-100 tsc bottom-tabs\" *ngIf=\"bottomTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n</ng-container>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { BsLetModule } from '@mintplayer/ng-bootstrap/let';\nimport { BsNoNoscriptModule } from '@mintplayer/ng-bootstrap/no-noscript';\nimport { BsTabControlComponent } from './tab-control/tab-control.component';\nimport { BsTabPageComponent } from './tab-page/tab-page.component';\n\n@NgModule({\n declarations: [\n BsTabControlComponent,\n BsTabPageComponent,\n ],\n imports: [\n CommonModule,\n DragDropModule,\n BsLetModule,\n BsNoNoscriptModule\n ],\n exports: [\n BsTabControlComponent,\n BsTabPageComponent,\n ]\n})\nexport class BsTabControlModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1.BsTabControlComponent","i3","i2","i4"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"mintplayer-ng-bootstrap-tab-control.mjs","sources":["../../../../libs/mintplayer-ng-bootstrap/tab-control/src/tab-page-header/tab-page-header.directive.ts","../../../../libs/mintplayer-ng-bootstrap/tab-control/src/tab-page/tab-page.component.ts","../../../../libs/mintplayer-ng-bootstrap/tab-control/src/tab-page/tab-page.component.html","../../../../libs/mintplayer-ng-bootstrap/tab-control/src/tab-control/tab-control.component.ts","../../../../libs/mintplayer-ng-bootstrap/tab-control/src/tab-control/tab-control.component.html","../../../../libs/mintplayer-ng-bootstrap/tab-control/src/tab-control.module.ts","../../../../libs/mintplayer-ng-bootstrap/tab-control/mintplayer-ng-bootstrap-tab-control.ts"],"sourcesContent":["import { Directive, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[bsTabPageHeader]'\n})\nexport class BsTabPageHeaderDirective {\n\n constructor(public template: TemplateRef<any>) {}\n\n}\n","import { Component, ContentChild, TemplateRef, Input, ElementRef } from '@angular/core';\nimport { BehaviorSubject, combineLatest, map, Observable } from 'rxjs';\nimport { BsTabControlComponent } from '../tab-control/tab-control.component';\nimport { BsTabPageHeaderDirective } from '../tab-page-header/tab-page-header.directive';\n\n@Component({\n selector: 'bs-tab-page',\n templateUrl: './tab-page.component.html',\n styleUrls: ['./tab-page.component.scss']\n})\nexport class BsTabPageComponent {\n\n constructor(tabControl: BsTabControlComponent, element: ElementRef<any>) {\n this.element = element;\n this.tabControl = tabControl;\n this.tabId$ = new BehaviorSubject<number>(++this.tabControl.tabCounter);\n this.tabName$ = combineLatest([this.tabControl.tabControlName$, this.tabId$])\n .pipe(map(([tabControlName, tabId]) => `${tabControlName}-${tabId}`));\n }\n\n element: ElementRef<any>;\n tabControl: BsTabControlComponent;\n tabId$: BehaviorSubject<number>;\n tabName$: Observable<string>;\n\n @Input() disabled = false;\n @ContentChild(BsTabPageHeaderDirective) headerTemplate!: BsTabPageHeaderDirective;\n\n}\n","<input type=\"radio\" bsNoNoscript class=\"d-none\" [name]=\"tabControl.tabControlName$ | async\" [id]=\"tabName$ | async\">\n<div class=\"tab-page-content\" [class.d-block]=\"(tabControl.activeTab$ | async) === this\">\n <ng-content></ng-content>\n</div>","import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';\nimport { Component, ContentChildren, ElementRef, HostBinding, Input, OnDestroy, QueryList, Renderer2 } from '@angular/core';\nimport { BehaviorSubject, combineLatest, filter, map, Observable, Subject, takeUntil } from 'rxjs';\nimport { BsTabPageComponent } from '../tab-page/tab-page.component';\nimport { BsTabsPosition } from '../tabs-position';\n\n@Component({\n selector: 'bs-tab-control',\n templateUrl: './tab-control.component.html',\n styleUrls: ['./tab-control.component.scss']\n})\nexport class BsTabControlComponent implements OnDestroy {\n\n constructor(element: ElementRef<any>) {\n this.tabControlId$ = new BehaviorSubject<number>(++BsTabControlComponent.tabControlCounter);\n this.tabControlName$ = this.tabControlId$.pipe(map((id) => `bs-tab-control-${id}`));\n this.element = element;\n combineLatest([this.tabPages$, this.activeTab$, this.selectFirstTab$])\n .pipe(filter(([tabPages, activeTab, selectFirstTab]) => {\n return !!tabPages && (!activeTab || !tabPages.some(tp => tp === activeTab)) && selectFirstTab;\n }))\n .pipe(takeUntil(this.destroyed$))\n .subscribe(([tabPages, activeTab, selectFirstTab]) => {\n const notDisabled = tabPages!.filter((tp) => !tp.disabled);\n if (notDisabled.length > 0) {\n setTimeout(() => this.activeTab$.next(notDisabled[0]));\n }\n });\n this.topTabs$ = this.tabsPosition$.pipe(map(position => position === 'top'));\n this.bottomTabs$ = this.tabsPosition$.pipe(map(position => position === 'bottom'));\n }\n\n @HostBinding('class.d-block') dBlock = true;\n @HostBinding('class.position-relative') positionRelative = true;\n @ContentChildren(BsTabPageComponent) set setTabPages(value: QueryList<BsTabPageComponent>) {\n this.tabPages$.next(value);\n const missing = value.filter(tp => !this.orderedTabPages.includes(tp));\n this.orderedTabPages = this.orderedTabPages.concat(missing);\n }\n @Input() public border = true;\n @Input() public set restrictDragging(value: boolean) {\n this.dragBoundarySelector = value ? 'ul' : '';\n }\n dragBoundarySelector = '';\n element: ElementRef<any>;\n tabPages$ = new BehaviorSubject<QueryList<BsTabPageComponent> | null>(null);\n activeTab$ = new BehaviorSubject<BsTabPageComponent | null>(null);\n orderedTabPages: BsTabPageComponent[] = [];\n tabControlId$: BehaviorSubject<number>;\n tabControlName$: Observable<string>;\n topTabs$: Observable<boolean>;\n bottomTabs$: Observable<boolean>;\n static tabControlCounter = 0;\n tabCounter = 0;\n destroyed$ = new Subject()\n\n //#region SelectFirstTab\n selectFirstTab$ = new BehaviorSubject<boolean>(true);\n public get selectFirstTab() {\n return this.selectFirstTab$.value;\n }\n @Input() public set selectFirstTab(value: boolean) {\n this.selectFirstTab$.next(value);\n }\n //#endregion\n //#region TabsPosition\n tabsPosition$ = new BehaviorSubject<BsTabsPosition>('top');\n public get tabsPosition() {\n return this.tabsPosition$.value;\n }\n @Input() public set tabsPosition(value: BsTabsPosition) {\n this.tabsPosition$.next(value);\n }\n //#endregion\n\n setActiveTab(tab: BsTabPageComponent) {\n if (!tab.disabled) {\n this.activeTab$.next(tab);\n }\n return false;\n }\n\n moveTab(ev: CdkDragDrop<QueryList<BsTabPageComponent> | null>) {\n if (ev.previousContainer === ev.container) {\n moveItemInArray(\n this.orderedTabPages,\n ev.previousIndex, \n ev.currentIndex);\n } else {\n // transferArrayItem(\n // ev.previousContainer.data,\n // ev.container.data,\n // ev.previousIndex,\n // ev.currentIndex);\n }\n }\n\n ngOnDestroy() {\n this.destroyed$.next(true);\n }\n\n}\n","<ng-container *bsLet=\"(activeTab$ | async) as activeTab\">\n\t<div class=\"overflow-hidden mw-100 tsc\" *ngIf=\"topTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate.template\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n\t<div class=\"tab-content flex-grow-1\" bsNoNoscript [class.border]=\"border && activeTab\" [class.border-top]=\"border && !activeTab\">\n\t\t<ng-content></ng-content>\n\t</div>\n\t<div class=\"overflow-hidden mw-100 tsc bottom-tabs\" *ngIf=\"bottomTabs$ | async\">\n\t\t<ul cdkDropList #list #tabList=\"cdkDropList\"\n\t\t\t[cdkDropListData]=\"tabPages$ | async\"\n\t\t\t[cdkDropListConnectedTo]=\"[]\"\n\t\t\t[cdkDropListOrientation]=\"'horizontal'\"\n\t\t\t(cdkDropListDropped)=\"moveTab($event)\"\n\t\t\tclass=\"nav nav-tabs flex-nowrap overflow-x-auto overflow-y-hidden\">\n\t\t\t<ng-container *ngFor=\"let tab of orderedTabPages\">\n\t\t\t\t<span class=\"nav-item\" (click)=\"setActiveTab(tab)\" *ngIf=\"!!tab.headerTemplate\" cdkDrag [cdkDragBoundary]=\"dragBoundarySelector\" [cdkDragStartDelay]=\"1000\">\n\t\t\t\t\t<label [for]=\"tab.tabName$ | async\" class=\"nav-link text-nowrap cursor-pointer\" [class.active]=\"activeTab === tab\" [class.disabled]=\"tab.disabled\" [attr.aria-current]=\"activeTab === tab ? 'page' : null\" [attr.aria-disabled]=\"tab.disabled\">\n\t\t\t\t\t\t<ng-container [ngTemplateOutlet]=\"tab.headerTemplate.template\"></ng-container>\n\t\t\t\t\t</label>\n\t\t\t\t</span>\n\t\t\t</ng-container>\n\t\t</ul>\n\t</div>\n</ng-container>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { BsLetModule } from '@mintplayer/ng-bootstrap/let';\nimport { BsNoNoscriptModule } from '@mintplayer/ng-bootstrap/no-noscript';\nimport { BsTabControlComponent } from './tab-control/tab-control.component';\nimport { BsTabPageComponent } from './tab-page/tab-page.component';\nimport { BsTabPageHeaderDirective } from './tab-page-header/tab-page-header.directive';\n\n@NgModule({\n declarations: [\n BsTabControlComponent,\n BsTabPageComponent,\n BsTabPageHeaderDirective,\n ],\n imports: [\n CommonModule,\n DragDropModule,\n BsLetModule,\n BsNoNoscriptModule\n ],\n exports: [\n BsTabControlComponent,\n BsTabPageComponent,\n BsTabPageHeaderDirective,\n ]\n})\nexport class BsTabControlModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1.BsTabControlComponent","i3","i2","i4"],"mappings":"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"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, Input, ContentChildren,
|
|
3
|
-
import * as
|
|
2
|
+
import { Component, ViewChild, Input, ContentChildren, ViewChildren, HostBinding, HostListener, NgModule } from '@angular/core';
|
|
3
|
+
import * as i2 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
|
-
import * as i2 from '@angular/cdk/portal';
|
|
5
|
+
import * as i2$1 from '@angular/cdk/portal';
|
|
6
6
|
import { DomPortal, PortalModule } from '@angular/cdk/portal';
|
|
7
|
-
import * as i1 from '@mintplayer/ng-bootstrap/card';
|
|
8
7
|
import { BsCardModule } from '@mintplayer/ng-bootstrap/card';
|
|
9
8
|
import * as i4 from '@mintplayer/ng-bootstrap/splitter';
|
|
10
9
|
import { BsSplitterModule } from '@mintplayer/ng-bootstrap/splitter';
|
|
@@ -12,26 +11,32 @@ import * as i5 from '@mintplayer/ng-bootstrap/tab-control';
|
|
|
12
11
|
import { BsTabControlModule } from '@mintplayer/ng-bootstrap/tab-control';
|
|
13
12
|
import * as i3 from '@mintplayer/ng-bootstrap/instance-of';
|
|
14
13
|
import { BsInstanceOfModule } from '@mintplayer/ng-bootstrap/instance-of';
|
|
15
|
-
import { BehaviorSubject, Subject } from 'rxjs';
|
|
16
|
-
import * as i1
|
|
14
|
+
import { BehaviorSubject, Subject, takeUntil } from 'rxjs';
|
|
15
|
+
import * as i1 from '@angular/cdk/overlay';
|
|
17
16
|
|
|
18
17
|
class BsDockPanelComponent {
|
|
19
|
-
constructor(
|
|
20
|
-
this.element = element;
|
|
18
|
+
constructor() {
|
|
21
19
|
this.panelId = '';
|
|
22
|
-
this.
|
|
20
|
+
// this.contentPortal = new DomPortal(this.element.nativeElement);
|
|
23
21
|
}
|
|
24
22
|
ngAfterViewInit() {
|
|
25
|
-
console.log('attach dockpanel', this.element.nativeElement);
|
|
26
|
-
this.
|
|
23
|
+
// console.log('attach dockpanel', this.element.nativeElement);
|
|
24
|
+
this.headerPortal = new DomPortal(this.headerElement.nativeElement);
|
|
25
|
+
this.contentPortal = new DomPortal(this.contentElement.nativeElement);
|
|
27
26
|
}
|
|
28
27
|
}
|
|
29
|
-
BsDockPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockPanelComponent, deps: [
|
|
30
|
-
BsDockPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsDockPanelComponent, selector: "bs-dock-panel", inputs: { panelId: "panelId" }, ngImport: i0, template: "<!-- <bs-split-panel> -->\n
|
|
28
|
+
BsDockPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
29
|
+
BsDockPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsDockPanelComponent, selector: "bs-dock-panel", inputs: { panelId: "panelId" }, viewQueries: [{ propertyName: "headerElement", first: true, predicate: ["headerElement"], descendants: true }, { propertyName: "contentElement", first: true, predicate: ["contentElement"], descendants: true }], ngImport: i0, template: "<!-- <bs-split-panel> -->\n<div #headerElement class=\"dock-header\">\n <ng-content select=\"bs-dock-panel-header\"></ng-content>\n</div>\n<div #contentElement>\n <ng-content></ng-content>\n</div>\n<!-- </bs-split-panel> -->", styles: [".dock-header{padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);margin:calc(-1 * var(--bs-nav-link-padding-y)) calc(-1 * var(--bs-nav-link-padding-x))}\n"] });
|
|
31
30
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockPanelComponent, decorators: [{
|
|
32
31
|
type: Component,
|
|
33
|
-
args: [{ selector: 'bs-dock-panel', template: "<!-- <bs-split-panel> -->\n
|
|
34
|
-
}], ctorParameters: function () { return [
|
|
32
|
+
args: [{ selector: 'bs-dock-panel', template: "<!-- <bs-split-panel> -->\n<div #headerElement class=\"dock-header\">\n <ng-content select=\"bs-dock-panel-header\"></ng-content>\n</div>\n<div #contentElement>\n <ng-content></ng-content>\n</div>\n<!-- </bs-split-panel> -->", styles: [".dock-header{padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);margin:calc(-1 * var(--bs-nav-link-padding-y)) calc(-1 * var(--bs-nav-link-padding-x))}\n"] }]
|
|
33
|
+
}], ctorParameters: function () { return []; }, propDecorators: { headerElement: [{
|
|
34
|
+
type: ViewChild,
|
|
35
|
+
args: ['headerElement']
|
|
36
|
+
}], contentElement: [{
|
|
37
|
+
type: ViewChild,
|
|
38
|
+
args: ['contentElement']
|
|
39
|
+
}], panelId: [{
|
|
35
40
|
type: Input
|
|
36
41
|
}] } });
|
|
37
42
|
|
|
@@ -78,7 +83,7 @@ class BsContentPane extends BsDockPane {
|
|
|
78
83
|
}
|
|
79
84
|
|
|
80
85
|
class BsDockPaneRendererComponent {
|
|
81
|
-
constructor() {
|
|
86
|
+
constructor(element) {
|
|
82
87
|
this.paneTypes = EPaneType;
|
|
83
88
|
this.BsDocumentHostType = BsDocumentHost;
|
|
84
89
|
this.BsTabGroupType = BsTabGroupPane;
|
|
@@ -102,6 +107,7 @@ class BsDockPaneRendererComponent {
|
|
|
102
107
|
// // throw 'unknown pane type';
|
|
103
108
|
// }
|
|
104
109
|
// }));
|
|
110
|
+
this.portal = new DomPortal(element);
|
|
105
111
|
}
|
|
106
112
|
get layout() {
|
|
107
113
|
return this.layout$.value;
|
|
@@ -111,20 +117,24 @@ class BsDockPaneRendererComponent {
|
|
|
111
117
|
this.layout$.next(value);
|
|
112
118
|
}
|
|
113
119
|
}
|
|
114
|
-
BsDockPaneRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockPaneRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
115
|
-
BsDockPaneRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsDockPaneRendererComponent, selector: "bs-dock-pane-renderer", inputs: { layout: "layout" }, ngImport: i0, template: "<!-- <ng-content></ng-content> -->\n<ng-container [bsInstanceof]=\"layout$ | async\">\n <div *bsInstanceofCase=\"BsDocumentHostType; let documentHost\">\n <bs-dock-pane-renderer [layout]=\"documentHost\"></bs-dock-pane-renderer>\n </div>\n <bs-tab-control *bsInstanceofCase=\"BsTabGroupType; let tabGroup\">\n <bs-tab-page *ngFor=\"let tab of tabGroup.panes\">\n <ng-template
|
|
120
|
+
BsDockPaneRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockPaneRendererComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
121
|
+
BsDockPaneRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsDockPaneRendererComponent, selector: "bs-dock-pane-renderer", inputs: { layout: "layout" }, ngImport: i0, template: "<!-- <ng-content></ng-content> -->\n<ng-container [bsInstanceof]=\"layout$ | async\">\n <div *bsInstanceofCase=\"BsDocumentHostType; let documentHost\" data-hello>\n <bs-dock-pane-renderer [layout]=\"documentHost\"></bs-dock-pane-renderer>\n </div>\n <bs-tab-control *bsInstanceofCase=\"BsTabGroupType; let tabGroup\" class=\"d-flex flex-column h-100 dock-tabs\">\n <bs-tab-page *ngFor=\"let tab of tabGroup.panes\">\n <ng-container *bsTabPageHeader>\n <ng-template [cdkPortalOutlet]=\"tab.dockPanel.headerPortal\"></ng-template>\n </ng-container>\n <bs-dock-pane-renderer [layout]=\"tab\"></bs-dock-pane-renderer>\n </bs-tab-page>\n </bs-tab-control>\n <bs-splitter *bsInstanceofCase=\"BsSplitterType; let splitter\" [orientation]=\"splitter.orientation\">\n <bs-split-panel *ngFor=\"let panel of splitter.panes\">\n <bs-dock-pane-renderer [layout]=\"panel\"></bs-dock-pane-renderer>\n </bs-split-panel>\n </bs-splitter>\n <ng-container *bsInstanceofCase=\"BsContentPaneType; let content\">\n <ng-template [cdkPortalOutlet]=\"content.dockPanel.contentPortal\"></ng-template>\n </ng-container>\n <div *bsInstanceofDefault>\n No match\n </div>\n</ng-container>", styles: [".dock-tabs{background:#F3F3F3}:host ::ng-deep .tab-page-content{background:#FFF;min-height:100%}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: i3.BsInstanceOfDirective, selector: "[bsInstanceof]", inputs: ["bsInstanceof"] }, { kind: "directive", type: i3.BsInstanceofCaseDirective, selector: "[bsInstanceofCase]", inputs: ["bsInstanceofCase"] }, { kind: "directive", type: i3.BsInstanceOfDefaultDirective, selector: "[bsInstanceofDefault]" }, { kind: "component", type: i4.BsSplitterComponent, selector: "bs-splitter", inputs: ["orientation"] }, { kind: "component", type: i4.BsSplitPanelComponent, selector: "bs-split-panel" }, { kind: "component", type: i5.BsTabControlComponent, selector: "bs-tab-control", inputs: ["border", "restrictDragging", "selectFirstTab", "tabsPosition"] }, { kind: "component", type: i5.BsTabPageComponent, selector: "bs-tab-page", inputs: ["disabled"] }, { kind: "directive", type: i5.BsTabPageHeaderDirective, selector: "[bsTabPageHeader]" }, { kind: "component", type: BsDockPaneRendererComponent, selector: "bs-dock-pane-renderer", inputs: ["layout"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
116
122
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockPaneRendererComponent, decorators: [{
|
|
117
123
|
type: Component,
|
|
118
|
-
args: [{ selector: 'bs-dock-pane-renderer', template: "<!-- <ng-content></ng-content> -->\n<ng-container [bsInstanceof]=\"layout$ | async\">\n <div *bsInstanceofCase=\"BsDocumentHostType; let documentHost\">\n <bs-dock-pane-renderer [layout]=\"documentHost\"></bs-dock-pane-renderer>\n </div>\n <bs-tab-control *bsInstanceofCase=\"BsTabGroupType; let tabGroup\">\n <bs-tab-page *ngFor=\"let tab of tabGroup.panes\">\n <ng-template
|
|
119
|
-
}], ctorParameters: function () { return []; }, propDecorators: { layout: [{
|
|
124
|
+
args: [{ selector: 'bs-dock-pane-renderer', template: "<!-- <ng-content></ng-content> -->\n<ng-container [bsInstanceof]=\"layout$ | async\">\n <div *bsInstanceofCase=\"BsDocumentHostType; let documentHost\" data-hello>\n <bs-dock-pane-renderer [layout]=\"documentHost\"></bs-dock-pane-renderer>\n </div>\n <bs-tab-control *bsInstanceofCase=\"BsTabGroupType; let tabGroup\" class=\"d-flex flex-column h-100 dock-tabs\">\n <bs-tab-page *ngFor=\"let tab of tabGroup.panes\">\n <ng-container *bsTabPageHeader>\n <ng-template [cdkPortalOutlet]=\"tab.dockPanel.headerPortal\"></ng-template>\n </ng-container>\n <bs-dock-pane-renderer [layout]=\"tab\"></bs-dock-pane-renderer>\n </bs-tab-page>\n </bs-tab-control>\n <bs-splitter *bsInstanceofCase=\"BsSplitterType; let splitter\" [orientation]=\"splitter.orientation\">\n <bs-split-panel *ngFor=\"let panel of splitter.panes\">\n <bs-dock-pane-renderer [layout]=\"panel\"></bs-dock-pane-renderer>\n </bs-split-panel>\n </bs-splitter>\n <ng-container *bsInstanceofCase=\"BsContentPaneType; let content\">\n <ng-template [cdkPortalOutlet]=\"content.dockPanel.contentPortal\"></ng-template>\n </ng-container>\n <div *bsInstanceofDefault>\n No match\n </div>\n</ng-container>", styles: [".dock-tabs{background:#F3F3F3}:host ::ng-deep .tab-page-content{background:#FFF;min-height:100%}\n"] }]
|
|
125
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { layout: [{
|
|
120
126
|
type: Input
|
|
121
127
|
}] } });
|
|
122
128
|
|
|
123
129
|
class BsDockComponent {
|
|
124
|
-
constructor() {
|
|
130
|
+
constructor(overlay) {
|
|
131
|
+
this.overlay = overlay;
|
|
125
132
|
//#region Panels
|
|
126
133
|
this.panels$ = new BehaviorSubject([]);
|
|
127
134
|
//#endregion
|
|
135
|
+
this.floating$ = new BehaviorSubject([]);
|
|
136
|
+
this.positionAbsolute = true;
|
|
137
|
+
this.positionPx = 0;
|
|
128
138
|
this.destroyed$ = new Subject();
|
|
129
139
|
const tabs = new BsTabGroupPane();
|
|
130
140
|
const docHost = new BsDocumentHost();
|
|
@@ -137,6 +147,13 @@ class BsDockComponent {
|
|
|
137
147
|
// .pipe(takeUntil(this.destroyed$))
|
|
138
148
|
// .subscribe(([layout, panels]) => {
|
|
139
149
|
// })
|
|
150
|
+
this.floating$.pipe(takeUntil(this.destroyed$))
|
|
151
|
+
.subscribe((floating) => {
|
|
152
|
+
floating.forEach((panel) => {
|
|
153
|
+
const overlayRef = this.overlay.create({});
|
|
154
|
+
overlayRef.attach(panel.portal);
|
|
155
|
+
});
|
|
156
|
+
});
|
|
140
157
|
}
|
|
141
158
|
set panels(value) {
|
|
142
159
|
this.panels$.next(value.toArray());
|
|
@@ -147,27 +164,57 @@ class BsDockComponent {
|
|
|
147
164
|
set layout(value) {
|
|
148
165
|
this.layout$.next(value);
|
|
149
166
|
}
|
|
167
|
+
set floatingPanes(value) {
|
|
168
|
+
// value.changes.pipe(takeUntil(this.destroyed$)).subscribe((changes) => console.log('floatingPanes', changes));
|
|
169
|
+
this.floating$.next(value.toArray());
|
|
170
|
+
}
|
|
150
171
|
ngOnDestroy() {
|
|
151
172
|
this.destroyed$.next(true);
|
|
152
173
|
}
|
|
153
174
|
}
|
|
154
|
-
BsDockComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
155
|
-
BsDockComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsDockComponent, selector: "bs-dock", inputs: { layout: "layout" }, queries: [{ propertyName: "panels", predicate: BsDockPanelComponent }], ngImport: i0, template: "<ng-content></ng-content>\n<ng-container *ngIf=\"(layout$ | async) as layout\">\n <bs-dock-pane-renderer [layout]=\"layout.rootPane\"></bs-dock-pane-renderer>\n</ng-container>\n<!-- <bs-splitter>\n <ng-content></ng-content>\n <ng-container *ngFor=\"let panel of (panels$ | async)\">\n <bs-split-panel>\n <ng-template [cdkPortalOutlet]=\"panel.portal\"></ng-template>\n </bs-split-panel>\n </ng-container>\n</bs-splitter> -->\n", styles: [""], dependencies: [{ kind: "directive", type:
|
|
175
|
+
BsDockComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockComponent, deps: [{ token: i1.Overlay }], target: i0.ɵɵFactoryTarget.Component });
|
|
176
|
+
BsDockComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsDockComponent, selector: "bs-dock", inputs: { layout: "layout" }, host: { properties: { "class.position-absolute": "this.positionAbsolute", "style.top": "this.positionPx", "style.left": "this.positionPx", "style.bottom": "this.positionPx", "style.right": "this.positionPx" } }, queries: [{ propertyName: "panels", predicate: BsDockPanelComponent }], viewQueries: [{ propertyName: "floatingPanes", predicate: ["floating"], descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n<ng-container *ngIf=\"(layout$ | async) as layout\">\n <bs-dock-pane-renderer [layout]=\"layout.rootPane\"></bs-dock-pane-renderer>\n\n <ng-container *ngFor=\"let pane of layout.floatingPanes\">\n <bs-dock-pane-renderer #floating *ngIf=\"pane.pane\" [layout]=\"pane.pane\"></bs-dock-pane-renderer>\n </ng-container>\n</ng-container>\n<!-- <bs-splitter>\n <ng-content></ng-content>\n <ng-container *ngFor=\"let panel of (panels$ | async)\">\n <bs-split-panel>\n <ng-template [cdkPortalOutlet]=\"panel.portal\"></ng-template>\n </bs-split-panel>\n </ng-container>\n</bs-splitter> -->\n", styles: [":host ::ng-deep .tab-content{max-height:calc(100% - 41px);overflow:auto}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BsDockPaneRendererComponent, selector: "bs-dock-pane-renderer", inputs: ["layout"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
156
177
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockComponent, decorators: [{
|
|
157
178
|
type: Component,
|
|
158
|
-
args: [{ selector: 'bs-dock', template: "<ng-content></ng-content>\n<ng-container *ngIf=\"(layout$ | async) as layout\">\n <bs-dock-pane-renderer [layout]=\"layout.rootPane\"></bs-dock-pane-renderer>\n</ng-container>\n<!-- <bs-splitter>\n <ng-content></ng-content>\n <ng-container *ngFor=\"let panel of (panels$ | async)\">\n <bs-split-panel>\n <ng-template [cdkPortalOutlet]=\"panel.portal\"></ng-template>\n </bs-split-panel>\n </ng-container>\n</bs-splitter> -->\n" }]
|
|
159
|
-
}], ctorParameters: function () { return []; }, propDecorators: { panels: [{
|
|
179
|
+
args: [{ selector: 'bs-dock', template: "<ng-content></ng-content>\n<ng-container *ngIf=\"(layout$ | async) as layout\">\n <bs-dock-pane-renderer [layout]=\"layout.rootPane\"></bs-dock-pane-renderer>\n\n <ng-container *ngFor=\"let pane of layout.floatingPanes\">\n <bs-dock-pane-renderer #floating *ngIf=\"pane.pane\" [layout]=\"pane.pane\"></bs-dock-pane-renderer>\n </ng-container>\n</ng-container>\n<!-- <bs-splitter>\n <ng-content></ng-content>\n <ng-container *ngFor=\"let panel of (panels$ | async)\">\n <bs-split-panel>\n <ng-template [cdkPortalOutlet]=\"panel.portal\"></ng-template>\n </bs-split-panel>\n </ng-container>\n</bs-splitter> -->\n", styles: [":host ::ng-deep .tab-content{max-height:calc(100% - 41px);overflow:auto}\n"] }]
|
|
180
|
+
}], ctorParameters: function () { return [{ type: i1.Overlay }]; }, propDecorators: { panels: [{
|
|
160
181
|
type: ContentChildren,
|
|
161
182
|
args: [BsDockPanelComponent]
|
|
162
183
|
}], layout: [{
|
|
163
184
|
type: Input
|
|
185
|
+
}], floatingPanes: [{
|
|
186
|
+
type: ViewChildren,
|
|
187
|
+
args: ['floating']
|
|
188
|
+
}], positionAbsolute: [{
|
|
189
|
+
type: HostBinding,
|
|
190
|
+
args: ['class.position-absolute']
|
|
191
|
+
}], positionPx: [{
|
|
192
|
+
type: HostBinding,
|
|
193
|
+
args: ['style.top']
|
|
194
|
+
}, {
|
|
195
|
+
type: HostBinding,
|
|
196
|
+
args: ['style.left']
|
|
197
|
+
}, {
|
|
198
|
+
type: HostBinding,
|
|
199
|
+
args: ['style.bottom']
|
|
200
|
+
}, {
|
|
201
|
+
type: HostBinding,
|
|
202
|
+
args: ['style.right']
|
|
164
203
|
}] } });
|
|
165
204
|
|
|
205
|
+
class BsFloatingPane {
|
|
206
|
+
constructor(data) {
|
|
207
|
+
Object.assign(this, data);
|
|
208
|
+
}
|
|
209
|
+
}
|
|
210
|
+
|
|
166
211
|
class BsDockPanelHeaderComponent {
|
|
167
|
-
constructor(overlay, dockPanel) {
|
|
212
|
+
constructor(overlay, dockPanel, dock) {
|
|
168
213
|
this.overlay = overlay;
|
|
169
214
|
this.dockPanel = dockPanel;
|
|
215
|
+
this.dock = dock;
|
|
170
216
|
this.isDragging = false;
|
|
217
|
+
this.isLayoutDetached = false;
|
|
171
218
|
this.dBlock = true;
|
|
172
219
|
this.overlayRef = this.overlay.create({
|
|
173
220
|
positionStrategy: this.overlay.position().global()
|
|
@@ -178,21 +225,33 @@ class BsDockPanelHeaderComponent {
|
|
|
178
225
|
this.isDragging = true;
|
|
179
226
|
}
|
|
180
227
|
onMouseMove(ev) {
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
228
|
+
if (this.isDragging) {
|
|
229
|
+
if (!this.isLayoutDetached) {
|
|
230
|
+
this.isLayoutDetached = true;
|
|
231
|
+
this.dock.layout$.subscribe((layout) => {
|
|
232
|
+
layout.floatingPanes.push(new BsFloatingPane({
|
|
233
|
+
pane: new BsTabGroupPane({
|
|
234
|
+
panes: [
|
|
235
|
+
new BsContentPane({
|
|
236
|
+
dockPanel: this.dockPanel
|
|
237
|
+
})
|
|
238
|
+
]
|
|
239
|
+
})
|
|
240
|
+
}));
|
|
241
|
+
});
|
|
242
|
+
}
|
|
184
243
|
}
|
|
185
244
|
}
|
|
186
245
|
onMouseUp(ev) {
|
|
187
246
|
this.isDragging = false;
|
|
188
247
|
}
|
|
189
248
|
}
|
|
190
|
-
BsDockPanelHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockPanelHeaderComponent, deps: [{ token: i1
|
|
191
|
-
BsDockPanelHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsDockPanelHeaderComponent, selector: "bs-dock-panel-header", host: { listeners: { "mousedown": "onMouseDown($event)", "document:mousemove": "onMouseMove($event)", "document:mouseup": "onMouseUp($event)" }, properties: { "class.d-block": "this.dBlock" } }, ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{
|
|
249
|
+
BsDockPanelHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockPanelHeaderComponent, deps: [{ token: i1.Overlay }, { token: BsDockPanelComponent }, { token: BsDockComponent }], target: i0.ɵɵFactoryTarget.Component });
|
|
250
|
+
BsDockPanelHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.3", type: BsDockPanelHeaderComponent, selector: "bs-dock-panel-header", host: { listeners: { "mousedown": "onMouseDown($event)", "document:mousemove": "onMouseMove($event)", "document:mouseup": "onMouseUp($event)" }, properties: { "class.d-block": "this.dBlock" } }, ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);margin:calc(-1 * var(--bs-nav-link-padding-y)) calc(-1 * var(--bs-nav-link-padding-x))}\n"] });
|
|
192
251
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImport: i0, type: BsDockPanelHeaderComponent, decorators: [{
|
|
193
252
|
type: Component,
|
|
194
|
-
args: [{ selector: 'bs-dock-panel-header', template: "<ng-content></ng-content>", styles: [":host{
|
|
195
|
-
}], ctorParameters: function () { return [{ type: i1
|
|
253
|
+
args: [{ selector: 'bs-dock-panel-header', template: "<ng-content></ng-content>", styles: [":host{padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);margin:calc(-1 * var(--bs-nav-link-padding-y)) calc(-1 * var(--bs-nav-link-padding-x))}\n"] }]
|
|
254
|
+
}], ctorParameters: function () { return [{ type: i1.Overlay }, { type: BsDockPanelComponent }, { type: BsDockComponent }]; }, propDecorators: { onMouseDown: [{
|
|
196
255
|
type: HostListener,
|
|
197
256
|
args: ['mousedown', ['$event']]
|
|
198
257
|
}], onMouseMove: [{
|
|
@@ -253,9 +312,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.3", ngImpor
|
|
|
253
312
|
}]
|
|
254
313
|
}] });
|
|
255
314
|
|
|
256
|
-
class BsFloatingPane {
|
|
257
|
-
}
|
|
258
|
-
|
|
259
315
|
/**
|
|
260
316
|
* Generated bundle index. Do not edit.
|
|
261
317
|
*/
|