dockview 1.10.2 → 1.12.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/dist/cjs/dockview/defaultTab.d.ts +1 -1
- package/dist/cjs/dockview/defaultTab.js +11 -31
- package/dist/cjs/dockview/dockview.d.ts +1 -1
- package/dist/cjs/dockview/dockview.js +27 -47
- package/dist/cjs/dockview/headerActionsRenderer.d.ts +1 -1
- package/dist/cjs/dockview/headerActionsRenderer.js +2 -0
- package/dist/cjs/dockview/reactContentPart.d.ts +1 -1
- package/dist/cjs/dockview/reactContentPart.js +2 -0
- package/dist/cjs/dockview/reactHeaderPart.d.ts +1 -1
- package/dist/cjs/dockview/reactHeaderPart.js +2 -0
- package/dist/cjs/dockview/reactWatermarkPart.d.ts +1 -1
- package/dist/cjs/dockview/reactWatermarkPart.js +2 -0
- package/dist/cjs/gridview/gridview.d.ts +1 -1
- package/dist/cjs/gridview/gridview.js +13 -33
- package/dist/cjs/paneview/paneview.d.ts +1 -1
- package/dist/cjs/paneview/paneview.js +16 -36
- package/dist/cjs/paneview/view.d.ts +1 -1
- package/dist/cjs/react.d.ts +1 -1
- package/dist/cjs/react.js +16 -36
- package/dist/cjs/splitview/splitview.d.ts +1 -1
- package/dist/cjs/splitview/splitview.js +13 -33
- package/dist/cjs/svg.d.ts +1 -1
- package/dist/cjs/svg.js +7 -27
- package/dist/dockview.amd.js +119 -107
- package/dist/dockview.amd.js.map +1 -1
- package/dist/dockview.amd.min.js +2 -2
- package/dist/dockview.amd.min.js.map +1 -1
- package/dist/dockview.amd.min.noStyle.js +2 -2
- package/dist/dockview.amd.min.noStyle.js.map +1 -1
- package/dist/dockview.amd.noStyle.js +118 -106
- package/dist/dockview.amd.noStyle.js.map +1 -1
- package/dist/dockview.cjs.js +119 -107
- package/dist/dockview.cjs.js.map +1 -1
- package/dist/dockview.esm.js +59 -27
- package/dist/dockview.esm.js.map +1 -1
- package/dist/dockview.esm.min.js +2 -2
- package/dist/dockview.esm.min.js.map +1 -1
- package/dist/dockview.js +119 -107
- package/dist/dockview.js.map +1 -1
- package/dist/dockview.min.js +2 -2
- package/dist/dockview.min.js.map +1 -1
- package/dist/dockview.min.noStyle.js +2 -2
- package/dist/dockview.min.noStyle.js.map +1 -1
- package/dist/dockview.noStyle.js +118 -106
- package/dist/dockview.noStyle.js.map +1 -1
- package/dist/esm/dockview/defaultTab.d.ts +1 -1
- package/dist/esm/dockview/defaultTab.js +4 -4
- package/dist/esm/dockview/dockview.d.ts +1 -1
- package/dist/esm/dockview/dockview.js +1 -1
- package/dist/esm/dockview/headerActionsRenderer.d.ts +1 -1
- package/dist/esm/dockview/headerActionsRenderer.js +2 -0
- package/dist/esm/dockview/reactContentPart.d.ts +1 -1
- package/dist/esm/dockview/reactContentPart.js +2 -0
- package/dist/esm/dockview/reactHeaderPart.d.ts +1 -1
- package/dist/esm/dockview/reactHeaderPart.js +2 -0
- package/dist/esm/dockview/reactWatermarkPart.d.ts +1 -1
- package/dist/esm/dockview/reactWatermarkPart.js +2 -0
- package/dist/esm/gridview/gridview.d.ts +1 -1
- package/dist/esm/gridview/gridview.js +1 -1
- package/dist/esm/paneview/paneview.d.ts +1 -1
- package/dist/esm/paneview/paneview.js +1 -1
- package/dist/esm/paneview/view.d.ts +1 -1
- package/dist/esm/react.d.ts +1 -1
- package/dist/esm/react.js +2 -2
- package/dist/esm/splitview/splitview.d.ts +1 -1
- package/dist/esm/splitview/splitview.js +1 -1
- package/dist/esm/svg.d.ts +1 -1
- package/dist/esm/svg.js +1 -1
- package/dist/styles/dockview.css +849 -8
- package/package.json +3 -3
|
@@ -1,31 +1,11 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* dockview
|
|
3
|
-
* @version 1.
|
|
3
|
+
* @version 1.12.0
|
|
4
4
|
* @link https://github.com/mathuo/dockview
|
|
5
5
|
* @license MIT
|
|
6
6
|
*/
|
|
7
7
|
define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) { 'use strict';
|
|
8
8
|
|
|
9
|
-
function _interopNamespaceDefault(e) {
|
|
10
|
-
var n = Object.create(null);
|
|
11
|
-
if (e) {
|
|
12
|
-
Object.keys(e).forEach(function (k) {
|
|
13
|
-
if (k !== 'default') {
|
|
14
|
-
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
15
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
16
|
-
enumerable: true,
|
|
17
|
-
get: function () { return e[k]; }
|
|
18
|
-
});
|
|
19
|
-
}
|
|
20
|
-
});
|
|
21
|
-
}
|
|
22
|
-
n.default = e;
|
|
23
|
-
return Object.freeze(n);
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
27
|
-
var ReactDOM__namespace = /*#__PURE__*/_interopNamespaceDefault(ReactDOM);
|
|
28
|
-
|
|
29
9
|
class TransferObject {
|
|
30
10
|
}
|
|
31
11
|
class PanelTransfer extends TransferObject {
|
|
@@ -3563,7 +3543,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
3563
3543
|
this.panel = panel;
|
|
3564
3544
|
let container;
|
|
3565
3545
|
switch (panel.api.renderer) {
|
|
3566
|
-
case '
|
|
3546
|
+
case 'onlyWhenVisible':
|
|
3567
3547
|
this.group.renderContainer.detatch(panel);
|
|
3568
3548
|
if (this.panel) {
|
|
3569
3549
|
if (doRender) {
|
|
@@ -3609,7 +3589,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
3609
3589
|
closePanel() {
|
|
3610
3590
|
var _a;
|
|
3611
3591
|
if (this.panel) {
|
|
3612
|
-
if (this.panel.api.renderer === '
|
|
3592
|
+
if (this.panel.api.renderer === 'onlyWhenVisible') {
|
|
3613
3593
|
(_a = this.panel.view.content.element.parentElement) === null || _a === void 0 ? void 0 : _a.removeChild(this.panel.view.content.element);
|
|
3614
3594
|
}
|
|
3615
3595
|
}
|
|
@@ -3998,6 +3978,10 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
3998
3978
|
}), this.voidContainer.onWillShowOverlay((event) => {
|
|
3999
3979
|
this._onWillShowOverlay.fire(new WillShowOverlayLocationEvent(event, {
|
|
4000
3980
|
kind: 'header_space',
|
|
3981
|
+
panel: this.group.activePanel,
|
|
3982
|
+
api: this.accessor.api,
|
|
3983
|
+
group: this.group,
|
|
3984
|
+
getData: getPanelData,
|
|
4001
3985
|
}));
|
|
4002
3986
|
}), addDisposableListener(this.voidContainer.element, 'mousedown', (event) => {
|
|
4003
3987
|
const isFloatingGroupsEnabled = !this.accessor.options.disableFloatingGroups;
|
|
@@ -4095,7 +4079,13 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
4095
4079
|
index: this.tabs.findIndex((x) => x.value === tab),
|
|
4096
4080
|
});
|
|
4097
4081
|
}), tab.onWillShowOverlay((event) => {
|
|
4098
|
-
this._onWillShowOverlay.fire(new WillShowOverlayLocationEvent(event, {
|
|
4082
|
+
this._onWillShowOverlay.fire(new WillShowOverlayLocationEvent(event, {
|
|
4083
|
+
kind: 'tab',
|
|
4084
|
+
panel: this.group.activePanel,
|
|
4085
|
+
api: this.accessor.api,
|
|
4086
|
+
group: this.group,
|
|
4087
|
+
getData: getPanelData,
|
|
4088
|
+
}));
|
|
4099
4089
|
}));
|
|
4100
4090
|
const value = { value: tab, disposable };
|
|
4101
4091
|
this.addTab(value, index);
|
|
@@ -4148,7 +4138,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
4148
4138
|
}
|
|
4149
4139
|
class WillShowOverlayLocationEvent {
|
|
4150
4140
|
get kind() {
|
|
4151
|
-
return this.
|
|
4141
|
+
return this.options.kind;
|
|
4152
4142
|
}
|
|
4153
4143
|
get nativeEvent() {
|
|
4154
4144
|
return this.event.nativeEvent;
|
|
@@ -4159,12 +4149,24 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
4159
4149
|
get defaultPrevented() {
|
|
4160
4150
|
return this.event.defaultPrevented;
|
|
4161
4151
|
}
|
|
4152
|
+
get panel() {
|
|
4153
|
+
return this.options.panel;
|
|
4154
|
+
}
|
|
4155
|
+
get api() {
|
|
4156
|
+
return this.options.api;
|
|
4157
|
+
}
|
|
4158
|
+
get group() {
|
|
4159
|
+
return this.options.group;
|
|
4160
|
+
}
|
|
4162
4161
|
preventDefault() {
|
|
4163
4162
|
this.event.preventDefault();
|
|
4164
4163
|
}
|
|
4164
|
+
getData() {
|
|
4165
|
+
return this.options.getData();
|
|
4166
|
+
}
|
|
4165
4167
|
constructor(event, options) {
|
|
4166
4168
|
this.event = event;
|
|
4167
|
-
this.
|
|
4169
|
+
this.options = options;
|
|
4168
4170
|
}
|
|
4169
4171
|
}
|
|
4170
4172
|
class DockviewGroupPanelModel extends CompositeDisposable {
|
|
@@ -4303,6 +4305,10 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
4303
4305
|
}), this.contentContainer.dropTarget.onWillShowOverlay((event) => {
|
|
4304
4306
|
this._onWillShowOverlay.fire(new WillShowOverlayLocationEvent(event, {
|
|
4305
4307
|
kind: 'content',
|
|
4308
|
+
panel: this.activePanel,
|
|
4309
|
+
api: this._api,
|
|
4310
|
+
group: this.groupPanel,
|
|
4311
|
+
getData: getPanelData,
|
|
4306
4312
|
}));
|
|
4307
4313
|
}), this._onMove, this._onDidChange, this._onDidDrop, this._onWillDrop, this._onDidAddPanel, this._onDidRemovePanel, this._onDidActivePanelChange);
|
|
4308
4314
|
}
|
|
@@ -6120,27 +6126,18 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
6120
6126
|
//
|
|
6121
6127
|
this.params = {};
|
|
6122
6128
|
this._element = document.createElement('div');
|
|
6123
|
-
this._element.className = 'default-tab';
|
|
6129
|
+
this._element.className = 'dv-default-tab';
|
|
6124
6130
|
//
|
|
6125
6131
|
this._content = document.createElement('div');
|
|
6126
|
-
this._content.className = 'tab-content';
|
|
6127
|
-
//
|
|
6128
|
-
this._actionContainer = document.createElement('div');
|
|
6129
|
-
this._actionContainer.className = 'action-container';
|
|
6130
|
-
//
|
|
6131
|
-
this._list = document.createElement('ul');
|
|
6132
|
-
this._list.className = 'tab-list';
|
|
6133
|
-
//
|
|
6132
|
+
this._content.className = 'dv-default-tab-content';
|
|
6134
6133
|
this.action = document.createElement('div');
|
|
6135
|
-
this.action.className = 'tab-action';
|
|
6134
|
+
this.action.className = 'dv-default-tab-action';
|
|
6136
6135
|
this.action.appendChild(createCloseButton());
|
|
6137
6136
|
//
|
|
6138
6137
|
this._element.appendChild(this._content);
|
|
6139
|
-
this._element.appendChild(this.
|
|
6140
|
-
this._actionContainer.appendChild(this._list);
|
|
6141
|
-
this._list.appendChild(this.action);
|
|
6138
|
+
this._element.appendChild(this.action);
|
|
6142
6139
|
//
|
|
6143
|
-
this.addDisposables(addDisposableListener(this.
|
|
6140
|
+
this.addDisposables(addDisposableListener(this.action, 'mousedown', (ev) => {
|
|
6144
6141
|
ev.preventDefault();
|
|
6145
6142
|
}));
|
|
6146
6143
|
this.render();
|
|
@@ -6957,7 +6954,10 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
6957
6954
|
}
|
|
6958
6955
|
get renderer() {
|
|
6959
6956
|
var _a;
|
|
6960
|
-
return (_a = this.options.defaultRenderer) !== null && _a !== void 0 ? _a : '
|
|
6957
|
+
return (_a = this.options.defaultRenderer) !== null && _a !== void 0 ? _a : 'onlyWhenVisible';
|
|
6958
|
+
}
|
|
6959
|
+
get api() {
|
|
6960
|
+
return this._api;
|
|
6961
6961
|
}
|
|
6962
6962
|
constructor(options) {
|
|
6963
6963
|
var _a, _b;
|
|
@@ -7092,6 +7092,10 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
7092
7092
|
}
|
|
7093
7093
|
this._onWillShowOverlay.fire(new WillShowOverlayLocationEvent(event, {
|
|
7094
7094
|
kind: 'edge',
|
|
7095
|
+
panel: undefined,
|
|
7096
|
+
api: this._api,
|
|
7097
|
+
group: undefined,
|
|
7098
|
+
getData: getPanelData,
|
|
7095
7099
|
}));
|
|
7096
7100
|
}), this._rootDropTarget.onDrop((event) => {
|
|
7097
7101
|
var _a;
|
|
@@ -9243,9 +9247,9 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9243
9247
|
* component
|
|
9244
9248
|
*/
|
|
9245
9249
|
const ReactComponentBridge = (props, ref) => {
|
|
9246
|
-
const [_, triggerRender] =
|
|
9247
|
-
const _props =
|
|
9248
|
-
|
|
9250
|
+
const [_, triggerRender] = React.useState();
|
|
9251
|
+
const _props = React.useRef(props.componentProps);
|
|
9252
|
+
React.useImperativeHandle(ref, () => ({
|
|
9249
9253
|
update: (componentProps) => {
|
|
9250
9254
|
_props.current = Object.assign(Object.assign({}, _props.current), componentProps);
|
|
9251
9255
|
/**
|
|
@@ -9257,7 +9261,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9257
9261
|
triggerRender(Date.now());
|
|
9258
9262
|
},
|
|
9259
9263
|
}), []);
|
|
9260
|
-
return
|
|
9264
|
+
return React.createElement(props.component, _props.current);
|
|
9261
9265
|
};
|
|
9262
9266
|
ReactComponentBridge.displayName = 'DockviewReactJsBridge';
|
|
9263
9267
|
/**
|
|
@@ -9269,7 +9273,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9269
9273
|
let value = 1;
|
|
9270
9274
|
return { next: () => `dockview_react_portal_key_${(value++).toString()}` };
|
|
9271
9275
|
})();
|
|
9272
|
-
const ReactPartContext =
|
|
9276
|
+
const ReactPartContext = React.createContext({});
|
|
9273
9277
|
class ReactPart {
|
|
9274
9278
|
constructor(parent, portalStore, component, parameters, context) {
|
|
9275
9279
|
this.parent = parent;
|
|
@@ -9305,7 +9309,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9305
9309
|
*/
|
|
9306
9310
|
throw new Error('Dockview: Only React.memo(...), React.ForwardRef(...) and functional components are accepted as components');
|
|
9307
9311
|
}
|
|
9308
|
-
const bridgeComponent =
|
|
9312
|
+
const bridgeComponent = React.createElement(React.forwardRef(ReactComponentBridge), {
|
|
9309
9313
|
component: this
|
|
9310
9314
|
.component,
|
|
9311
9315
|
componentProps: this.parameters,
|
|
@@ -9318,9 +9322,9 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9318
9322
|
},
|
|
9319
9323
|
});
|
|
9320
9324
|
const node = this.context
|
|
9321
|
-
?
|
|
9325
|
+
? React.createElement(ReactPartContext.Provider, { value: this.context }, bridgeComponent)
|
|
9322
9326
|
: bridgeComponent;
|
|
9323
|
-
const portal =
|
|
9327
|
+
const portal = ReactDOM.createPortal(node, this.parent, uniquePortalKeyGenerator.next());
|
|
9324
9328
|
this.ref = {
|
|
9325
9329
|
portal,
|
|
9326
9330
|
disposable: this.portalStore.addPortal(portal),
|
|
@@ -9338,9 +9342,9 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9338
9342
|
* portal array
|
|
9339
9343
|
*/
|
|
9340
9344
|
const usePortalsLifecycle = () => {
|
|
9341
|
-
const [portals, setPortals] =
|
|
9342
|
-
|
|
9343
|
-
const addPortal =
|
|
9345
|
+
const [portals, setPortals] = React.useState([]);
|
|
9346
|
+
React.useDebugValue(`Portal count: ${portals.length}`);
|
|
9347
|
+
const addPortal = React.useCallback((portal) => {
|
|
9344
9348
|
setPortals((existingPortals) => [...existingPortals, portal]);
|
|
9345
9349
|
let disposed = false;
|
|
9346
9350
|
return {
|
|
@@ -9378,6 +9382,8 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9378
9382
|
this.onDidBlur = this._onDidBlur.event;
|
|
9379
9383
|
this._element = document.createElement('div');
|
|
9380
9384
|
this._element.className = 'dockview-react-part';
|
|
9385
|
+
this._element.style.height = '100%';
|
|
9386
|
+
this._element.style.width = '100%';
|
|
9381
9387
|
}
|
|
9382
9388
|
focus() {
|
|
9383
9389
|
// TODO
|
|
@@ -9414,6 +9420,8 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9414
9420
|
this.reactPortalStore = reactPortalStore;
|
|
9415
9421
|
this._element = document.createElement('div');
|
|
9416
9422
|
this._element.className = 'dockview-react-part';
|
|
9423
|
+
this._element.style.height = '100%';
|
|
9424
|
+
this._element.style.width = '100%';
|
|
9417
9425
|
}
|
|
9418
9426
|
focus() {
|
|
9419
9427
|
//noop
|
|
@@ -9448,6 +9456,8 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9448
9456
|
this.reactPortalStore = reactPortalStore;
|
|
9449
9457
|
this._element = document.createElement('div');
|
|
9450
9458
|
this._element.className = 'dockview-react-part';
|
|
9459
|
+
this._element.style.height = '100%';
|
|
9460
|
+
this._element.style.width = '100%';
|
|
9451
9461
|
}
|
|
9452
9462
|
init(parameters) {
|
|
9453
9463
|
this.part = new ReactPart(this.element, this.reactPortalStore, this.component, {
|
|
@@ -9499,6 +9509,8 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9499
9509
|
this.mutableDisposable = new MutableDisposable();
|
|
9500
9510
|
this._element = document.createElement('div');
|
|
9501
9511
|
this._element.className = 'dockview-react-part';
|
|
9512
|
+
this._element.style.height = '100%';
|
|
9513
|
+
this._element.style.width = '100%';
|
|
9502
9514
|
}
|
|
9503
9515
|
focus() {
|
|
9504
9516
|
// TODO
|
|
@@ -9558,12 +9570,12 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9558
9570
|
: undefined;
|
|
9559
9571
|
}
|
|
9560
9572
|
const DEFAULT_REACT_TAB = 'props.defaultTabComponent';
|
|
9561
|
-
const DockviewReact =
|
|
9562
|
-
const domRef =
|
|
9563
|
-
const dockviewRef =
|
|
9573
|
+
const DockviewReact = React.forwardRef((props, ref) => {
|
|
9574
|
+
const domRef = React.useRef(null);
|
|
9575
|
+
const dockviewRef = React.useRef();
|
|
9564
9576
|
const [portals, addPortal] = usePortalsLifecycle();
|
|
9565
|
-
|
|
9566
|
-
|
|
9577
|
+
React.useImperativeHandle(ref, () => domRef.current, []);
|
|
9578
|
+
React.useEffect(() => {
|
|
9567
9579
|
var _a;
|
|
9568
9580
|
if (!domRef.current) {
|
|
9569
9581
|
return () => {
|
|
@@ -9634,13 +9646,13 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9634
9646
|
dockview.dispose();
|
|
9635
9647
|
};
|
|
9636
9648
|
}, []);
|
|
9637
|
-
|
|
9649
|
+
React.useEffect(() => {
|
|
9638
9650
|
if (!dockviewRef.current) {
|
|
9639
9651
|
return;
|
|
9640
9652
|
}
|
|
9641
9653
|
dockviewRef.current.locked = !!props.locked;
|
|
9642
9654
|
}, [props.locked]);
|
|
9643
|
-
|
|
9655
|
+
React.useEffect(() => {
|
|
9644
9656
|
if (!dockviewRef.current) {
|
|
9645
9657
|
return;
|
|
9646
9658
|
}
|
|
@@ -9648,7 +9660,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9648
9660
|
disableDnd: props.disableDnd,
|
|
9649
9661
|
});
|
|
9650
9662
|
}, [props.disableDnd]);
|
|
9651
|
-
|
|
9663
|
+
React.useEffect(() => {
|
|
9652
9664
|
if (!dockviewRef.current) {
|
|
9653
9665
|
return () => {
|
|
9654
9666
|
// noop
|
|
@@ -9663,7 +9675,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9663
9675
|
disposable.dispose();
|
|
9664
9676
|
};
|
|
9665
9677
|
}, [props.onDidDrop]);
|
|
9666
|
-
|
|
9678
|
+
React.useEffect(() => {
|
|
9667
9679
|
if (!dockviewRef.current) {
|
|
9668
9680
|
return () => {
|
|
9669
9681
|
// noop
|
|
@@ -9678,7 +9690,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9678
9690
|
disposable.dispose();
|
|
9679
9691
|
};
|
|
9680
9692
|
}, [props.onWillDrop]);
|
|
9681
|
-
|
|
9693
|
+
React.useEffect(() => {
|
|
9682
9694
|
if (!dockviewRef.current) {
|
|
9683
9695
|
return;
|
|
9684
9696
|
}
|
|
@@ -9686,7 +9698,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9686
9698
|
frameworkComponents: props.components,
|
|
9687
9699
|
});
|
|
9688
9700
|
}, [props.components]);
|
|
9689
|
-
|
|
9701
|
+
React.useEffect(() => {
|
|
9690
9702
|
if (!dockviewRef.current) {
|
|
9691
9703
|
return;
|
|
9692
9704
|
}
|
|
@@ -9694,7 +9706,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9694
9706
|
floatingGroupBounds: props.floatingGroupBounds,
|
|
9695
9707
|
});
|
|
9696
9708
|
}, [props.floatingGroupBounds]);
|
|
9697
|
-
|
|
9709
|
+
React.useEffect(() => {
|
|
9698
9710
|
if (!dockviewRef.current) {
|
|
9699
9711
|
return;
|
|
9700
9712
|
}
|
|
@@ -9702,7 +9714,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9702
9714
|
watermarkFrameworkComponent: props.watermarkComponent,
|
|
9703
9715
|
});
|
|
9704
9716
|
}, [props.watermarkComponent]);
|
|
9705
|
-
|
|
9717
|
+
React.useEffect(() => {
|
|
9706
9718
|
if (!dockviewRef.current) {
|
|
9707
9719
|
return;
|
|
9708
9720
|
}
|
|
@@ -9710,7 +9722,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9710
9722
|
showDndOverlay: props.showDndOverlay,
|
|
9711
9723
|
});
|
|
9712
9724
|
}, [props.showDndOverlay]);
|
|
9713
|
-
|
|
9725
|
+
React.useEffect(() => {
|
|
9714
9726
|
if (!dockviewRef.current) {
|
|
9715
9727
|
return;
|
|
9716
9728
|
}
|
|
@@ -9718,7 +9730,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9718
9730
|
frameworkTabComponents: props.tabComponents,
|
|
9719
9731
|
});
|
|
9720
9732
|
}, [props.tabComponents]);
|
|
9721
|
-
|
|
9733
|
+
React.useEffect(() => {
|
|
9722
9734
|
if (!dockviewRef.current) {
|
|
9723
9735
|
return;
|
|
9724
9736
|
}
|
|
@@ -9726,7 +9738,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9726
9738
|
disableFloatingGroups: props.disableFloatingGroups,
|
|
9727
9739
|
});
|
|
9728
9740
|
}, [props.disableFloatingGroups]);
|
|
9729
|
-
|
|
9741
|
+
React.useEffect(() => {
|
|
9730
9742
|
var _a;
|
|
9731
9743
|
if (!dockviewRef.current) {
|
|
9732
9744
|
return;
|
|
@@ -9743,7 +9755,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9743
9755
|
frameworkTabComponents,
|
|
9744
9756
|
});
|
|
9745
9757
|
}, [props.defaultTabComponent]);
|
|
9746
|
-
|
|
9758
|
+
React.useEffect(() => {
|
|
9747
9759
|
if (!dockviewRef.current) {
|
|
9748
9760
|
return;
|
|
9749
9761
|
}
|
|
@@ -9751,7 +9763,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9751
9763
|
createRightHeaderActionsElement: createGroupControlElement(props.rightHeaderActionsComponent, { addPortal }),
|
|
9752
9764
|
});
|
|
9753
9765
|
}, [props.rightHeaderActionsComponent]);
|
|
9754
|
-
|
|
9766
|
+
React.useEffect(() => {
|
|
9755
9767
|
if (!dockviewRef.current) {
|
|
9756
9768
|
return;
|
|
9757
9769
|
}
|
|
@@ -9759,7 +9771,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9759
9771
|
createLeftHeaderActionsElement: createGroupControlElement(props.leftHeaderActionsComponent, { addPortal }),
|
|
9760
9772
|
});
|
|
9761
9773
|
}, [props.leftHeaderActionsComponent]);
|
|
9762
|
-
|
|
9774
|
+
React.useEffect(() => {
|
|
9763
9775
|
if (!dockviewRef.current) {
|
|
9764
9776
|
return;
|
|
9765
9777
|
}
|
|
@@ -9767,7 +9779,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9767
9779
|
rootOverlayModel: props.rootOverlayModel,
|
|
9768
9780
|
});
|
|
9769
9781
|
}, [props.rootOverlayModel]);
|
|
9770
|
-
|
|
9782
|
+
React.useEffect(() => {
|
|
9771
9783
|
if (!dockviewRef.current) {
|
|
9772
9784
|
return;
|
|
9773
9785
|
}
|
|
@@ -9775,7 +9787,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9775
9787
|
createPrefixHeaderActionsElement: createGroupControlElement(props.prefixHeaderActionsComponent, { addPortal }),
|
|
9776
9788
|
});
|
|
9777
9789
|
}, [props.prefixHeaderActionsComponent]);
|
|
9778
|
-
return (
|
|
9790
|
+
return (React.createElement("div", { className: props.className, style: { height: '100%', width: '100%' }, ref: domRef }, portals));
|
|
9779
9791
|
});
|
|
9780
9792
|
DockviewReact.displayName = 'DockviewComponent';
|
|
9781
9793
|
|
|
@@ -9813,12 +9825,12 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9813
9825
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
9814
9826
|
};
|
|
9815
9827
|
|
|
9816
|
-
const CloseButton = () => (
|
|
9817
|
-
|
|
9828
|
+
const CloseButton = () => (React.createElement("svg", { height: "11", width: "11", viewBox: "0 0 28 28", "aria-hidden": 'false', focusable: false, className: "dockview-svg" },
|
|
9829
|
+
React.createElement("path", { d: "M2.1 27.3L0 25.2L11.55 13.65L0 2.1L2.1 0L13.65 11.55L25.2 0L27.3 2.1L15.75 13.65L27.3 25.2L25.2 27.3L13.65 15.75L2.1 27.3Z" })));
|
|
9818
9830
|
|
|
9819
9831
|
const DockviewDefaultTab = (_a) => {
|
|
9820
9832
|
var { api, containerApi: _containerApi, params: _params, hideClose, closeActionOverride } = _a, rest = __rest(_a, ["api", "containerApi", "params", "hideClose", "closeActionOverride"]);
|
|
9821
|
-
const onClose =
|
|
9833
|
+
const onClose = React.useCallback((event) => {
|
|
9822
9834
|
event.preventDefault();
|
|
9823
9835
|
if (closeActionOverride) {
|
|
9824
9836
|
closeActionOverride();
|
|
@@ -9827,10 +9839,10 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9827
9839
|
api.close();
|
|
9828
9840
|
}
|
|
9829
9841
|
}, [api, closeActionOverride]);
|
|
9830
|
-
const onMouseDown =
|
|
9842
|
+
const onMouseDown = React.useCallback((e) => {
|
|
9831
9843
|
e.preventDefault();
|
|
9832
9844
|
}, []);
|
|
9833
|
-
const onClick =
|
|
9845
|
+
const onClick = React.useCallback((event) => {
|
|
9834
9846
|
if (event.defaultPrevented) {
|
|
9835
9847
|
return;
|
|
9836
9848
|
}
|
|
@@ -9839,10 +9851,10 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9839
9851
|
rest.onClick(event);
|
|
9840
9852
|
}
|
|
9841
9853
|
}, [api, rest.onClick]);
|
|
9842
|
-
return (
|
|
9843
|
-
|
|
9844
|
-
!hideClose && (
|
|
9845
|
-
|
|
9854
|
+
return (React.createElement("div", Object.assign({ "data-testid": "dockview-dv-default-tab" }, rest, { onClick: onClick, className: "dv-default-tab" }),
|
|
9855
|
+
React.createElement("span", { className: "dv-default-tab-content" }, api.title),
|
|
9856
|
+
!hideClose && (React.createElement("div", { className: "dv-default-tab-action", onMouseDown: onMouseDown, onClick: onClose },
|
|
9857
|
+
React.createElement(CloseButton, null)))));
|
|
9846
9858
|
};
|
|
9847
9859
|
|
|
9848
9860
|
class ReactPanelView extends SplitviewPanel {
|
|
@@ -9861,12 +9873,12 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9861
9873
|
}
|
|
9862
9874
|
}
|
|
9863
9875
|
|
|
9864
|
-
const SplitviewReact =
|
|
9865
|
-
const domRef =
|
|
9866
|
-
const splitviewRef =
|
|
9876
|
+
const SplitviewReact = React.forwardRef((props, ref) => {
|
|
9877
|
+
const domRef = React.useRef(null);
|
|
9878
|
+
const splitviewRef = React.useRef();
|
|
9867
9879
|
const [portals, addPortal] = usePortalsLifecycle();
|
|
9868
|
-
|
|
9869
|
-
|
|
9880
|
+
React.useImperativeHandle(ref, () => domRef.current, []);
|
|
9881
|
+
React.useEffect(() => {
|
|
9870
9882
|
var _a;
|
|
9871
9883
|
const splitview = new SplitviewComponent({
|
|
9872
9884
|
parentElement: domRef.current,
|
|
@@ -9897,7 +9909,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9897
9909
|
splitview.dispose();
|
|
9898
9910
|
};
|
|
9899
9911
|
}, []);
|
|
9900
|
-
|
|
9912
|
+
React.useEffect(() => {
|
|
9901
9913
|
if (!splitviewRef.current) {
|
|
9902
9914
|
return;
|
|
9903
9915
|
}
|
|
@@ -9905,7 +9917,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9905
9917
|
frameworkComponents: props.components,
|
|
9906
9918
|
});
|
|
9907
9919
|
}, [props.components]);
|
|
9908
|
-
return (
|
|
9920
|
+
return (React.createElement("div", { className: props.className, style: { height: '100%', width: '100%' }, ref: domRef }, portals));
|
|
9909
9921
|
});
|
|
9910
9922
|
SplitviewReact.displayName = 'SplitviewComponent';
|
|
9911
9923
|
|
|
@@ -9927,12 +9939,12 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9927
9939
|
}
|
|
9928
9940
|
}
|
|
9929
9941
|
|
|
9930
|
-
const GridviewReact =
|
|
9931
|
-
const domRef =
|
|
9932
|
-
const gridviewRef =
|
|
9942
|
+
const GridviewReact = React.forwardRef((props, ref) => {
|
|
9943
|
+
const domRef = React.useRef(null);
|
|
9944
|
+
const gridviewRef = React.useRef();
|
|
9933
9945
|
const [portals, addPortal] = usePortalsLifecycle();
|
|
9934
|
-
|
|
9935
|
-
|
|
9946
|
+
React.useImperativeHandle(ref, () => domRef.current, []);
|
|
9947
|
+
React.useEffect(() => {
|
|
9936
9948
|
var _a;
|
|
9937
9949
|
if (!domRef.current) {
|
|
9938
9950
|
return () => {
|
|
@@ -9968,7 +9980,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9968
9980
|
gridview.dispose();
|
|
9969
9981
|
};
|
|
9970
9982
|
}, []);
|
|
9971
|
-
|
|
9983
|
+
React.useEffect(() => {
|
|
9972
9984
|
if (!gridviewRef.current) {
|
|
9973
9985
|
return;
|
|
9974
9986
|
}
|
|
@@ -9976,7 +9988,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9976
9988
|
frameworkComponents: props.components,
|
|
9977
9989
|
});
|
|
9978
9990
|
}, [props.components]);
|
|
9979
|
-
return (
|
|
9991
|
+
return (React.createElement("div", { className: props.className, style: { height: '100%', width: '100%' }, ref: domRef }, portals));
|
|
9980
9992
|
});
|
|
9981
9993
|
GridviewReact.displayName = 'GridviewComponent';
|
|
9982
9994
|
|
|
@@ -10015,12 +10027,12 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10015
10027
|
}
|
|
10016
10028
|
}
|
|
10017
10029
|
|
|
10018
|
-
const PaneviewReact =
|
|
10019
|
-
const domRef =
|
|
10020
|
-
const paneviewRef =
|
|
10030
|
+
const PaneviewReact = React.forwardRef((props, ref) => {
|
|
10031
|
+
const domRef = React.useRef(null);
|
|
10032
|
+
const paneviewRef = React.useRef();
|
|
10021
10033
|
const [portals, addPortal] = usePortalsLifecycle();
|
|
10022
|
-
|
|
10023
|
-
|
|
10034
|
+
React.useImperativeHandle(ref, () => domRef.current, []);
|
|
10035
|
+
React.useEffect(() => {
|
|
10024
10036
|
const createComponent = (id, _componentId, component) => new PanePanelSection(id, component, {
|
|
10025
10037
|
addPortal,
|
|
10026
10038
|
});
|
|
@@ -10053,7 +10065,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10053
10065
|
paneview.dispose();
|
|
10054
10066
|
};
|
|
10055
10067
|
}, []);
|
|
10056
|
-
|
|
10068
|
+
React.useEffect(() => {
|
|
10057
10069
|
if (!paneviewRef.current) {
|
|
10058
10070
|
return;
|
|
10059
10071
|
}
|
|
@@ -10061,7 +10073,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10061
10073
|
frameworkComponents: props.components,
|
|
10062
10074
|
});
|
|
10063
10075
|
}, [props.components]);
|
|
10064
|
-
|
|
10076
|
+
React.useEffect(() => {
|
|
10065
10077
|
if (!paneviewRef.current) {
|
|
10066
10078
|
return;
|
|
10067
10079
|
}
|
|
@@ -10069,7 +10081,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10069
10081
|
headerframeworkComponents: props.headerComponents,
|
|
10070
10082
|
});
|
|
10071
10083
|
}, [props.headerComponents]);
|
|
10072
|
-
|
|
10084
|
+
React.useEffect(() => {
|
|
10073
10085
|
if (!paneviewRef.current) {
|
|
10074
10086
|
return () => {
|
|
10075
10087
|
//
|
|
@@ -10085,7 +10097,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10085
10097
|
disposable.dispose();
|
|
10086
10098
|
};
|
|
10087
10099
|
}, [props.onDidDrop]);
|
|
10088
|
-
|
|
10100
|
+
React.useEffect(() => {
|
|
10089
10101
|
if (!paneviewRef.current) {
|
|
10090
10102
|
return;
|
|
10091
10103
|
}
|
|
@@ -10093,7 +10105,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10093
10105
|
showDndOverlay: props.showDndOverlay,
|
|
10094
10106
|
});
|
|
10095
10107
|
}, [props.showDndOverlay]);
|
|
10096
|
-
return (
|
|
10108
|
+
return (React.createElement("div", { className: props.className, style: { height: '100%', width: '100%' }, ref: domRef }, portals));
|
|
10097
10109
|
});
|
|
10098
10110
|
PaneviewReact.displayName = 'PaneviewComponent';
|
|
10099
10111
|
|