dockview 1.10.2 → 1.11.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 +80 -101
- 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 +79 -100
- package/dist/dockview.amd.noStyle.js.map +1 -1
- package/dist/dockview.cjs.js +80 -101
- package/dist/dockview.cjs.js.map +1 -1
- package/dist/dockview.esm.js +20 -21
- 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 +80 -101
- 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 +79 -100
- 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.11.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 {
|
|
@@ -6120,27 +6100,18 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
6120
6100
|
//
|
|
6121
6101
|
this.params = {};
|
|
6122
6102
|
this._element = document.createElement('div');
|
|
6123
|
-
this._element.className = 'default-tab';
|
|
6103
|
+
this._element.className = 'dv-default-tab';
|
|
6124
6104
|
//
|
|
6125
6105
|
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
|
-
//
|
|
6106
|
+
this._content.className = 'dv-default-tab-content';
|
|
6134
6107
|
this.action = document.createElement('div');
|
|
6135
|
-
this.action.className = 'tab-action';
|
|
6108
|
+
this.action.className = 'dv-default-tab-action';
|
|
6136
6109
|
this.action.appendChild(createCloseButton());
|
|
6137
6110
|
//
|
|
6138
6111
|
this._element.appendChild(this._content);
|
|
6139
|
-
this._element.appendChild(this.
|
|
6140
|
-
this._actionContainer.appendChild(this._list);
|
|
6141
|
-
this._list.appendChild(this.action);
|
|
6112
|
+
this._element.appendChild(this.action);
|
|
6142
6113
|
//
|
|
6143
|
-
this.addDisposables(addDisposableListener(this.
|
|
6114
|
+
this.addDisposables(addDisposableListener(this.action, 'mousedown', (ev) => {
|
|
6144
6115
|
ev.preventDefault();
|
|
6145
6116
|
}));
|
|
6146
6117
|
this.render();
|
|
@@ -9243,9 +9214,9 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9243
9214
|
* component
|
|
9244
9215
|
*/
|
|
9245
9216
|
const ReactComponentBridge = (props, ref) => {
|
|
9246
|
-
const [_, triggerRender] =
|
|
9247
|
-
const _props =
|
|
9248
|
-
|
|
9217
|
+
const [_, triggerRender] = React.useState();
|
|
9218
|
+
const _props = React.useRef(props.componentProps);
|
|
9219
|
+
React.useImperativeHandle(ref, () => ({
|
|
9249
9220
|
update: (componentProps) => {
|
|
9250
9221
|
_props.current = Object.assign(Object.assign({}, _props.current), componentProps);
|
|
9251
9222
|
/**
|
|
@@ -9257,7 +9228,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9257
9228
|
triggerRender(Date.now());
|
|
9258
9229
|
},
|
|
9259
9230
|
}), []);
|
|
9260
|
-
return
|
|
9231
|
+
return React.createElement(props.component, _props.current);
|
|
9261
9232
|
};
|
|
9262
9233
|
ReactComponentBridge.displayName = 'DockviewReactJsBridge';
|
|
9263
9234
|
/**
|
|
@@ -9269,7 +9240,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9269
9240
|
let value = 1;
|
|
9270
9241
|
return { next: () => `dockview_react_portal_key_${(value++).toString()}` };
|
|
9271
9242
|
})();
|
|
9272
|
-
const ReactPartContext =
|
|
9243
|
+
const ReactPartContext = React.createContext({});
|
|
9273
9244
|
class ReactPart {
|
|
9274
9245
|
constructor(parent, portalStore, component, parameters, context) {
|
|
9275
9246
|
this.parent = parent;
|
|
@@ -9305,7 +9276,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9305
9276
|
*/
|
|
9306
9277
|
throw new Error('Dockview: Only React.memo(...), React.ForwardRef(...) and functional components are accepted as components');
|
|
9307
9278
|
}
|
|
9308
|
-
const bridgeComponent =
|
|
9279
|
+
const bridgeComponent = React.createElement(React.forwardRef(ReactComponentBridge), {
|
|
9309
9280
|
component: this
|
|
9310
9281
|
.component,
|
|
9311
9282
|
componentProps: this.parameters,
|
|
@@ -9318,9 +9289,9 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9318
9289
|
},
|
|
9319
9290
|
});
|
|
9320
9291
|
const node = this.context
|
|
9321
|
-
?
|
|
9292
|
+
? React.createElement(ReactPartContext.Provider, { value: this.context }, bridgeComponent)
|
|
9322
9293
|
: bridgeComponent;
|
|
9323
|
-
const portal =
|
|
9294
|
+
const portal = ReactDOM.createPortal(node, this.parent, uniquePortalKeyGenerator.next());
|
|
9324
9295
|
this.ref = {
|
|
9325
9296
|
portal,
|
|
9326
9297
|
disposable: this.portalStore.addPortal(portal),
|
|
@@ -9338,9 +9309,9 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9338
9309
|
* portal array
|
|
9339
9310
|
*/
|
|
9340
9311
|
const usePortalsLifecycle = () => {
|
|
9341
|
-
const [portals, setPortals] =
|
|
9342
|
-
|
|
9343
|
-
const addPortal =
|
|
9312
|
+
const [portals, setPortals] = React.useState([]);
|
|
9313
|
+
React.useDebugValue(`Portal count: ${portals.length}`);
|
|
9314
|
+
const addPortal = React.useCallback((portal) => {
|
|
9344
9315
|
setPortals((existingPortals) => [...existingPortals, portal]);
|
|
9345
9316
|
let disposed = false;
|
|
9346
9317
|
return {
|
|
@@ -9378,6 +9349,8 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9378
9349
|
this.onDidBlur = this._onDidBlur.event;
|
|
9379
9350
|
this._element = document.createElement('div');
|
|
9380
9351
|
this._element.className = 'dockview-react-part';
|
|
9352
|
+
this._element.style.height = '100%';
|
|
9353
|
+
this._element.style.width = '100%';
|
|
9381
9354
|
}
|
|
9382
9355
|
focus() {
|
|
9383
9356
|
// TODO
|
|
@@ -9414,6 +9387,8 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9414
9387
|
this.reactPortalStore = reactPortalStore;
|
|
9415
9388
|
this._element = document.createElement('div');
|
|
9416
9389
|
this._element.className = 'dockview-react-part';
|
|
9390
|
+
this._element.style.height = '100%';
|
|
9391
|
+
this._element.style.width = '100%';
|
|
9417
9392
|
}
|
|
9418
9393
|
focus() {
|
|
9419
9394
|
//noop
|
|
@@ -9448,6 +9423,8 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9448
9423
|
this.reactPortalStore = reactPortalStore;
|
|
9449
9424
|
this._element = document.createElement('div');
|
|
9450
9425
|
this._element.className = 'dockview-react-part';
|
|
9426
|
+
this._element.style.height = '100%';
|
|
9427
|
+
this._element.style.width = '100%';
|
|
9451
9428
|
}
|
|
9452
9429
|
init(parameters) {
|
|
9453
9430
|
this.part = new ReactPart(this.element, this.reactPortalStore, this.component, {
|
|
@@ -9499,6 +9476,8 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9499
9476
|
this.mutableDisposable = new MutableDisposable();
|
|
9500
9477
|
this._element = document.createElement('div');
|
|
9501
9478
|
this._element.className = 'dockview-react-part';
|
|
9479
|
+
this._element.style.height = '100%';
|
|
9480
|
+
this._element.style.width = '100%';
|
|
9502
9481
|
}
|
|
9503
9482
|
focus() {
|
|
9504
9483
|
// TODO
|
|
@@ -9558,12 +9537,12 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9558
9537
|
: undefined;
|
|
9559
9538
|
}
|
|
9560
9539
|
const DEFAULT_REACT_TAB = 'props.defaultTabComponent';
|
|
9561
|
-
const DockviewReact =
|
|
9562
|
-
const domRef =
|
|
9563
|
-
const dockviewRef =
|
|
9540
|
+
const DockviewReact = React.forwardRef((props, ref) => {
|
|
9541
|
+
const domRef = React.useRef(null);
|
|
9542
|
+
const dockviewRef = React.useRef();
|
|
9564
9543
|
const [portals, addPortal] = usePortalsLifecycle();
|
|
9565
|
-
|
|
9566
|
-
|
|
9544
|
+
React.useImperativeHandle(ref, () => domRef.current, []);
|
|
9545
|
+
React.useEffect(() => {
|
|
9567
9546
|
var _a;
|
|
9568
9547
|
if (!domRef.current) {
|
|
9569
9548
|
return () => {
|
|
@@ -9634,13 +9613,13 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9634
9613
|
dockview.dispose();
|
|
9635
9614
|
};
|
|
9636
9615
|
}, []);
|
|
9637
|
-
|
|
9616
|
+
React.useEffect(() => {
|
|
9638
9617
|
if (!dockviewRef.current) {
|
|
9639
9618
|
return;
|
|
9640
9619
|
}
|
|
9641
9620
|
dockviewRef.current.locked = !!props.locked;
|
|
9642
9621
|
}, [props.locked]);
|
|
9643
|
-
|
|
9622
|
+
React.useEffect(() => {
|
|
9644
9623
|
if (!dockviewRef.current) {
|
|
9645
9624
|
return;
|
|
9646
9625
|
}
|
|
@@ -9648,7 +9627,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9648
9627
|
disableDnd: props.disableDnd,
|
|
9649
9628
|
});
|
|
9650
9629
|
}, [props.disableDnd]);
|
|
9651
|
-
|
|
9630
|
+
React.useEffect(() => {
|
|
9652
9631
|
if (!dockviewRef.current) {
|
|
9653
9632
|
return () => {
|
|
9654
9633
|
// noop
|
|
@@ -9663,7 +9642,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9663
9642
|
disposable.dispose();
|
|
9664
9643
|
};
|
|
9665
9644
|
}, [props.onDidDrop]);
|
|
9666
|
-
|
|
9645
|
+
React.useEffect(() => {
|
|
9667
9646
|
if (!dockviewRef.current) {
|
|
9668
9647
|
return () => {
|
|
9669
9648
|
// noop
|
|
@@ -9678,7 +9657,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9678
9657
|
disposable.dispose();
|
|
9679
9658
|
};
|
|
9680
9659
|
}, [props.onWillDrop]);
|
|
9681
|
-
|
|
9660
|
+
React.useEffect(() => {
|
|
9682
9661
|
if (!dockviewRef.current) {
|
|
9683
9662
|
return;
|
|
9684
9663
|
}
|
|
@@ -9686,7 +9665,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9686
9665
|
frameworkComponents: props.components,
|
|
9687
9666
|
});
|
|
9688
9667
|
}, [props.components]);
|
|
9689
|
-
|
|
9668
|
+
React.useEffect(() => {
|
|
9690
9669
|
if (!dockviewRef.current) {
|
|
9691
9670
|
return;
|
|
9692
9671
|
}
|
|
@@ -9694,7 +9673,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9694
9673
|
floatingGroupBounds: props.floatingGroupBounds,
|
|
9695
9674
|
});
|
|
9696
9675
|
}, [props.floatingGroupBounds]);
|
|
9697
|
-
|
|
9676
|
+
React.useEffect(() => {
|
|
9698
9677
|
if (!dockviewRef.current) {
|
|
9699
9678
|
return;
|
|
9700
9679
|
}
|
|
@@ -9702,7 +9681,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9702
9681
|
watermarkFrameworkComponent: props.watermarkComponent,
|
|
9703
9682
|
});
|
|
9704
9683
|
}, [props.watermarkComponent]);
|
|
9705
|
-
|
|
9684
|
+
React.useEffect(() => {
|
|
9706
9685
|
if (!dockviewRef.current) {
|
|
9707
9686
|
return;
|
|
9708
9687
|
}
|
|
@@ -9710,7 +9689,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9710
9689
|
showDndOverlay: props.showDndOverlay,
|
|
9711
9690
|
});
|
|
9712
9691
|
}, [props.showDndOverlay]);
|
|
9713
|
-
|
|
9692
|
+
React.useEffect(() => {
|
|
9714
9693
|
if (!dockviewRef.current) {
|
|
9715
9694
|
return;
|
|
9716
9695
|
}
|
|
@@ -9718,7 +9697,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9718
9697
|
frameworkTabComponents: props.tabComponents,
|
|
9719
9698
|
});
|
|
9720
9699
|
}, [props.tabComponents]);
|
|
9721
|
-
|
|
9700
|
+
React.useEffect(() => {
|
|
9722
9701
|
if (!dockviewRef.current) {
|
|
9723
9702
|
return;
|
|
9724
9703
|
}
|
|
@@ -9726,7 +9705,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9726
9705
|
disableFloatingGroups: props.disableFloatingGroups,
|
|
9727
9706
|
});
|
|
9728
9707
|
}, [props.disableFloatingGroups]);
|
|
9729
|
-
|
|
9708
|
+
React.useEffect(() => {
|
|
9730
9709
|
var _a;
|
|
9731
9710
|
if (!dockviewRef.current) {
|
|
9732
9711
|
return;
|
|
@@ -9743,7 +9722,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9743
9722
|
frameworkTabComponents,
|
|
9744
9723
|
});
|
|
9745
9724
|
}, [props.defaultTabComponent]);
|
|
9746
|
-
|
|
9725
|
+
React.useEffect(() => {
|
|
9747
9726
|
if (!dockviewRef.current) {
|
|
9748
9727
|
return;
|
|
9749
9728
|
}
|
|
@@ -9751,7 +9730,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9751
9730
|
createRightHeaderActionsElement: createGroupControlElement(props.rightHeaderActionsComponent, { addPortal }),
|
|
9752
9731
|
});
|
|
9753
9732
|
}, [props.rightHeaderActionsComponent]);
|
|
9754
|
-
|
|
9733
|
+
React.useEffect(() => {
|
|
9755
9734
|
if (!dockviewRef.current) {
|
|
9756
9735
|
return;
|
|
9757
9736
|
}
|
|
@@ -9759,7 +9738,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9759
9738
|
createLeftHeaderActionsElement: createGroupControlElement(props.leftHeaderActionsComponent, { addPortal }),
|
|
9760
9739
|
});
|
|
9761
9740
|
}, [props.leftHeaderActionsComponent]);
|
|
9762
|
-
|
|
9741
|
+
React.useEffect(() => {
|
|
9763
9742
|
if (!dockviewRef.current) {
|
|
9764
9743
|
return;
|
|
9765
9744
|
}
|
|
@@ -9767,7 +9746,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9767
9746
|
rootOverlayModel: props.rootOverlayModel,
|
|
9768
9747
|
});
|
|
9769
9748
|
}, [props.rootOverlayModel]);
|
|
9770
|
-
|
|
9749
|
+
React.useEffect(() => {
|
|
9771
9750
|
if (!dockviewRef.current) {
|
|
9772
9751
|
return;
|
|
9773
9752
|
}
|
|
@@ -9775,7 +9754,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9775
9754
|
createPrefixHeaderActionsElement: createGroupControlElement(props.prefixHeaderActionsComponent, { addPortal }),
|
|
9776
9755
|
});
|
|
9777
9756
|
}, [props.prefixHeaderActionsComponent]);
|
|
9778
|
-
return (
|
|
9757
|
+
return (React.createElement("div", { className: props.className, style: { height: '100%', width: '100%' }, ref: domRef }, portals));
|
|
9779
9758
|
});
|
|
9780
9759
|
DockviewReact.displayName = 'DockviewComponent';
|
|
9781
9760
|
|
|
@@ -9813,12 +9792,12 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9813
9792
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
9814
9793
|
};
|
|
9815
9794
|
|
|
9816
|
-
const CloseButton = () => (
|
|
9817
|
-
|
|
9795
|
+
const CloseButton = () => (React.createElement("svg", { height: "11", width: "11", viewBox: "0 0 28 28", "aria-hidden": 'false', focusable: false, className: "dockview-svg" },
|
|
9796
|
+
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
9797
|
|
|
9819
9798
|
const DockviewDefaultTab = (_a) => {
|
|
9820
9799
|
var { api, containerApi: _containerApi, params: _params, hideClose, closeActionOverride } = _a, rest = __rest(_a, ["api", "containerApi", "params", "hideClose", "closeActionOverride"]);
|
|
9821
|
-
const onClose =
|
|
9800
|
+
const onClose = React.useCallback((event) => {
|
|
9822
9801
|
event.preventDefault();
|
|
9823
9802
|
if (closeActionOverride) {
|
|
9824
9803
|
closeActionOverride();
|
|
@@ -9827,10 +9806,10 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9827
9806
|
api.close();
|
|
9828
9807
|
}
|
|
9829
9808
|
}, [api, closeActionOverride]);
|
|
9830
|
-
const onMouseDown =
|
|
9809
|
+
const onMouseDown = React.useCallback((e) => {
|
|
9831
9810
|
e.preventDefault();
|
|
9832
9811
|
}, []);
|
|
9833
|
-
const onClick =
|
|
9812
|
+
const onClick = React.useCallback((event) => {
|
|
9834
9813
|
if (event.defaultPrevented) {
|
|
9835
9814
|
return;
|
|
9836
9815
|
}
|
|
@@ -9839,10 +9818,10 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9839
9818
|
rest.onClick(event);
|
|
9840
9819
|
}
|
|
9841
9820
|
}, [api, rest.onClick]);
|
|
9842
|
-
return (
|
|
9843
|
-
|
|
9844
|
-
!hideClose && (
|
|
9845
|
-
|
|
9821
|
+
return (React.createElement("div", Object.assign({ "data-testid": "dockview-dv-default-tab" }, rest, { onClick: onClick, className: "dv-default-tab" }),
|
|
9822
|
+
React.createElement("span", { className: "dv-default-tab-content" }, api.title),
|
|
9823
|
+
!hideClose && (React.createElement("div", { className: "dv-default-tab-action", onMouseDown: onMouseDown, onClick: onClose },
|
|
9824
|
+
React.createElement(CloseButton, null)))));
|
|
9846
9825
|
};
|
|
9847
9826
|
|
|
9848
9827
|
class ReactPanelView extends SplitviewPanel {
|
|
@@ -9861,12 +9840,12 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9861
9840
|
}
|
|
9862
9841
|
}
|
|
9863
9842
|
|
|
9864
|
-
const SplitviewReact =
|
|
9865
|
-
const domRef =
|
|
9866
|
-
const splitviewRef =
|
|
9843
|
+
const SplitviewReact = React.forwardRef((props, ref) => {
|
|
9844
|
+
const domRef = React.useRef(null);
|
|
9845
|
+
const splitviewRef = React.useRef();
|
|
9867
9846
|
const [portals, addPortal] = usePortalsLifecycle();
|
|
9868
|
-
|
|
9869
|
-
|
|
9847
|
+
React.useImperativeHandle(ref, () => domRef.current, []);
|
|
9848
|
+
React.useEffect(() => {
|
|
9870
9849
|
var _a;
|
|
9871
9850
|
const splitview = new SplitviewComponent({
|
|
9872
9851
|
parentElement: domRef.current,
|
|
@@ -9897,7 +9876,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9897
9876
|
splitview.dispose();
|
|
9898
9877
|
};
|
|
9899
9878
|
}, []);
|
|
9900
|
-
|
|
9879
|
+
React.useEffect(() => {
|
|
9901
9880
|
if (!splitviewRef.current) {
|
|
9902
9881
|
return;
|
|
9903
9882
|
}
|
|
@@ -9905,7 +9884,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9905
9884
|
frameworkComponents: props.components,
|
|
9906
9885
|
});
|
|
9907
9886
|
}, [props.components]);
|
|
9908
|
-
return (
|
|
9887
|
+
return (React.createElement("div", { className: props.className, style: { height: '100%', width: '100%' }, ref: domRef }, portals));
|
|
9909
9888
|
});
|
|
9910
9889
|
SplitviewReact.displayName = 'SplitviewComponent';
|
|
9911
9890
|
|
|
@@ -9927,12 +9906,12 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9927
9906
|
}
|
|
9928
9907
|
}
|
|
9929
9908
|
|
|
9930
|
-
const GridviewReact =
|
|
9931
|
-
const domRef =
|
|
9932
|
-
const gridviewRef =
|
|
9909
|
+
const GridviewReact = React.forwardRef((props, ref) => {
|
|
9910
|
+
const domRef = React.useRef(null);
|
|
9911
|
+
const gridviewRef = React.useRef();
|
|
9933
9912
|
const [portals, addPortal] = usePortalsLifecycle();
|
|
9934
|
-
|
|
9935
|
-
|
|
9913
|
+
React.useImperativeHandle(ref, () => domRef.current, []);
|
|
9914
|
+
React.useEffect(() => {
|
|
9936
9915
|
var _a;
|
|
9937
9916
|
if (!domRef.current) {
|
|
9938
9917
|
return () => {
|
|
@@ -9968,7 +9947,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9968
9947
|
gridview.dispose();
|
|
9969
9948
|
};
|
|
9970
9949
|
}, []);
|
|
9971
|
-
|
|
9950
|
+
React.useEffect(() => {
|
|
9972
9951
|
if (!gridviewRef.current) {
|
|
9973
9952
|
return;
|
|
9974
9953
|
}
|
|
@@ -9976,7 +9955,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
9976
9955
|
frameworkComponents: props.components,
|
|
9977
9956
|
});
|
|
9978
9957
|
}, [props.components]);
|
|
9979
|
-
return (
|
|
9958
|
+
return (React.createElement("div", { className: props.className, style: { height: '100%', width: '100%' }, ref: domRef }, portals));
|
|
9980
9959
|
});
|
|
9981
9960
|
GridviewReact.displayName = 'GridviewComponent';
|
|
9982
9961
|
|
|
@@ -10015,12 +9994,12 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10015
9994
|
}
|
|
10016
9995
|
}
|
|
10017
9996
|
|
|
10018
|
-
const PaneviewReact =
|
|
10019
|
-
const domRef =
|
|
10020
|
-
const paneviewRef =
|
|
9997
|
+
const PaneviewReact = React.forwardRef((props, ref) => {
|
|
9998
|
+
const domRef = React.useRef(null);
|
|
9999
|
+
const paneviewRef = React.useRef();
|
|
10021
10000
|
const [portals, addPortal] = usePortalsLifecycle();
|
|
10022
|
-
|
|
10023
|
-
|
|
10001
|
+
React.useImperativeHandle(ref, () => domRef.current, []);
|
|
10002
|
+
React.useEffect(() => {
|
|
10024
10003
|
const createComponent = (id, _componentId, component) => new PanePanelSection(id, component, {
|
|
10025
10004
|
addPortal,
|
|
10026
10005
|
});
|
|
@@ -10053,7 +10032,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10053
10032
|
paneview.dispose();
|
|
10054
10033
|
};
|
|
10055
10034
|
}, []);
|
|
10056
|
-
|
|
10035
|
+
React.useEffect(() => {
|
|
10057
10036
|
if (!paneviewRef.current) {
|
|
10058
10037
|
return;
|
|
10059
10038
|
}
|
|
@@ -10061,7 +10040,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10061
10040
|
frameworkComponents: props.components,
|
|
10062
10041
|
});
|
|
10063
10042
|
}, [props.components]);
|
|
10064
|
-
|
|
10043
|
+
React.useEffect(() => {
|
|
10065
10044
|
if (!paneviewRef.current) {
|
|
10066
10045
|
return;
|
|
10067
10046
|
}
|
|
@@ -10069,7 +10048,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10069
10048
|
headerframeworkComponents: props.headerComponents,
|
|
10070
10049
|
});
|
|
10071
10050
|
}, [props.headerComponents]);
|
|
10072
|
-
|
|
10051
|
+
React.useEffect(() => {
|
|
10073
10052
|
if (!paneviewRef.current) {
|
|
10074
10053
|
return () => {
|
|
10075
10054
|
//
|
|
@@ -10085,7 +10064,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10085
10064
|
disposable.dispose();
|
|
10086
10065
|
};
|
|
10087
10066
|
}, [props.onDidDrop]);
|
|
10088
|
-
|
|
10067
|
+
React.useEffect(() => {
|
|
10089
10068
|
if (!paneviewRef.current) {
|
|
10090
10069
|
return;
|
|
10091
10070
|
}
|
|
@@ -10093,7 +10072,7 @@ define(['exports', 'react', 'react-dom'], (function (exports, React, ReactDOM) {
|
|
|
10093
10072
|
showDndOverlay: props.showDndOverlay,
|
|
10094
10073
|
});
|
|
10095
10074
|
}, [props.showDndOverlay]);
|
|
10096
|
-
return (
|
|
10075
|
+
return (React.createElement("div", { className: props.className, style: { height: '100%', width: '100%' }, ref: domRef }, portals));
|
|
10097
10076
|
});
|
|
10098
10077
|
PaneviewReact.displayName = 'PaneviewComponent';
|
|
10099
10078
|
|