dockview-react 7.0.4 → 8.1.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/LICENCE.md +21 -0
- package/README.md +21 -16
- package/dist/cjs/dockview/reactContextMenuItemPart.d.ts +10 -3
- package/dist/cjs/index.d.ts +2 -2
- package/dist/cjs/svg.d.ts +1 -0
- package/dist/dockview-react.js +19294 -21736
- package/dist/dockview-react.min.js +4142 -22
- package/dist/package/main.cjs.js +960 -986
- package/dist/package/main.cjs.min.js +6 -6
- package/dist/package/main.esm.min.mjs +6 -6
- package/dist/package/main.esm.mjs +926 -977
- package/dist/styles/dockview.css +3098 -2400
- package/package.json +91 -85
- package/dist/cjs/dockview/defaultTab.js +0 -99
- package/dist/cjs/dockview/dockview.js +0 -285
- package/dist/cjs/dockview/headerActionsRenderer.js +0 -86
- package/dist/cjs/dockview/reactContentPart.js +0 -52
- package/dist/cjs/dockview/reactContextMenuItemPart.js +0 -31
- package/dist/cjs/dockview/reactGroupDragGhostPart.js +0 -32
- package/dist/cjs/dockview/reactHeaderPart.js +0 -46
- package/dist/cjs/dockview/reactTabGroupChipPart.js +0 -36
- package/dist/cjs/dockview/reactWatermarkPart.js +0 -47
- package/dist/cjs/gridview/gridview.js +0 -105
- package/dist/cjs/gridview/view.js +0 -41
- package/dist/cjs/index.js +0 -24
- package/dist/cjs/paneview/paneview.js +0 -137
- package/dist/cjs/paneview/view.js +0 -44
- package/dist/cjs/react.js +0 -183
- package/dist/cjs/splitview/splitview.js +0 -105
- package/dist/cjs/splitview/view.js +0 -39
- package/dist/cjs/svg.js +0 -15
- package/dist/cjs/types.js +0 -2
- package/dist/dockview-react.min.js.map +0 -1
- package/dist/esm/dockview/defaultTab.d.ts +0 -7
- package/dist/esm/dockview/defaultTab.js +0 -65
- package/dist/esm/dockview/dockview.d.ts +0 -33
- package/dist/esm/dockview/dockview.js +0 -252
- package/dist/esm/dockview/headerActionsRenderer.d.ts +0 -24
- package/dist/esm/dockview/headerActionsRenderer.js +0 -72
- package/dist/esm/dockview/reactContentPart.d.ts +0 -21
- package/dist/esm/dockview/reactContentPart.js +0 -43
- package/dist/esm/dockview/reactContextMenuItemPart.d.ts +0 -14
- package/dist/esm/dockview/reactContextMenuItemPart.js +0 -22
- package/dist/esm/dockview/reactGroupDragGhostPart.d.ts +0 -20
- package/dist/esm/dockview/reactGroupDragGhostPart.js +0 -23
- package/dist/esm/dockview/reactHeaderPart.d.ts +0 -17
- package/dist/esm/dockview/reactHeaderPart.js +0 -37
- package/dist/esm/dockview/reactTabGroupChipPart.d.ts +0 -23
- package/dist/esm/dockview/reactTabGroupChipPart.js +0 -27
- package/dist/esm/dockview/reactWatermarkPart.d.ts +0 -18
- package/dist/esm/dockview/reactWatermarkPart.js +0 -38
- package/dist/esm/gridview/gridview.d.ts +0 -17
- package/dist/esm/gridview/gridview.js +0 -72
- package/dist/esm/gridview/view.d.ts +0 -9
- package/dist/esm/gridview/view.js +0 -19
- package/dist/esm/index.d.ts +0 -10
- package/dist/esm/index.js +0 -8
- package/dist/esm/paneview/paneview.d.ts +0 -20
- package/dist/esm/paneview/paneview.js +0 -104
- package/dist/esm/paneview/view.d.ts +0 -19
- package/dist/esm/paneview/view.js +0 -35
- package/dist/esm/react.d.ts +0 -35
- package/dist/esm/react.js +0 -134
- package/dist/esm/splitview/splitview.d.ts +0 -17
- package/dist/esm/splitview/splitview.js +0 -72
- package/dist/esm/splitview/view.d.ts +0 -9
- package/dist/esm/splitview/view.js +0 -17
- package/dist/esm/svg.d.ts +0 -3
- package/dist/esm/svg.js +0 -7
- package/dist/esm/types.d.ts +0 -4
- package/dist/esm/types.js +0 -1
package/package.json
CHANGED
|
@@ -1,88 +1,94 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
2
|
+
"name": "dockview-react",
|
|
3
|
+
"version": "8.1.0",
|
|
4
|
+
"description": "React docking layout manager — tabs, groups, grids, splitviews, drag and drop, floating panels",
|
|
5
|
+
"keywords": [
|
|
6
|
+
"splitview",
|
|
7
|
+
"split-view",
|
|
8
|
+
"gridview",
|
|
9
|
+
"grid-view",
|
|
10
|
+
"dockview",
|
|
11
|
+
"dock-view",
|
|
12
|
+
"grid",
|
|
13
|
+
"tabs",
|
|
14
|
+
"layout",
|
|
15
|
+
"layout manager",
|
|
16
|
+
"dock layout",
|
|
17
|
+
"dock",
|
|
18
|
+
"docking",
|
|
19
|
+
"splitter",
|
|
20
|
+
"drag-and-drop",
|
|
21
|
+
"drag",
|
|
22
|
+
"drop",
|
|
23
|
+
"touch",
|
|
24
|
+
"mobile",
|
|
25
|
+
"typescript",
|
|
26
|
+
"zero-dependency",
|
|
27
|
+
"ide-layout",
|
|
28
|
+
"panel",
|
|
29
|
+
"resizable",
|
|
30
|
+
"floating",
|
|
31
|
+
"serialization",
|
|
32
|
+
"workbench",
|
|
33
|
+
"react",
|
|
34
|
+
"react-component"
|
|
35
|
+
],
|
|
36
|
+
"homepage": "https://github.com/dockview/dockview",
|
|
37
|
+
"bugs": {
|
|
38
|
+
"url": "https://github.com/dockview/dockview/issues"
|
|
39
|
+
},
|
|
40
|
+
"repository": {
|
|
41
|
+
"type": "git",
|
|
42
|
+
"url": "git+https://github.com/dockview/dockview.git",
|
|
43
|
+
"directory": "packages/dockview-react"
|
|
44
|
+
},
|
|
45
|
+
"license": "MIT",
|
|
46
|
+
"author": "https://github.com/mathuo",
|
|
47
|
+
"main": "./dist/package/main.cjs.js",
|
|
48
|
+
"module": "./dist/package/main.esm.mjs",
|
|
49
|
+
"types": "./dist/cjs/index.d.ts",
|
|
50
|
+
"exports": {
|
|
51
|
+
".": {
|
|
52
|
+
"types": "./dist/cjs/index.d.ts",
|
|
53
|
+
"import": "./dist/package/main.esm.mjs",
|
|
54
|
+
"require": "./dist/package/main.cjs.js"
|
|
39
55
|
},
|
|
40
|
-
"
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
"
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
"
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
"
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
"
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
"format": "prettier --write 'src/**/*.{ts,tsx,js,jsx}'",
|
|
79
|
-
"format:check": "prettier --check 'src/**/*.{ts,tsx,js,jsx}'"
|
|
80
|
-
},
|
|
81
|
-
"dependencies": {
|
|
82
|
-
"dockview": "^7.0.4"
|
|
83
|
-
},
|
|
84
|
-
"peerDependencies": {
|
|
85
|
-
"react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
86
|
-
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
|
87
|
-
}
|
|
56
|
+
"./dist/styles/*": "./dist/styles/*",
|
|
57
|
+
"./dist/*": "./dist/*",
|
|
58
|
+
"./package.json": "./package.json"
|
|
59
|
+
},
|
|
60
|
+
"sideEffects": [
|
|
61
|
+
"**/*.css",
|
|
62
|
+
"**/*.scss"
|
|
63
|
+
],
|
|
64
|
+
"files": [
|
|
65
|
+
"dist/package",
|
|
66
|
+
"dist/cjs/**/*.d.ts",
|
|
67
|
+
"dist/styles",
|
|
68
|
+
"dist/*.js",
|
|
69
|
+
"README.md",
|
|
70
|
+
"LICENCE.md"
|
|
71
|
+
],
|
|
72
|
+
"scripts": {
|
|
73
|
+
"build:bundle": "rolldown -c rolldown.config.mjs",
|
|
74
|
+
"build:cjs": "tsc --build ./tsconfig.json --verbose --extendedDiagnostics",
|
|
75
|
+
"build:css": "node scripts/copy-css.js",
|
|
76
|
+
"build": "npm run build:cjs && npm run build:css",
|
|
77
|
+
"clean": "rimraf dist/ .build/ .rollup.cache/",
|
|
78
|
+
"rebuild": "npm run clean && npm run build && npm run build:bundle",
|
|
79
|
+
"types:check": "attw --pack . --ignore-rules false-cjs",
|
|
80
|
+
"test": "jest --selectProjects dockview-react",
|
|
81
|
+
"test:cov": "jest --selectProjects dockview-react --coverage",
|
|
82
|
+
"lint": "biome lint src",
|
|
83
|
+
"lint:fix": "biome lint --write src",
|
|
84
|
+
"format": "biome format --write src",
|
|
85
|
+
"format:check": "biome format src"
|
|
86
|
+
},
|
|
87
|
+
"dependencies": {
|
|
88
|
+
"dockview": "^8.1.0"
|
|
89
|
+
},
|
|
90
|
+
"peerDependencies": {
|
|
91
|
+
"react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
92
|
+
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
|
93
|
+
}
|
|
88
94
|
}
|
|
@@ -1,99 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
-
var t = {};
|
|
15
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
-
t[p] = s[p];
|
|
17
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
-
t[p[i]] = s[p[i]];
|
|
21
|
-
}
|
|
22
|
-
return t;
|
|
23
|
-
};
|
|
24
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
25
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
26
|
-
if (!m) return o;
|
|
27
|
-
var i = m.call(o), r, ar = [], e;
|
|
28
|
-
try {
|
|
29
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
30
|
-
}
|
|
31
|
-
catch (error) { e = { error: error }; }
|
|
32
|
-
finally {
|
|
33
|
-
try {
|
|
34
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
35
|
-
}
|
|
36
|
-
finally { if (e) throw e.error; }
|
|
37
|
-
}
|
|
38
|
-
return ar;
|
|
39
|
-
};
|
|
40
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
41
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
42
|
-
};
|
|
43
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
44
|
-
exports.DockviewDefaultTab = void 0;
|
|
45
|
-
var react_1 = __importDefault(require("react"));
|
|
46
|
-
var svg_1 = require("../svg");
|
|
47
|
-
function useTitle(api) {
|
|
48
|
-
var _a = __read(react_1.default.useState(api.title), 2), title = _a[0], setTitle = _a[1];
|
|
49
|
-
react_1.default.useEffect(function () {
|
|
50
|
-
var disposable = api.onDidTitleChange(function (event) {
|
|
51
|
-
setTitle(event.title);
|
|
52
|
-
});
|
|
53
|
-
// Depending on the order in which React effects are run, the title may already be out of sync (cf. issue #1003).
|
|
54
|
-
if (title !== api.title) {
|
|
55
|
-
setTitle(api.title);
|
|
56
|
-
}
|
|
57
|
-
return function () {
|
|
58
|
-
disposable.dispose();
|
|
59
|
-
};
|
|
60
|
-
}, [api]);
|
|
61
|
-
return title;
|
|
62
|
-
}
|
|
63
|
-
var DockviewDefaultTab = function (_a) {
|
|
64
|
-
var api = _a.api, _containerApi = _a.containerApi, _params = _a.params, hideClose = _a.hideClose, closeActionOverride = _a.closeActionOverride, onPointerDown = _a.onPointerDown, onPointerUp = _a.onPointerUp, onPointerLeave = _a.onPointerLeave, tabLocation = _a.tabLocation, rest = __rest(_a, ["api", "containerApi", "params", "hideClose", "closeActionOverride", "onPointerDown", "onPointerUp", "onPointerLeave", "tabLocation"]);
|
|
65
|
-
var title = useTitle(api);
|
|
66
|
-
var isMiddleMouseButton = react_1.default.useRef(false);
|
|
67
|
-
var onClose = react_1.default.useCallback(function (event) {
|
|
68
|
-
event.preventDefault();
|
|
69
|
-
if (closeActionOverride) {
|
|
70
|
-
closeActionOverride();
|
|
71
|
-
}
|
|
72
|
-
else {
|
|
73
|
-
api.close();
|
|
74
|
-
}
|
|
75
|
-
}, [api, closeActionOverride]);
|
|
76
|
-
var onBtnPointerDown = react_1.default.useCallback(function (event) {
|
|
77
|
-
event.preventDefault();
|
|
78
|
-
}, []);
|
|
79
|
-
var _onPointerDown = react_1.default.useCallback(function (event) {
|
|
80
|
-
isMiddleMouseButton.current = event.button === 1;
|
|
81
|
-
onPointerDown === null || onPointerDown === void 0 ? void 0 : onPointerDown(event);
|
|
82
|
-
}, [onPointerDown]);
|
|
83
|
-
var _onPointerUp = react_1.default.useCallback(function (event) {
|
|
84
|
-
if (isMiddleMouseButton && event.button === 1 && !hideClose) {
|
|
85
|
-
isMiddleMouseButton.current = false;
|
|
86
|
-
onClose(event);
|
|
87
|
-
}
|
|
88
|
-
onPointerUp === null || onPointerUp === void 0 ? void 0 : onPointerUp(event);
|
|
89
|
-
}, [onPointerUp, onClose, hideClose]);
|
|
90
|
-
var _onPointerLeave = react_1.default.useCallback(function (event) {
|
|
91
|
-
isMiddleMouseButton.current = false;
|
|
92
|
-
onPointerLeave === null || onPointerLeave === void 0 ? void 0 : onPointerLeave(event);
|
|
93
|
-
}, [onPointerLeave]);
|
|
94
|
-
return (react_1.default.createElement("div", __assign({ "data-testid": "dockview-dv-default-tab" }, rest, { onPointerDown: _onPointerDown, onPointerUp: _onPointerUp, onPointerLeave: _onPointerLeave, className: "dv-default-tab" }),
|
|
95
|
-
react_1.default.createElement("span", { className: "dv-default-tab-content" }, title),
|
|
96
|
-
!hideClose && (react_1.default.createElement("div", { className: "dv-default-tab-action", onPointerDown: onBtnPointerDown, onClick: onClose },
|
|
97
|
-
react_1.default.createElement(svg_1.CloseButton, null)))));
|
|
98
|
-
};
|
|
99
|
-
exports.DockviewDefaultTab = DockviewDefaultTab;
|
|
@@ -1,285 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
14
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
15
|
-
if (!m) return o;
|
|
16
|
-
var i = m.call(o), r, ar = [], e;
|
|
17
|
-
try {
|
|
18
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
19
|
-
}
|
|
20
|
-
catch (error) { e = { error: error }; }
|
|
21
|
-
finally {
|
|
22
|
-
try {
|
|
23
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
24
|
-
}
|
|
25
|
-
finally { if (e) throw e.error; }
|
|
26
|
-
}
|
|
27
|
-
return ar;
|
|
28
|
-
};
|
|
29
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
30
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
31
|
-
};
|
|
32
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
33
|
-
exports.DockviewReact = void 0;
|
|
34
|
-
var react_1 = __importDefault(require("react"));
|
|
35
|
-
var dockview_1 = require("dockview");
|
|
36
|
-
var reactContentPart_1 = require("./reactContentPart");
|
|
37
|
-
var reactHeaderPart_1 = require("./reactHeaderPart");
|
|
38
|
-
var react_2 = require("../react");
|
|
39
|
-
var reactWatermarkPart_1 = require("./reactWatermarkPart");
|
|
40
|
-
var headerActionsRenderer_1 = require("./headerActionsRenderer");
|
|
41
|
-
var reactContextMenuItemPart_1 = require("./reactContextMenuItemPart");
|
|
42
|
-
var reactTabGroupChipPart_1 = require("./reactTabGroupChipPart");
|
|
43
|
-
var reactGroupDragGhostPart_1 = require("./reactGroupDragGhostPart");
|
|
44
|
-
function createGroupControlElement(component, store) {
|
|
45
|
-
return component
|
|
46
|
-
? function (groupPanel) {
|
|
47
|
-
return new headerActionsRenderer_1.ReactHeaderActionsRendererPart(component, store, groupPanel);
|
|
48
|
-
}
|
|
49
|
-
: undefined;
|
|
50
|
-
}
|
|
51
|
-
var DEFAULT_REACT_TAB = 'props.defaultTabComponent';
|
|
52
|
-
function extractCoreOptions(props) {
|
|
53
|
-
var coreOptions = dockview_1.PROPERTY_KEYS_DOCKVIEW.reduce(function (obj, key) {
|
|
54
|
-
if (key in props) {
|
|
55
|
-
obj[key] = props[key];
|
|
56
|
-
}
|
|
57
|
-
return obj;
|
|
58
|
-
}, {});
|
|
59
|
-
return coreOptions;
|
|
60
|
-
}
|
|
61
|
-
exports.DockviewReact = react_1.default.forwardRef(function (props, ref) {
|
|
62
|
-
var domRef = react_1.default.useRef(null);
|
|
63
|
-
var dockviewRef = react_1.default.useRef(undefined);
|
|
64
|
-
var _a = __read((0, react_2.usePortalsLifecycle)(), 2), portals = _a[0], addPortal = _a[1];
|
|
65
|
-
react_1.default.useImperativeHandle(ref, function () { return domRef.current; }, []);
|
|
66
|
-
var prevProps = react_1.default.useRef({});
|
|
67
|
-
react_1.default.useEffect(function () {
|
|
68
|
-
var changes = {};
|
|
69
|
-
dockview_1.PROPERTY_KEYS_DOCKVIEW.forEach(function (propKey) {
|
|
70
|
-
var key = propKey;
|
|
71
|
-
var propValue = props[key];
|
|
72
|
-
if (key in props && propValue !== prevProps.current[key]) {
|
|
73
|
-
changes[key] = propValue;
|
|
74
|
-
}
|
|
75
|
-
});
|
|
76
|
-
if (dockviewRef.current) {
|
|
77
|
-
dockviewRef.current.updateOptions(changes);
|
|
78
|
-
}
|
|
79
|
-
else {
|
|
80
|
-
// not yet fully initialized
|
|
81
|
-
}
|
|
82
|
-
prevProps.current = props;
|
|
83
|
-
}, dockview_1.PROPERTY_KEYS_DOCKVIEW.map(function (key) { return props[key]; }));
|
|
84
|
-
react_1.default.useEffect(function () {
|
|
85
|
-
var _a;
|
|
86
|
-
if (!domRef.current) {
|
|
87
|
-
return;
|
|
88
|
-
}
|
|
89
|
-
var frameworkTabComponents = (_a = props.tabComponents) !== null && _a !== void 0 ? _a : {};
|
|
90
|
-
if (props.defaultTabComponent) {
|
|
91
|
-
frameworkTabComponents[DEFAULT_REACT_TAB] =
|
|
92
|
-
props.defaultTabComponent;
|
|
93
|
-
}
|
|
94
|
-
var frameworkOptions = {
|
|
95
|
-
createLeftHeaderActionComponent: createGroupControlElement(props.leftHeaderActionsComponent, { addPortal: addPortal }),
|
|
96
|
-
createRightHeaderActionComponent: createGroupControlElement(props.rightHeaderActionsComponent, { addPortal: addPortal }),
|
|
97
|
-
createPrefixHeaderActionComponent: createGroupControlElement(props.prefixHeaderActionsComponent, { addPortal: addPortal }),
|
|
98
|
-
createComponent: function (options) {
|
|
99
|
-
return new reactContentPart_1.ReactPanelContentPart(options.id, props.components[options.name], {
|
|
100
|
-
addPortal: addPortal,
|
|
101
|
-
});
|
|
102
|
-
},
|
|
103
|
-
createTabComponent: function (options) {
|
|
104
|
-
return new reactHeaderPart_1.ReactPanelHeaderPart(options.id, frameworkTabComponents[options.name], {
|
|
105
|
-
addPortal: addPortal,
|
|
106
|
-
});
|
|
107
|
-
},
|
|
108
|
-
createWatermarkComponent: props.watermarkComponent
|
|
109
|
-
? function () {
|
|
110
|
-
return new reactWatermarkPart_1.ReactWatermarkPart('watermark', props.watermarkComponent, {
|
|
111
|
-
addPortal: addPortal,
|
|
112
|
-
});
|
|
113
|
-
}
|
|
114
|
-
: undefined,
|
|
115
|
-
defaultTabComponent: props.defaultTabComponent
|
|
116
|
-
? DEFAULT_REACT_TAB
|
|
117
|
-
: undefined,
|
|
118
|
-
createContextMenuItemComponent: function (options) {
|
|
119
|
-
if (!options.component) {
|
|
120
|
-
return undefined;
|
|
121
|
-
}
|
|
122
|
-
return new reactContextMenuItemPart_1.ReactContextMenuItemPart(options.id, options.component, { addPortal: addPortal });
|
|
123
|
-
},
|
|
124
|
-
};
|
|
125
|
-
var coreOptions = extractCoreOptions(props);
|
|
126
|
-
if (props.tabGroupChipComponent) {
|
|
127
|
-
var chipComponent_1 = props.tabGroupChipComponent;
|
|
128
|
-
coreOptions.createTabGroupChipComponent = function () {
|
|
129
|
-
return new reactTabGroupChipPart_1.ReactTabGroupChipPart(chipComponent_1, {
|
|
130
|
-
addPortal: addPortal,
|
|
131
|
-
});
|
|
132
|
-
};
|
|
133
|
-
}
|
|
134
|
-
if (props.groupDragGhostComponent) {
|
|
135
|
-
var ghostComponent_1 = props.groupDragGhostComponent;
|
|
136
|
-
coreOptions.createGroupDragGhostComponent = function () {
|
|
137
|
-
return new reactGroupDragGhostPart_1.ReactGroupDragGhostPart(ghostComponent_1, {
|
|
138
|
-
addPortal: addPortal,
|
|
139
|
-
});
|
|
140
|
-
};
|
|
141
|
-
}
|
|
142
|
-
var api = (0, dockview_1.createDockview)(domRef.current, __assign(__assign({}, coreOptions), frameworkOptions));
|
|
143
|
-
var _b = domRef.current, clientWidth = _b.clientWidth, clientHeight = _b.clientHeight;
|
|
144
|
-
api.layout(clientWidth, clientHeight);
|
|
145
|
-
if (props.onReady) {
|
|
146
|
-
props.onReady({ api: api });
|
|
147
|
-
}
|
|
148
|
-
dockviewRef.current = api;
|
|
149
|
-
return function () {
|
|
150
|
-
dockviewRef.current = undefined;
|
|
151
|
-
api.dispose();
|
|
152
|
-
};
|
|
153
|
-
}, []);
|
|
154
|
-
react_1.default.useEffect(function () {
|
|
155
|
-
if (!dockviewRef.current) {
|
|
156
|
-
return function () {
|
|
157
|
-
// noop
|
|
158
|
-
};
|
|
159
|
-
}
|
|
160
|
-
var disposable = dockviewRef.current.onDidDrop(function (event) {
|
|
161
|
-
if (props.onDidDrop) {
|
|
162
|
-
props.onDidDrop(event);
|
|
163
|
-
}
|
|
164
|
-
});
|
|
165
|
-
return function () {
|
|
166
|
-
disposable.dispose();
|
|
167
|
-
};
|
|
168
|
-
}, [props.onDidDrop]);
|
|
169
|
-
react_1.default.useEffect(function () {
|
|
170
|
-
if (!dockviewRef.current) {
|
|
171
|
-
return function () {
|
|
172
|
-
// noop
|
|
173
|
-
};
|
|
174
|
-
}
|
|
175
|
-
var disposable = dockviewRef.current.onWillDrop(function (event) {
|
|
176
|
-
if (props.onWillDrop) {
|
|
177
|
-
props.onWillDrop(event);
|
|
178
|
-
}
|
|
179
|
-
});
|
|
180
|
-
return function () {
|
|
181
|
-
disposable.dispose();
|
|
182
|
-
};
|
|
183
|
-
}, [props.onWillDrop]);
|
|
184
|
-
react_1.default.useEffect(function () {
|
|
185
|
-
if (!dockviewRef.current) {
|
|
186
|
-
return;
|
|
187
|
-
}
|
|
188
|
-
dockviewRef.current.updateOptions({
|
|
189
|
-
createTabGroupChipComponent: props.tabGroupChipComponent
|
|
190
|
-
? function () {
|
|
191
|
-
return new reactTabGroupChipPart_1.ReactTabGroupChipPart(props.tabGroupChipComponent, {
|
|
192
|
-
addPortal: addPortal,
|
|
193
|
-
});
|
|
194
|
-
}
|
|
195
|
-
: undefined,
|
|
196
|
-
});
|
|
197
|
-
}, [props.tabGroupChipComponent]);
|
|
198
|
-
react_1.default.useEffect(function () {
|
|
199
|
-
if (!dockviewRef.current) {
|
|
200
|
-
return;
|
|
201
|
-
}
|
|
202
|
-
dockviewRef.current.updateOptions({
|
|
203
|
-
createGroupDragGhostComponent: props.groupDragGhostComponent
|
|
204
|
-
? function () {
|
|
205
|
-
return new reactGroupDragGhostPart_1.ReactGroupDragGhostPart(props.groupDragGhostComponent, {
|
|
206
|
-
addPortal: addPortal,
|
|
207
|
-
});
|
|
208
|
-
}
|
|
209
|
-
: undefined,
|
|
210
|
-
});
|
|
211
|
-
}, [props.groupDragGhostComponent]);
|
|
212
|
-
react_1.default.useEffect(function () {
|
|
213
|
-
if (!dockviewRef.current) {
|
|
214
|
-
return;
|
|
215
|
-
}
|
|
216
|
-
dockviewRef.current.updateOptions({
|
|
217
|
-
createComponent: function (options) {
|
|
218
|
-
return new reactContentPart_1.ReactPanelContentPart(options.id, props.components[options.name], {
|
|
219
|
-
addPortal: addPortal,
|
|
220
|
-
});
|
|
221
|
-
},
|
|
222
|
-
});
|
|
223
|
-
}, [props.components]);
|
|
224
|
-
react_1.default.useEffect(function () {
|
|
225
|
-
var _a;
|
|
226
|
-
if (!dockviewRef.current) {
|
|
227
|
-
return;
|
|
228
|
-
}
|
|
229
|
-
var frameworkTabComponents = (_a = props.tabComponents) !== null && _a !== void 0 ? _a : {};
|
|
230
|
-
if (props.defaultTabComponent) {
|
|
231
|
-
frameworkTabComponents[DEFAULT_REACT_TAB] =
|
|
232
|
-
props.defaultTabComponent;
|
|
233
|
-
}
|
|
234
|
-
dockviewRef.current.updateOptions({
|
|
235
|
-
defaultTabComponent: props.defaultTabComponent
|
|
236
|
-
? DEFAULT_REACT_TAB
|
|
237
|
-
: undefined,
|
|
238
|
-
createTabComponent: function (options) {
|
|
239
|
-
return new reactHeaderPart_1.ReactPanelHeaderPart(options.id, frameworkTabComponents[options.name], {
|
|
240
|
-
addPortal: addPortal,
|
|
241
|
-
});
|
|
242
|
-
},
|
|
243
|
-
});
|
|
244
|
-
}, [props.tabComponents, props.defaultTabComponent]);
|
|
245
|
-
react_1.default.useEffect(function () {
|
|
246
|
-
if (!dockviewRef.current) {
|
|
247
|
-
return;
|
|
248
|
-
}
|
|
249
|
-
dockviewRef.current.updateOptions({
|
|
250
|
-
createWatermarkComponent: props.watermarkComponent
|
|
251
|
-
? function () {
|
|
252
|
-
return new reactWatermarkPart_1.ReactWatermarkPart('watermark', props.watermarkComponent, {
|
|
253
|
-
addPortal: addPortal,
|
|
254
|
-
});
|
|
255
|
-
}
|
|
256
|
-
: undefined,
|
|
257
|
-
});
|
|
258
|
-
}, [props.watermarkComponent]);
|
|
259
|
-
react_1.default.useEffect(function () {
|
|
260
|
-
if (!dockviewRef.current) {
|
|
261
|
-
return;
|
|
262
|
-
}
|
|
263
|
-
dockviewRef.current.updateOptions({
|
|
264
|
-
createRightHeaderActionComponent: createGroupControlElement(props.rightHeaderActionsComponent, { addPortal: addPortal }),
|
|
265
|
-
});
|
|
266
|
-
}, [props.rightHeaderActionsComponent]);
|
|
267
|
-
react_1.default.useEffect(function () {
|
|
268
|
-
if (!dockviewRef.current) {
|
|
269
|
-
return;
|
|
270
|
-
}
|
|
271
|
-
dockviewRef.current.updateOptions({
|
|
272
|
-
createLeftHeaderActionComponent: createGroupControlElement(props.leftHeaderActionsComponent, { addPortal: addPortal }),
|
|
273
|
-
});
|
|
274
|
-
}, [props.leftHeaderActionsComponent]);
|
|
275
|
-
react_1.default.useEffect(function () {
|
|
276
|
-
if (!dockviewRef.current) {
|
|
277
|
-
return;
|
|
278
|
-
}
|
|
279
|
-
dockviewRef.current.updateOptions({
|
|
280
|
-
createPrefixHeaderActionComponent: createGroupControlElement(props.prefixHeaderActionsComponent, { addPortal: addPortal }),
|
|
281
|
-
});
|
|
282
|
-
}, [props.prefixHeaderActionsComponent]);
|
|
283
|
-
return (react_1.default.createElement("div", { style: { height: '100%', width: '100%' }, ref: domRef }, portals));
|
|
284
|
-
});
|
|
285
|
-
exports.DockviewReact.displayName = 'DockviewComponent';
|
|
@@ -1,86 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.ReactHeaderActionsRendererPart = void 0;
|
|
4
|
-
var react_1 = require("../react");
|
|
5
|
-
var dockview_1 = require("dockview");
|
|
6
|
-
var ReactHeaderActionsRendererPart = /** @class */ (function () {
|
|
7
|
-
function ReactHeaderActionsRendererPart(component, reactPortalStore, _group) {
|
|
8
|
-
this.component = component;
|
|
9
|
-
this.reactPortalStore = reactPortalStore;
|
|
10
|
-
this._group = _group;
|
|
11
|
-
this.mutableDisposable = new dockview_1.DockviewMutableDisposable();
|
|
12
|
-
this._element = document.createElement('div');
|
|
13
|
-
this._element.className = 'dv-react-part';
|
|
14
|
-
this._element.style.height = '100%';
|
|
15
|
-
this._element.style.width = '100%';
|
|
16
|
-
}
|
|
17
|
-
Object.defineProperty(ReactHeaderActionsRendererPart.prototype, "element", {
|
|
18
|
-
get: function () {
|
|
19
|
-
return this._element;
|
|
20
|
-
},
|
|
21
|
-
enumerable: false,
|
|
22
|
-
configurable: true
|
|
23
|
-
});
|
|
24
|
-
Object.defineProperty(ReactHeaderActionsRendererPart.prototype, "part", {
|
|
25
|
-
get: function () {
|
|
26
|
-
return this._part;
|
|
27
|
-
},
|
|
28
|
-
enumerable: false,
|
|
29
|
-
configurable: true
|
|
30
|
-
});
|
|
31
|
-
ReactHeaderActionsRendererPart.prototype.init = function (parameters) {
|
|
32
|
-
var _this = this;
|
|
33
|
-
this.mutableDisposable.value = new dockview_1.DockviewCompositeDisposable(this._group.model.onDidAddPanel(function () {
|
|
34
|
-
_this.updatePanels();
|
|
35
|
-
}), this._group.model.onDidRemovePanel(function () {
|
|
36
|
-
_this.updatePanels();
|
|
37
|
-
}), this._group.model.onDidActivePanelChange(function () {
|
|
38
|
-
_this.updateActivePanel();
|
|
39
|
-
}), parameters.api.onDidActiveChange(function () {
|
|
40
|
-
_this.updateGroupActive();
|
|
41
|
-
}), parameters.api.onDidLocationChange(function (event) {
|
|
42
|
-
_this.updateLocation(event.location);
|
|
43
|
-
}));
|
|
44
|
-
this._part = new react_1.ReactPart(this.element, this.reactPortalStore, this.component, {
|
|
45
|
-
api: parameters.api,
|
|
46
|
-
containerApi: parameters.containerApi,
|
|
47
|
-
panels: this._group.model.panels,
|
|
48
|
-
activePanel: this._group.model.activePanel,
|
|
49
|
-
isGroupActive: this._group.api.isActive,
|
|
50
|
-
group: this._group,
|
|
51
|
-
headerPosition: this._group.model.headerPosition,
|
|
52
|
-
location: parameters.api.location,
|
|
53
|
-
});
|
|
54
|
-
};
|
|
55
|
-
ReactHeaderActionsRendererPart.prototype.dispose = function () {
|
|
56
|
-
var _a;
|
|
57
|
-
this.mutableDisposable.dispose();
|
|
58
|
-
(_a = this._part) === null || _a === void 0 ? void 0 : _a.dispose();
|
|
59
|
-
};
|
|
60
|
-
ReactHeaderActionsRendererPart.prototype.update = function (event) {
|
|
61
|
-
var _a;
|
|
62
|
-
(_a = this._part) === null || _a === void 0 ? void 0 : _a.update(event.params);
|
|
63
|
-
};
|
|
64
|
-
ReactHeaderActionsRendererPart.prototype.updatePanels = function () {
|
|
65
|
-
this.update({ params: { panels: this._group.model.panels } });
|
|
66
|
-
};
|
|
67
|
-
ReactHeaderActionsRendererPart.prototype.updateActivePanel = function () {
|
|
68
|
-
this.update({
|
|
69
|
-
params: {
|
|
70
|
-
activePanel: this._group.model.activePanel,
|
|
71
|
-
},
|
|
72
|
-
});
|
|
73
|
-
};
|
|
74
|
-
ReactHeaderActionsRendererPart.prototype.updateGroupActive = function () {
|
|
75
|
-
this.update({
|
|
76
|
-
params: {
|
|
77
|
-
isGroupActive: this._group.api.isActive,
|
|
78
|
-
},
|
|
79
|
-
});
|
|
80
|
-
};
|
|
81
|
-
ReactHeaderActionsRendererPart.prototype.updateLocation = function (location) {
|
|
82
|
-
this.update({ params: { location: location } });
|
|
83
|
-
};
|
|
84
|
-
return ReactHeaderActionsRendererPart;
|
|
85
|
-
}());
|
|
86
|
-
exports.ReactHeaderActionsRendererPart = ReactHeaderActionsRendererPart;
|