dockview-angular 4.13.0 → 5.0.0
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/README.md +49 -17
- package/dist/README.md +88 -0
- package/dist/dockview-angular.d.ts.map +1 -0
- package/dist/dockview.css +63 -7
- package/dist/esm2022/dockview-angular.mjs +5 -0
- package/dist/esm2022/lib/dockview/dockview-angular.component.mjs +185 -0
- package/dist/esm2022/lib/dockview/types.mjs +3 -0
- package/dist/esm2022/lib/dockview-angular.module.mjs +38 -0
- package/dist/esm2022/lib/gridview/angular-gridview-panel.mjs +24 -0
- package/dist/esm2022/lib/gridview/gridview-angular.component.mjs +98 -0
- package/dist/esm2022/lib/gridview/types.mjs +3 -0
- package/dist/esm2022/lib/paneview/angular-pane-part.mjs +26 -0
- package/dist/esm2022/lib/paneview/paneview-angular.component.mjs +122 -0
- package/dist/esm2022/lib/paneview/types.mjs +3 -0
- package/dist/esm2022/lib/splitview/angular-splitview-panel.mjs +24 -0
- package/dist/esm2022/lib/splitview/splitview-angular.component.mjs +98 -0
- package/dist/esm2022/lib/splitview/types.mjs +3 -0
- package/dist/esm2022/lib/utils/angular-renderer.mjs +83 -0
- package/dist/esm2022/lib/utils/component-factory.mjs +100 -0
- package/dist/esm2022/lib/utils/lifecycle-utils.mjs +69 -0
- package/dist/esm2022/public-api.mjs +17 -0
- package/dist/fesm2022/dockview-angular.mjs +846 -0
- package/dist/fesm2022/dockview-angular.mjs.map +1 -0
- package/dist/index.d.ts +6 -0
- package/dist/{cjs/lib → lib}/dockview/dockview-angular.component.d.ts +4 -0
- package/dist/lib/dockview/dockview-angular.component.d.ts.map +1 -0
- package/dist/{cjs/lib → lib}/dockview/types.d.ts +2 -1
- package/dist/lib/dockview/types.d.ts.map +1 -0
- package/dist/lib/dockview-angular.module.d.ts +12 -0
- package/dist/lib/dockview-angular.module.d.ts.map +1 -0
- package/dist/{cjs/lib → lib}/gridview/angular-gridview-panel.d.ts +1 -0
- package/dist/lib/gridview/angular-gridview-panel.d.ts.map +1 -0
- package/dist/{esm/lib → lib}/gridview/gridview-angular.component.d.ts +4 -0
- package/dist/lib/gridview/gridview-angular.component.d.ts.map +1 -0
- package/dist/{esm/lib → lib}/gridview/types.d.ts +1 -0
- package/dist/lib/gridview/types.d.ts.map +1 -0
- package/dist/{esm/lib → lib}/paneview/angular-pane-part.d.ts +1 -0
- package/dist/lib/paneview/angular-pane-part.d.ts.map +1 -0
- package/dist/{esm/lib → lib}/paneview/paneview-angular.component.d.ts +4 -0
- package/dist/lib/paneview/paneview-angular.component.d.ts.map +1 -0
- package/dist/{esm/lib → lib}/paneview/types.d.ts +1 -0
- package/dist/lib/paneview/types.d.ts.map +1 -0
- package/dist/{cjs/lib → lib}/splitview/angular-splitview-panel.d.ts +1 -0
- package/dist/lib/splitview/angular-splitview-panel.d.ts.map +1 -0
- package/dist/{cjs/lib → lib}/splitview/splitview-angular.component.d.ts +4 -0
- package/dist/lib/splitview/splitview-angular.component.d.ts.map +1 -0
- package/dist/{cjs/lib → lib}/splitview/types.d.ts +1 -0
- package/dist/lib/splitview/types.d.ts.map +1 -0
- package/dist/lib/utils/angular-renderer.d.ts +21 -0
- package/dist/lib/utils/angular-renderer.d.ts.map +1 -0
- package/dist/{cjs/lib → lib}/utils/component-factory.d.ts +1 -0
- package/dist/lib/utils/component-factory.d.ts.map +1 -0
- package/dist/{cjs/lib → lib}/utils/lifecycle-utils.d.ts +1 -0
- package/dist/lib/utils/lifecycle-utils.d.ts.map +1 -0
- package/dist/{cjs/public-api.d.ts → public-api.d.ts} +5 -4
- package/dist/public-api.d.ts.map +1 -0
- package/package.json +72 -66
- package/dist/cjs/index.d.ts +0 -1
- package/dist/cjs/index.js +0 -17
- package/dist/cjs/lib/dockview/dockview-angular.component.js +0 -256
- package/dist/cjs/lib/dockview/types.js +0 -8
- package/dist/cjs/lib/dockview-angular.module.d.ts +0 -2
- package/dist/cjs/lib/dockview-angular.module.js +0 -35
- package/dist/cjs/lib/gridview/angular-gridview-panel.js +0 -21
- package/dist/cjs/lib/gridview/gridview-angular.component.d.ts +0 -28
- package/dist/cjs/lib/gridview/gridview-angular.component.js +0 -140
- package/dist/cjs/lib/gridview/types.d.ts +0 -12
- package/dist/cjs/lib/gridview/types.js +0 -6
- package/dist/cjs/lib/paneview/angular-pane-part.d.ts +0 -13
- package/dist/cjs/lib/paneview/angular-pane-part.js +0 -29
- package/dist/cjs/lib/paneview/paneview-angular.component.d.ts +0 -31
- package/dist/cjs/lib/paneview/paneview-angular.component.js +0 -166
- package/dist/cjs/lib/paneview/types.d.ts +0 -14
- package/dist/cjs/lib/paneview/types.js +0 -6
- package/dist/cjs/lib/splitview/angular-splitview-panel.js +0 -21
- package/dist/cjs/lib/splitview/splitview-angular.component.js +0 -140
- package/dist/cjs/lib/splitview/types.js +0 -6
- package/dist/cjs/lib/utils/angular-renderer.d.ts +0 -18
- package/dist/cjs/lib/utils/angular-renderer.js +0 -70
- package/dist/cjs/lib/utils/component-factory.js +0 -103
- package/dist/cjs/lib/utils/lifecycle-utils.js +0 -74
- package/dist/cjs/public-api.js +0 -32
- package/dist/dockview-angular.amd.js +0 -13201
- package/dist/dockview-angular.amd.js.map +0 -1
- package/dist/dockview-angular.amd.min.js +0 -8
- package/dist/dockview-angular.amd.min.js.map +0 -1
- package/dist/dockview-angular.amd.min.noStyle.js +0 -8
- package/dist/dockview-angular.amd.min.noStyle.js.map +0 -1
- package/dist/dockview-angular.amd.noStyle.js +0 -13171
- package/dist/dockview-angular.amd.noStyle.js.map +0 -1
- package/dist/dockview-angular.cjs.js +0 -13203
- package/dist/dockview-angular.cjs.js.map +0 -1
- package/dist/dockview-angular.esm.js +0 -13131
- package/dist/dockview-angular.esm.js.map +0 -1
- package/dist/dockview-angular.esm.min.js +0 -8
- package/dist/dockview-angular.esm.min.js.map +0 -1
- package/dist/dockview-angular.js +0 -13205
- package/dist/dockview-angular.js.map +0 -1
- package/dist/dockview-angular.min.js +0 -8
- package/dist/dockview-angular.min.js.map +0 -1
- package/dist/dockview-angular.min.noStyle.js +0 -8
- package/dist/dockview-angular.min.noStyle.js.map +0 -1
- package/dist/dockview-angular.noStyle.js +0 -13175
- package/dist/dockview-angular.noStyle.js.map +0 -1
- package/dist/esm/index.d.ts +0 -1
- package/dist/esm/index.js +0 -1
- package/dist/esm/lib/dockview/dockview-angular.component.d.ts +0 -49
- package/dist/esm/lib/dockview/dockview-angular.component.js +0 -253
- package/dist/esm/lib/dockview/types.d.ts +0 -27
- package/dist/esm/lib/dockview/types.js +0 -2
- package/dist/esm/lib/dockview-angular.module.d.ts +0 -2
- package/dist/esm/lib/dockview-angular.module.js +0 -32
- package/dist/esm/lib/gridview/angular-gridview-panel.d.ts +0 -9
- package/dist/esm/lib/gridview/angular-gridview-panel.js +0 -17
- package/dist/esm/lib/gridview/gridview-angular.component.js +0 -137
- package/dist/esm/lib/gridview/types.js +0 -2
- package/dist/esm/lib/paneview/angular-pane-part.js +0 -25
- package/dist/esm/lib/paneview/paneview-angular.component.js +0 -163
- package/dist/esm/lib/paneview/types.js +0 -2
- package/dist/esm/lib/splitview/angular-splitview-panel.d.ts +0 -9
- package/dist/esm/lib/splitview/angular-splitview-panel.js +0 -17
- package/dist/esm/lib/splitview/splitview-angular.component.d.ts +0 -28
- package/dist/esm/lib/splitview/splitview-angular.component.js +0 -137
- package/dist/esm/lib/splitview/types.d.ts +0 -12
- package/dist/esm/lib/splitview/types.js +0 -2
- package/dist/esm/lib/utils/angular-renderer.d.ts +0 -18
- package/dist/esm/lib/utils/angular-renderer.js +0 -66
- package/dist/esm/lib/utils/component-factory.d.ts +0 -20
- package/dist/esm/lib/utils/component-factory.js +0 -99
- package/dist/esm/lib/utils/lifecycle-utils.d.ts +0 -18
- package/dist/esm/lib/utils/lifecycle-utils.js +0 -68
- package/dist/esm/public-api.d.ts +0 -13
- package/dist/esm/public-api.js +0 -16
|
@@ -1,166 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
3
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
4
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
5
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
6
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
7
|
-
};
|
|
8
|
-
var __metadata = (this && this.__metadata) || function (k, v) {
|
|
9
|
-
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
|
10
|
-
};
|
|
11
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
-
exports.PaneviewAngularComponent = void 0;
|
|
13
|
-
const core_1 = require("@angular/core");
|
|
14
|
-
const dockview_core_1 = require("dockview-core");
|
|
15
|
-
const component_factory_1 = require("../utils/component-factory");
|
|
16
|
-
const lifecycle_utils_1 = require("../utils/lifecycle-utils");
|
|
17
|
-
const angular_pane_part_1 = require("./angular-pane-part");
|
|
18
|
-
let PaneviewAngularComponent = class PaneviewAngularComponent {
|
|
19
|
-
constructor() {
|
|
20
|
-
this.ready = new core_1.EventEmitter();
|
|
21
|
-
this.drop = new core_1.EventEmitter();
|
|
22
|
-
this.lifecycleManager = new lifecycle_utils_1.AngularLifecycleManager();
|
|
23
|
-
this.injector = (0, core_1.inject)(core_1.Injector);
|
|
24
|
-
this.environmentInjector = (0, core_1.inject)(core_1.EnvironmentInjector);
|
|
25
|
-
}
|
|
26
|
-
ngOnInit() {
|
|
27
|
-
this.initializePaneview();
|
|
28
|
-
}
|
|
29
|
-
ngOnDestroy() {
|
|
30
|
-
this.lifecycleManager.destroy();
|
|
31
|
-
if (this.paneviewApi) {
|
|
32
|
-
this.paneviewApi.dispose();
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
ngOnChanges(changes) {
|
|
36
|
-
if (this.paneviewApi) {
|
|
37
|
-
const coreChanges = {};
|
|
38
|
-
let hasChanges = false;
|
|
39
|
-
// Check for changes in core paneview properties
|
|
40
|
-
dockview_core_1.PROPERTY_KEYS_PANEVIEW.forEach(key => {
|
|
41
|
-
if (changes[key] && !changes[key].isFirstChange()) {
|
|
42
|
-
coreChanges[key] = changes[key].currentValue;
|
|
43
|
-
hasChanges = true;
|
|
44
|
-
}
|
|
45
|
-
});
|
|
46
|
-
if (hasChanges) {
|
|
47
|
-
this.paneviewApi.updateOptions(coreChanges);
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
getPaneviewApi() {
|
|
52
|
-
return this.paneviewApi;
|
|
53
|
-
}
|
|
54
|
-
initializePaneview() {
|
|
55
|
-
if (!this.components) {
|
|
56
|
-
throw new Error('PaneviewAngularComponent: components input is required');
|
|
57
|
-
}
|
|
58
|
-
const coreOptions = this.extractCoreOptions();
|
|
59
|
-
const frameworkOptions = this.createFrameworkOptions();
|
|
60
|
-
this.paneviewApi = (0, dockview_core_1.createPaneview)(this.containerRef.nativeElement, {
|
|
61
|
-
...coreOptions,
|
|
62
|
-
...frameworkOptions
|
|
63
|
-
});
|
|
64
|
-
// Set up event listeners
|
|
65
|
-
this.setupEventListeners();
|
|
66
|
-
// Emit ready event
|
|
67
|
-
this.ready.emit({ api: this.paneviewApi });
|
|
68
|
-
}
|
|
69
|
-
extractCoreOptions() {
|
|
70
|
-
const coreOptions = {};
|
|
71
|
-
dockview_core_1.PROPERTY_KEYS_PANEVIEW.forEach(key => {
|
|
72
|
-
const value = this[key];
|
|
73
|
-
if (value !== undefined) {
|
|
74
|
-
coreOptions[key] = value;
|
|
75
|
-
}
|
|
76
|
-
});
|
|
77
|
-
return coreOptions;
|
|
78
|
-
}
|
|
79
|
-
createFrameworkOptions() {
|
|
80
|
-
const componentFactory = new component_factory_1.AngularFrameworkComponentFactory(this.components, this.injector, this.environmentInjector, this.headerComponents);
|
|
81
|
-
return {
|
|
82
|
-
createComponent: (options) => {
|
|
83
|
-
return componentFactory.createPaneviewComponent(options);
|
|
84
|
-
},
|
|
85
|
-
createHeaderComponent: this.headerComponents
|
|
86
|
-
? (options) => {
|
|
87
|
-
return new angular_pane_part_1.AngularPanePart(this.headerComponents[options.name], this.injector, this.environmentInjector);
|
|
88
|
-
}
|
|
89
|
-
: undefined
|
|
90
|
-
};
|
|
91
|
-
}
|
|
92
|
-
setupEventListeners() {
|
|
93
|
-
if (!this.paneviewApi) {
|
|
94
|
-
return;
|
|
95
|
-
}
|
|
96
|
-
// Set up event subscriptions using lifecycle manager
|
|
97
|
-
const api = this.paneviewApi;
|
|
98
|
-
if (this.drop.observers.length > 0) {
|
|
99
|
-
const disposable = api.onDidDrop(event => {
|
|
100
|
-
this.drop.emit(event);
|
|
101
|
-
});
|
|
102
|
-
this.lifecycleManager.addDisposable(disposable);
|
|
103
|
-
}
|
|
104
|
-
}
|
|
105
|
-
};
|
|
106
|
-
exports.PaneviewAngularComponent = PaneviewAngularComponent;
|
|
107
|
-
__decorate([
|
|
108
|
-
(0, core_1.ViewChild)('paneviewContainer', { static: true }),
|
|
109
|
-
__metadata("design:type", core_1.ElementRef)
|
|
110
|
-
], PaneviewAngularComponent.prototype, "containerRef", void 0);
|
|
111
|
-
__decorate([
|
|
112
|
-
(0, core_1.Input)(),
|
|
113
|
-
__metadata("design:type", Object)
|
|
114
|
-
], PaneviewAngularComponent.prototype, "components", void 0);
|
|
115
|
-
__decorate([
|
|
116
|
-
(0, core_1.Input)(),
|
|
117
|
-
__metadata("design:type", Object)
|
|
118
|
-
], PaneviewAngularComponent.prototype, "headerComponents", void 0);
|
|
119
|
-
__decorate([
|
|
120
|
-
(0, core_1.Input)(),
|
|
121
|
-
__metadata("design:type", String)
|
|
122
|
-
], PaneviewAngularComponent.prototype, "className", void 0);
|
|
123
|
-
__decorate([
|
|
124
|
-
(0, core_1.Input)(),
|
|
125
|
-
__metadata("design:type", String)
|
|
126
|
-
], PaneviewAngularComponent.prototype, "orientation", void 0);
|
|
127
|
-
__decorate([
|
|
128
|
-
(0, core_1.Input)(),
|
|
129
|
-
__metadata("design:type", Boolean)
|
|
130
|
-
], PaneviewAngularComponent.prototype, "hideBorders", void 0);
|
|
131
|
-
__decorate([
|
|
132
|
-
(0, core_1.Input)(),
|
|
133
|
-
__metadata("design:type", Boolean)
|
|
134
|
-
], PaneviewAngularComponent.prototype, "debug", void 0);
|
|
135
|
-
__decorate([
|
|
136
|
-
(0, core_1.Input)(),
|
|
137
|
-
__metadata("design:type", Boolean)
|
|
138
|
-
], PaneviewAngularComponent.prototype, "disableAutoResizing", void 0);
|
|
139
|
-
__decorate([
|
|
140
|
-
(0, core_1.Output)(),
|
|
141
|
-
__metadata("design:type", Object)
|
|
142
|
-
], PaneviewAngularComponent.prototype, "ready", void 0);
|
|
143
|
-
__decorate([
|
|
144
|
-
(0, core_1.Output)(),
|
|
145
|
-
__metadata("design:type", Object)
|
|
146
|
-
], PaneviewAngularComponent.prototype, "drop", void 0);
|
|
147
|
-
exports.PaneviewAngularComponent = PaneviewAngularComponent = __decorate([
|
|
148
|
-
(0, core_1.Component)({
|
|
149
|
-
selector: 'dv-paneview',
|
|
150
|
-
standalone: true,
|
|
151
|
-
template: '<div #paneviewContainer class="paneview-container"></div>',
|
|
152
|
-
styles: [`
|
|
153
|
-
:host {
|
|
154
|
-
display: block;
|
|
155
|
-
width: 100%;
|
|
156
|
-
height: 100%;
|
|
157
|
-
}
|
|
158
|
-
|
|
159
|
-
.paneview-container {
|
|
160
|
-
width: 100%;
|
|
161
|
-
height: 100%;
|
|
162
|
-
}
|
|
163
|
-
`],
|
|
164
|
-
changeDetection: core_1.ChangeDetectionStrategy.OnPush
|
|
165
|
-
})
|
|
166
|
-
], PaneviewAngularComponent);
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { Type } from '@angular/core';
|
|
2
|
-
import { PaneviewOptions, PaneviewApi, PaneviewDropEvent } from 'dockview-core';
|
|
3
|
-
export interface PaneviewAngularReadyEvent {
|
|
4
|
-
api: PaneviewApi;
|
|
5
|
-
}
|
|
6
|
-
export interface PaneviewAngularOptions extends PaneviewOptions {
|
|
7
|
-
components: Record<string, Type<any>>;
|
|
8
|
-
headerComponents?: Record<string, Type<any>>;
|
|
9
|
-
}
|
|
10
|
-
export interface PaneviewAngularEvents {
|
|
11
|
-
ready: PaneviewAngularReadyEvent;
|
|
12
|
-
drop: PaneviewDropEvent;
|
|
13
|
-
}
|
|
14
|
-
export { PaneviewApi, PaneviewDropEvent, PaneviewOptions } from 'dockview-core';
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.PaneviewApi = void 0;
|
|
4
|
-
// Re-export commonly used types from dockview-core
|
|
5
|
-
var dockview_core_1 = require("dockview-core");
|
|
6
|
-
Object.defineProperty(exports, "PaneviewApi", { enumerable: true, get: function () { return dockview_core_1.PaneviewApi; } });
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.AngularSplitviewPanel = void 0;
|
|
4
|
-
const dockview_core_1 = require("dockview-core");
|
|
5
|
-
const angular_renderer_1 = require("../utils/angular-renderer");
|
|
6
|
-
class AngularSplitviewPanel extends dockview_core_1.SplitviewPanel {
|
|
7
|
-
constructor(id, component, angularComponent, injector, environmentInjector) {
|
|
8
|
-
super(id, component);
|
|
9
|
-
this.angularComponent = angularComponent;
|
|
10
|
-
this.injector = injector;
|
|
11
|
-
this.environmentInjector = environmentInjector;
|
|
12
|
-
}
|
|
13
|
-
getComponent() {
|
|
14
|
-
return new angular_renderer_1.AngularRenderer({
|
|
15
|
-
component: this.angularComponent,
|
|
16
|
-
injector: this.injector,
|
|
17
|
-
environmentInjector: this.environmentInjector
|
|
18
|
-
});
|
|
19
|
-
}
|
|
20
|
-
}
|
|
21
|
-
exports.AngularSplitviewPanel = AngularSplitviewPanel;
|
|
@@ -1,140 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
3
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
4
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
5
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
6
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
7
|
-
};
|
|
8
|
-
var __metadata = (this && this.__metadata) || function (k, v) {
|
|
9
|
-
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
|
10
|
-
};
|
|
11
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
-
exports.SplitviewAngularComponent = void 0;
|
|
13
|
-
const core_1 = require("@angular/core");
|
|
14
|
-
const dockview_core_1 = require("dockview-core");
|
|
15
|
-
const component_factory_1 = require("../utils/component-factory");
|
|
16
|
-
const lifecycle_utils_1 = require("../utils/lifecycle-utils");
|
|
17
|
-
let SplitviewAngularComponent = class SplitviewAngularComponent {
|
|
18
|
-
constructor() {
|
|
19
|
-
this.ready = new core_1.EventEmitter();
|
|
20
|
-
this.lifecycleManager = new lifecycle_utils_1.AngularLifecycleManager();
|
|
21
|
-
this.injector = (0, core_1.inject)(core_1.Injector);
|
|
22
|
-
this.environmentInjector = (0, core_1.inject)(core_1.EnvironmentInjector);
|
|
23
|
-
}
|
|
24
|
-
ngOnInit() {
|
|
25
|
-
this.initializeSplitview();
|
|
26
|
-
}
|
|
27
|
-
ngOnDestroy() {
|
|
28
|
-
this.lifecycleManager.destroy();
|
|
29
|
-
if (this.splitviewApi) {
|
|
30
|
-
this.splitviewApi.dispose();
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
ngOnChanges(changes) {
|
|
34
|
-
if (this.splitviewApi) {
|
|
35
|
-
const coreChanges = {};
|
|
36
|
-
let hasChanges = false;
|
|
37
|
-
// Check for changes in core splitview properties
|
|
38
|
-
dockview_core_1.PROPERTY_KEYS_SPLITVIEW.forEach(key => {
|
|
39
|
-
if (changes[key] && !changes[key].isFirstChange()) {
|
|
40
|
-
coreChanges[key] = changes[key].currentValue;
|
|
41
|
-
hasChanges = true;
|
|
42
|
-
}
|
|
43
|
-
});
|
|
44
|
-
if (hasChanges) {
|
|
45
|
-
this.splitviewApi.updateOptions(coreChanges);
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
getSplitviewApi() {
|
|
50
|
-
return this.splitviewApi;
|
|
51
|
-
}
|
|
52
|
-
initializeSplitview() {
|
|
53
|
-
if (!this.components) {
|
|
54
|
-
throw new Error('SplitviewAngularComponent: components input is required');
|
|
55
|
-
}
|
|
56
|
-
const coreOptions = this.extractCoreOptions();
|
|
57
|
-
const frameworkOptions = this.createFrameworkOptions();
|
|
58
|
-
this.splitviewApi = (0, dockview_core_1.createSplitview)(this.containerRef.nativeElement, {
|
|
59
|
-
...coreOptions,
|
|
60
|
-
...frameworkOptions
|
|
61
|
-
});
|
|
62
|
-
// Emit ready event
|
|
63
|
-
this.ready.emit({ api: this.splitviewApi });
|
|
64
|
-
}
|
|
65
|
-
extractCoreOptions() {
|
|
66
|
-
const coreOptions = {};
|
|
67
|
-
dockview_core_1.PROPERTY_KEYS_SPLITVIEW.forEach(key => {
|
|
68
|
-
const value = this[key];
|
|
69
|
-
if (value !== undefined) {
|
|
70
|
-
coreOptions[key] = value;
|
|
71
|
-
}
|
|
72
|
-
});
|
|
73
|
-
return coreOptions;
|
|
74
|
-
}
|
|
75
|
-
createFrameworkOptions() {
|
|
76
|
-
const componentFactory = new component_factory_1.AngularFrameworkComponentFactory(this.components, this.injector, this.environmentInjector);
|
|
77
|
-
return {
|
|
78
|
-
createComponent: (options) => {
|
|
79
|
-
return componentFactory.createSplitviewComponent(options);
|
|
80
|
-
}
|
|
81
|
-
};
|
|
82
|
-
}
|
|
83
|
-
};
|
|
84
|
-
exports.SplitviewAngularComponent = SplitviewAngularComponent;
|
|
85
|
-
__decorate([
|
|
86
|
-
(0, core_1.ViewChild)('splitviewContainer', { static: true }),
|
|
87
|
-
__metadata("design:type", core_1.ElementRef)
|
|
88
|
-
], SplitviewAngularComponent.prototype, "containerRef", void 0);
|
|
89
|
-
__decorate([
|
|
90
|
-
(0, core_1.Input)(),
|
|
91
|
-
__metadata("design:type", Object)
|
|
92
|
-
], SplitviewAngularComponent.prototype, "components", void 0);
|
|
93
|
-
__decorate([
|
|
94
|
-
(0, core_1.Input)(),
|
|
95
|
-
__metadata("design:type", String)
|
|
96
|
-
], SplitviewAngularComponent.prototype, "className", void 0);
|
|
97
|
-
__decorate([
|
|
98
|
-
(0, core_1.Input)(),
|
|
99
|
-
__metadata("design:type", String)
|
|
100
|
-
], SplitviewAngularComponent.prototype, "orientation", void 0);
|
|
101
|
-
__decorate([
|
|
102
|
-
(0, core_1.Input)(),
|
|
103
|
-
__metadata("design:type", Boolean)
|
|
104
|
-
], SplitviewAngularComponent.prototype, "proportionalLayout", void 0);
|
|
105
|
-
__decorate([
|
|
106
|
-
(0, core_1.Input)(),
|
|
107
|
-
__metadata("design:type", Boolean)
|
|
108
|
-
], SplitviewAngularComponent.prototype, "hideBorders", void 0);
|
|
109
|
-
__decorate([
|
|
110
|
-
(0, core_1.Input)(),
|
|
111
|
-
__metadata("design:type", Boolean)
|
|
112
|
-
], SplitviewAngularComponent.prototype, "debug", void 0);
|
|
113
|
-
__decorate([
|
|
114
|
-
(0, core_1.Input)(),
|
|
115
|
-
__metadata("design:type", Boolean)
|
|
116
|
-
], SplitviewAngularComponent.prototype, "disableAutoResizing", void 0);
|
|
117
|
-
__decorate([
|
|
118
|
-
(0, core_1.Output)(),
|
|
119
|
-
__metadata("design:type", Object)
|
|
120
|
-
], SplitviewAngularComponent.prototype, "ready", void 0);
|
|
121
|
-
exports.SplitviewAngularComponent = SplitviewAngularComponent = __decorate([
|
|
122
|
-
(0, core_1.Component)({
|
|
123
|
-
selector: 'dv-splitview',
|
|
124
|
-
standalone: true,
|
|
125
|
-
template: '<div #splitviewContainer class="splitview-container"></div>',
|
|
126
|
-
styles: [`
|
|
127
|
-
:host {
|
|
128
|
-
display: block;
|
|
129
|
-
width: 100%;
|
|
130
|
-
height: 100%;
|
|
131
|
-
}
|
|
132
|
-
|
|
133
|
-
.splitview-container {
|
|
134
|
-
width: 100%;
|
|
135
|
-
height: 100%;
|
|
136
|
-
}
|
|
137
|
-
`],
|
|
138
|
-
changeDetection: core_1.ChangeDetectionStrategy.OnPush
|
|
139
|
-
})
|
|
140
|
-
], SplitviewAngularComponent);
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.SplitviewApi = void 0;
|
|
4
|
-
// Re-export commonly used types from dockview-core
|
|
5
|
-
var dockview_core_1 = require("dockview-core");
|
|
6
|
-
Object.defineProperty(exports, "SplitviewApi", { enumerable: true, get: function () { return dockview_core_1.SplitviewApi; } });
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { Injector, Type, EnvironmentInjector } from '@angular/core';
|
|
2
|
-
import { IContentRenderer, IFrameworkPart, Parameters } from 'dockview-core';
|
|
3
|
-
export interface AngularRendererOptions {
|
|
4
|
-
component: Type<any>;
|
|
5
|
-
injector: Injector;
|
|
6
|
-
environmentInjector?: EnvironmentInjector;
|
|
7
|
-
}
|
|
8
|
-
export declare class AngularRenderer implements IContentRenderer, IFrameworkPart {
|
|
9
|
-
private options;
|
|
10
|
-
private componentRef;
|
|
11
|
-
private _element;
|
|
12
|
-
constructor(options: AngularRendererOptions);
|
|
13
|
-
get element(): HTMLElement;
|
|
14
|
-
init(parameters: Parameters): void;
|
|
15
|
-
update(params: Parameters): void;
|
|
16
|
-
private render;
|
|
17
|
-
dispose(): void;
|
|
18
|
-
}
|
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.AngularRenderer = void 0;
|
|
4
|
-
const core_1 = require("@angular/core");
|
|
5
|
-
class AngularRenderer {
|
|
6
|
-
constructor(options) {
|
|
7
|
-
this.options = options;
|
|
8
|
-
this.componentRef = null;
|
|
9
|
-
this._element = null;
|
|
10
|
-
}
|
|
11
|
-
get element() {
|
|
12
|
-
if (!this._element) {
|
|
13
|
-
throw new Error('Angular renderer not initialized');
|
|
14
|
-
}
|
|
15
|
-
return this._element;
|
|
16
|
-
}
|
|
17
|
-
init(parameters) {
|
|
18
|
-
// If already initialized, just update the parameters
|
|
19
|
-
if (this.componentRef) {
|
|
20
|
-
this.update(parameters);
|
|
21
|
-
}
|
|
22
|
-
else {
|
|
23
|
-
this.render(parameters);
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
update(params) {
|
|
27
|
-
if (this.componentRef) {
|
|
28
|
-
Object.keys(params).forEach(key => {
|
|
29
|
-
// Use 'in' operator instead of hasOwnProperty to support getter/setter properties
|
|
30
|
-
if (key in this.componentRef.instance) {
|
|
31
|
-
this.componentRef.instance[key] = params[key];
|
|
32
|
-
}
|
|
33
|
-
});
|
|
34
|
-
this.componentRef.changeDetectorRef.detectChanges();
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
render(parameters) {
|
|
38
|
-
try {
|
|
39
|
-
// Create the component using modern Angular API
|
|
40
|
-
this.componentRef = (0, core_1.createComponent)(this.options.component, {
|
|
41
|
-
environmentInjector: this.options.environmentInjector || this.options.injector,
|
|
42
|
-
elementInjector: this.options.injector
|
|
43
|
-
});
|
|
44
|
-
// Set initial parameters
|
|
45
|
-
Object.keys(parameters).forEach(key => {
|
|
46
|
-
// Use 'in' operator instead of hasOwnProperty to support getter/setter properties
|
|
47
|
-
if (key in this.componentRef.instance) {
|
|
48
|
-
this.componentRef.instance[key] = parameters[key];
|
|
49
|
-
}
|
|
50
|
-
});
|
|
51
|
-
// Get the DOM element
|
|
52
|
-
const hostView = this.componentRef.hostView;
|
|
53
|
-
this._element = hostView.rootNodes[0];
|
|
54
|
-
// Trigger change detection
|
|
55
|
-
this.componentRef.changeDetectorRef.detectChanges();
|
|
56
|
-
}
|
|
57
|
-
catch (error) {
|
|
58
|
-
console.error('Error creating Angular component:', error);
|
|
59
|
-
throw error;
|
|
60
|
-
}
|
|
61
|
-
}
|
|
62
|
-
dispose() {
|
|
63
|
-
if (this.componentRef) {
|
|
64
|
-
this.componentRef.destroy();
|
|
65
|
-
this.componentRef = null;
|
|
66
|
-
}
|
|
67
|
-
this._element = null;
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
exports.AngularRenderer = AngularRenderer;
|
|
@@ -1,103 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.AngularFrameworkComponentFactory = void 0;
|
|
4
|
-
const angular_renderer_1 = require("./angular-renderer");
|
|
5
|
-
const angular_gridview_panel_1 = require("../gridview/angular-gridview-panel");
|
|
6
|
-
const angular_splitview_panel_1 = require("../splitview/angular-splitview-panel");
|
|
7
|
-
const angular_pane_part_1 = require("../paneview/angular-pane-part");
|
|
8
|
-
class AngularFrameworkComponentFactory {
|
|
9
|
-
constructor(components, injector, environmentInjector, tabComponents, watermarkComponent, headerActionsComponents, defaultTabComponent) {
|
|
10
|
-
this.components = components;
|
|
11
|
-
this.injector = injector;
|
|
12
|
-
this.environmentInjector = environmentInjector;
|
|
13
|
-
this.tabComponents = tabComponents;
|
|
14
|
-
this.watermarkComponent = watermarkComponent;
|
|
15
|
-
this.headerActionsComponents = headerActionsComponents;
|
|
16
|
-
this.defaultTabComponent = defaultTabComponent;
|
|
17
|
-
}
|
|
18
|
-
// For DockviewComponent
|
|
19
|
-
createDockviewComponent(options) {
|
|
20
|
-
const component = this.components[options.name];
|
|
21
|
-
if (!component) {
|
|
22
|
-
throw new Error(`Component '${options.name}' not found in component registry`);
|
|
23
|
-
}
|
|
24
|
-
const renderer = new angular_renderer_1.AngularRenderer({
|
|
25
|
-
component,
|
|
26
|
-
injector: this.injector,
|
|
27
|
-
environmentInjector: this.environmentInjector
|
|
28
|
-
});
|
|
29
|
-
renderer.init(options);
|
|
30
|
-
return renderer;
|
|
31
|
-
}
|
|
32
|
-
// For GridviewComponent
|
|
33
|
-
createGridviewComponent(options) {
|
|
34
|
-
const component = this.components[options.name];
|
|
35
|
-
if (!component) {
|
|
36
|
-
throw new Error(`Component '${options.name}' not found in component registry`);
|
|
37
|
-
}
|
|
38
|
-
return new angular_gridview_panel_1.AngularGridviewPanel(options.id, options.name, component, this.injector, this.environmentInjector);
|
|
39
|
-
}
|
|
40
|
-
// For SplitviewComponent
|
|
41
|
-
createSplitviewComponent(options) {
|
|
42
|
-
const component = this.components[options.name];
|
|
43
|
-
if (!component) {
|
|
44
|
-
throw new Error(`Component '${options.name}' not found in component registry`);
|
|
45
|
-
}
|
|
46
|
-
return new angular_splitview_panel_1.AngularSplitviewPanel(options.id, options.name, component, this.injector, this.environmentInjector);
|
|
47
|
-
}
|
|
48
|
-
// For PaneviewComponent
|
|
49
|
-
createPaneviewComponent(options) {
|
|
50
|
-
const component = this.components[options.name];
|
|
51
|
-
if (!component) {
|
|
52
|
-
throw new Error(`Component '${options.name}' not found in component registry`);
|
|
53
|
-
}
|
|
54
|
-
return new angular_pane_part_1.AngularPanePart(component, this.injector, this.environmentInjector);
|
|
55
|
-
}
|
|
56
|
-
// Legacy method for backward compatibility
|
|
57
|
-
createComponent(options) {
|
|
58
|
-
return this.createDockviewComponent(options);
|
|
59
|
-
}
|
|
60
|
-
createTabComponent(options) {
|
|
61
|
-
let component = this.tabComponents?.[options.name];
|
|
62
|
-
if (!component && this.defaultTabComponent) {
|
|
63
|
-
component = this.defaultTabComponent;
|
|
64
|
-
}
|
|
65
|
-
if (!component) {
|
|
66
|
-
return undefined;
|
|
67
|
-
}
|
|
68
|
-
const renderer = new angular_renderer_1.AngularRenderer({
|
|
69
|
-
component,
|
|
70
|
-
injector: this.injector,
|
|
71
|
-
environmentInjector: this.environmentInjector
|
|
72
|
-
});
|
|
73
|
-
renderer.init(options);
|
|
74
|
-
return renderer;
|
|
75
|
-
}
|
|
76
|
-
createWatermarkComponent() {
|
|
77
|
-
if (!this.watermarkComponent) {
|
|
78
|
-
throw new Error('Watermark component not provided');
|
|
79
|
-
}
|
|
80
|
-
const renderer = new angular_renderer_1.AngularRenderer({
|
|
81
|
-
component: this.watermarkComponent,
|
|
82
|
-
injector: this.injector,
|
|
83
|
-
environmentInjector: this.environmentInjector
|
|
84
|
-
});
|
|
85
|
-
renderer.init({});
|
|
86
|
-
return renderer;
|
|
87
|
-
}
|
|
88
|
-
createHeaderActionsComponent(name) {
|
|
89
|
-
const component = this.headerActionsComponents?.[name];
|
|
90
|
-
if (!component) {
|
|
91
|
-
return undefined;
|
|
92
|
-
}
|
|
93
|
-
const renderer = new angular_renderer_1.AngularRenderer({
|
|
94
|
-
component,
|
|
95
|
-
injector: this.injector,
|
|
96
|
-
environmentInjector: this.environmentInjector
|
|
97
|
-
});
|
|
98
|
-
// Initialize with empty props - dockview-core will call init() again with actual IGroupHeaderProps
|
|
99
|
-
renderer.init({});
|
|
100
|
-
return renderer;
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
exports.AngularFrameworkComponentFactory = AngularFrameworkComponentFactory;
|
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.createAngularDisposable = exports.AngularLifecycleManager = exports.AngularDisposable = void 0;
|
|
4
|
-
const rxjs_1 = require("rxjs");
|
|
5
|
-
const operators_1 = require("rxjs/operators");
|
|
6
|
-
class AngularDisposable {
|
|
7
|
-
constructor() {
|
|
8
|
-
this._isDisposed = false;
|
|
9
|
-
this.disposeCallbacks = [];
|
|
10
|
-
}
|
|
11
|
-
get isDisposed() {
|
|
12
|
-
return this._isDisposed;
|
|
13
|
-
}
|
|
14
|
-
addDisposeCallback(callback) {
|
|
15
|
-
if (this._isDisposed) {
|
|
16
|
-
callback();
|
|
17
|
-
return;
|
|
18
|
-
}
|
|
19
|
-
this.disposeCallbacks.push(callback);
|
|
20
|
-
}
|
|
21
|
-
dispose() {
|
|
22
|
-
if (this._isDisposed) {
|
|
23
|
-
return;
|
|
24
|
-
}
|
|
25
|
-
this._isDisposed = true;
|
|
26
|
-
this.disposeCallbacks.forEach(callback => {
|
|
27
|
-
try {
|
|
28
|
-
callback();
|
|
29
|
-
}
|
|
30
|
-
catch (error) {
|
|
31
|
-
console.error('Error in dispose callback:', error);
|
|
32
|
-
}
|
|
33
|
-
});
|
|
34
|
-
this.disposeCallbacks = [];
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
exports.AngularDisposable = AngularDisposable;
|
|
38
|
-
class AngularLifecycleManager {
|
|
39
|
-
constructor() {
|
|
40
|
-
this.destroySubject = new rxjs_1.Subject();
|
|
41
|
-
this.disposables = [];
|
|
42
|
-
}
|
|
43
|
-
get destroy$() {
|
|
44
|
-
return this.destroySubject.asObservable();
|
|
45
|
-
}
|
|
46
|
-
addDisposable(disposable) {
|
|
47
|
-
this.disposables.push(disposable);
|
|
48
|
-
}
|
|
49
|
-
takeUntilDestroy() {
|
|
50
|
-
return (0, operators_1.takeUntil)(this.destroySubject);
|
|
51
|
-
}
|
|
52
|
-
destroy() {
|
|
53
|
-
this.destroySubject.next();
|
|
54
|
-
this.destroySubject.complete();
|
|
55
|
-
this.disposables.forEach(disposable => {
|
|
56
|
-
try {
|
|
57
|
-
disposable.dispose();
|
|
58
|
-
}
|
|
59
|
-
catch (error) {
|
|
60
|
-
console.error('Error disposing resource:', error);
|
|
61
|
-
}
|
|
62
|
-
});
|
|
63
|
-
this.disposables = [];
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
exports.AngularLifecycleManager = AngularLifecycleManager;
|
|
67
|
-
function createAngularDisposable(disposeCallback) {
|
|
68
|
-
const disposable = new AngularDisposable();
|
|
69
|
-
if (disposeCallback) {
|
|
70
|
-
disposable.addDisposeCallback(disposeCallback);
|
|
71
|
-
}
|
|
72
|
-
return disposable;
|
|
73
|
-
}
|
|
74
|
-
exports.createAngularDisposable = createAngularDisposable;
|
package/dist/cjs/public-api.js
DELETED
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
/*
|
|
3
|
-
* Public API Surface of dockview-angular
|
|
4
|
-
*/
|
|
5
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
6
|
-
if (k2 === undefined) k2 = k;
|
|
7
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
8
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
9
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
10
|
-
}
|
|
11
|
-
Object.defineProperty(o, k2, desc);
|
|
12
|
-
}) : (function(o, m, k, k2) {
|
|
13
|
-
if (k2 === undefined) k2 = k;
|
|
14
|
-
o[k2] = m[k];
|
|
15
|
-
}));
|
|
16
|
-
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
17
|
-
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
18
|
-
};
|
|
19
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
20
|
-
// Re-export everything from dockview-core
|
|
21
|
-
__exportStar(require("dockview-core"), exports);
|
|
22
|
-
// Angular module
|
|
23
|
-
__exportStar(require("./lib/dockview-angular.module"), exports);
|
|
24
|
-
// Components
|
|
25
|
-
__exportStar(require("./lib/dockview/dockview-angular.component"), exports);
|
|
26
|
-
__exportStar(require("./lib/gridview/gridview-angular.component"), exports);
|
|
27
|
-
__exportStar(require("./lib/paneview/paneview-angular.component"), exports);
|
|
28
|
-
__exportStar(require("./lib/splitview/splitview-angular.component"), exports);
|
|
29
|
-
// Utilities
|
|
30
|
-
__exportStar(require("./lib/utils/angular-renderer"), exports);
|
|
31
|
-
__exportStar(require("./lib/utils/component-factory"), exports);
|
|
32
|
-
__exportStar(require("./lib/utils/lifecycle-utils"), exports);
|