flexlayout-react 0.7.3 → 0.7.4
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/ChangeLog.txt +4 -0
- package/declarations/view/Icons.d.ts +1 -0
- package/dist/flexlayout.js +96 -184
- package/dist/flexlayout_min.js +1 -1
- package/lib/Attribute.js +12 -17
- package/lib/Attribute.js.map +1 -1
- package/lib/AttributeDefinitions.js +44 -53
- package/lib/AttributeDefinitions.js.map +1 -1
- package/lib/DockLocation.js +41 -46
- package/lib/DockLocation.js.map +1 -1
- package/lib/DragDrop.js +55 -60
- package/lib/DragDrop.js.map +1 -1
- package/lib/DropInfo.js +3 -8
- package/lib/DropInfo.js.map +1 -1
- package/lib/I18nLabel.js +2 -5
- package/lib/I18nLabel.js.map +1 -1
- package/lib/Orientation.js +11 -16
- package/lib/Orientation.js.map +1 -1
- package/lib/PopupMenu.js +24 -28
- package/lib/PopupMenu.js.map +1 -1
- package/lib/Rect.js +35 -41
- package/lib/Rect.js.map +1 -1
- package/lib/Types.js +2 -5
- package/lib/Types.js.map +1 -1
- package/lib/index.js +22 -38
- package/lib/index.js.map +1 -1
- package/lib/model/Action.js +3 -8
- package/lib/model/Action.js.map +1 -1
- package/lib/model/Actions.js +68 -75
- package/lib/model/Actions.js.map +1 -1
- package/lib/model/BorderNode.js +183 -206
- package/lib/model/BorderNode.js.map +1 -1
- package/lib/model/BorderSet.js +44 -55
- package/lib/model/BorderSet.js.map +1 -1
- package/lib/model/ICloseType.js +2 -5
- package/lib/model/ICloseType.js.map +1 -1
- package/lib/model/IDraggable.js +1 -2
- package/lib/model/IDropTarget.js +1 -2
- package/lib/model/IJsonModel.js +1 -2
- package/lib/model/Model.js +217 -232
- package/lib/model/Model.js.map +1 -1
- package/lib/model/Node.js +87 -94
- package/lib/model/Node.js.map +1 -1
- package/lib/model/RowNode.js +204 -250
- package/lib/model/RowNode.js.map +1 -1
- package/lib/model/SplitterNode.js +35 -57
- package/lib/model/SplitterNode.js.map +1 -1
- package/lib/model/TabNode.js +100 -124
- package/lib/model/TabNode.js.map +1 -1
- package/lib/model/TabSetNode.js +176 -199
- package/lib/model/TabSetNode.js.map +1 -1
- package/lib/model/Utils.js +20 -26
- package/lib/model/Utils.js.map +1 -1
- package/lib/view/BorderButton.js +45 -49
- package/lib/view/BorderButton.js.map +1 -1
- package/lib/view/BorderTabSet.js +57 -61
- package/lib/view/BorderTabSet.js.map +1 -1
- package/lib/view/ErrorBoundary.js +15 -37
- package/lib/view/ErrorBoundary.js.map +1 -1
- package/lib/view/FloatingWindow.js +43 -56
- package/lib/view/FloatingWindow.js.map +1 -1
- package/lib/view/FloatingWindowTab.js +12 -16
- package/lib/view/FloatingWindowTab.js.map +1 -1
- package/lib/view/Icons.js +7 -15
- package/lib/view/Icons.js.map +1 -1
- package/lib/view/Layout.js +392 -449
- package/lib/view/Layout.js.map +1 -1
- package/lib/view/Splitter.js +53 -57
- package/lib/view/Splitter.js.map +1 -1
- package/lib/view/Tab.js +31 -35
- package/lib/view/Tab.js.map +1 -1
- package/lib/view/TabButton.js +46 -50
- package/lib/view/TabButton.js.map +1 -1
- package/lib/view/TabButtonStamp.js +11 -15
- package/lib/view/TabButtonStamp.js.map +1 -1
- package/lib/view/TabFloating.js +30 -34
- package/lib/view/TabFloating.js.map +1 -1
- package/lib/view/TabOverflowHook.js +46 -50
- package/lib/view/TabOverflowHook.js.map +1 -1
- package/lib/view/TabSet.js +93 -106
- package/lib/view/TabSet.js.map +1 -1
- package/lib/view/Utils.js +11 -17
- package/lib/view/Utils.js.map +1 -1
- package/package.json +1 -1
- package/src/view/FloatingWindow.tsx +5 -1
- package/src/view/Layout.tsx +1 -5
package/lib/view/TabButton.js
CHANGED
|
@@ -1,57 +1,54 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
var ICloseType_1 = require("../model/ICloseType");
|
|
9
|
-
var Types_1 = require("../Types");
|
|
10
|
-
var Utils_1 = require("./Utils");
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { I18nLabel } from "../I18nLabel";
|
|
3
|
+
import { Actions } from "../model/Actions";
|
|
4
|
+
import { Rect } from "../Rect";
|
|
5
|
+
import { ICloseType } from "../model/ICloseType";
|
|
6
|
+
import { CLASSES } from "../Types";
|
|
7
|
+
import { getRenderStateEx, isAuxMouseEvent } from "./Utils";
|
|
11
8
|
/** @internal */
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
if (!
|
|
9
|
+
export const TabButton = (props) => {
|
|
10
|
+
const { layout, node, selected, iconFactory, titleFactory, icons, path } = props;
|
|
11
|
+
const selfRef = React.useRef(null);
|
|
12
|
+
const contentRef = React.useRef(null);
|
|
13
|
+
const onMouseDown = (event) => {
|
|
14
|
+
if (!isAuxMouseEvent(event) && !layout.getEditingTab()) {
|
|
18
15
|
layout.dragStart(event, undefined, node, node.isEnableDrag(), onClick, onDoubleClick);
|
|
19
16
|
}
|
|
20
17
|
};
|
|
21
|
-
|
|
22
|
-
if (
|
|
18
|
+
const onAuxMouseClick = (event) => {
|
|
19
|
+
if (isAuxMouseEvent(event)) {
|
|
23
20
|
layout.auxMouseClick(node, event);
|
|
24
21
|
}
|
|
25
22
|
};
|
|
26
|
-
|
|
23
|
+
const onContextMenu = (event) => {
|
|
27
24
|
layout.showContextMenu(node, event);
|
|
28
25
|
};
|
|
29
|
-
|
|
30
|
-
layout.doAction(
|
|
26
|
+
const onClick = () => {
|
|
27
|
+
layout.doAction(Actions.selectTab(node.getId()));
|
|
31
28
|
};
|
|
32
|
-
|
|
29
|
+
const onDoubleClick = (event) => {
|
|
33
30
|
if (node.isEnableRename()) {
|
|
34
31
|
onRename();
|
|
35
32
|
}
|
|
36
33
|
};
|
|
37
|
-
|
|
34
|
+
const onRename = () => {
|
|
38
35
|
layout.setEditingTab(node);
|
|
39
36
|
layout.getCurrentDocument().body.addEventListener("mousedown", onEndEdit);
|
|
40
37
|
layout.getCurrentDocument().body.addEventListener("touchstart", onEndEdit);
|
|
41
38
|
};
|
|
42
|
-
|
|
39
|
+
const onEndEdit = (event) => {
|
|
43
40
|
if (event.target !== contentRef.current) {
|
|
44
41
|
layout.getCurrentDocument().body.removeEventListener("mousedown", onEndEdit);
|
|
45
42
|
layout.getCurrentDocument().body.removeEventListener("touchstart", onEndEdit);
|
|
46
43
|
layout.setEditingTab(undefined);
|
|
47
44
|
}
|
|
48
45
|
};
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
if (selected || closeType ===
|
|
46
|
+
const isClosable = () => {
|
|
47
|
+
const closeType = node.getCloseType();
|
|
48
|
+
if (selected || closeType === ICloseType.Always) {
|
|
52
49
|
return true;
|
|
53
50
|
}
|
|
54
|
-
if (closeType ===
|
|
51
|
+
if (closeType === ICloseType.Visible) {
|
|
55
52
|
// not selected but x should be visible due to hover
|
|
56
53
|
if (window.matchMedia && window.matchMedia("(hover: hover) and (pointer: fine)").matches) {
|
|
57
54
|
return true;
|
|
@@ -59,34 +56,34 @@ var TabButton = function (props) {
|
|
|
59
56
|
}
|
|
60
57
|
return false;
|
|
61
58
|
};
|
|
62
|
-
|
|
59
|
+
const onClose = (event) => {
|
|
63
60
|
if (isClosable()) {
|
|
64
|
-
layout.doAction(
|
|
61
|
+
layout.doAction(Actions.deleteTab(node.getId()));
|
|
65
62
|
}
|
|
66
63
|
else {
|
|
67
64
|
onClick();
|
|
68
65
|
}
|
|
69
66
|
};
|
|
70
|
-
|
|
67
|
+
const onCloseMouseDown = (event) => {
|
|
71
68
|
event.stopPropagation();
|
|
72
69
|
};
|
|
73
|
-
React.useLayoutEffect(
|
|
70
|
+
React.useLayoutEffect(() => {
|
|
74
71
|
updateRect();
|
|
75
72
|
if (layout.getEditingTab() === node) {
|
|
76
73
|
contentRef.current.select();
|
|
77
74
|
}
|
|
78
75
|
});
|
|
79
|
-
|
|
76
|
+
const updateRect = () => {
|
|
80
77
|
// record position of tab in node
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
node._setTabRect(new
|
|
78
|
+
const layoutRect = layout.getDomRect();
|
|
79
|
+
const r = selfRef.current.getBoundingClientRect();
|
|
80
|
+
node._setTabRect(new Rect(r.left - layoutRect.left, r.top - layoutRect.top, r.width, r.height));
|
|
84
81
|
};
|
|
85
|
-
|
|
82
|
+
const onTextBoxMouseDown = (event) => {
|
|
86
83
|
// console.log("onTextBoxMouseDown");
|
|
87
84
|
event.stopPropagation();
|
|
88
85
|
};
|
|
89
|
-
|
|
86
|
+
const onTextBoxKeyPress = (event) => {
|
|
90
87
|
// console.log(event, event.keyCode);
|
|
91
88
|
if (event.keyCode === 27) {
|
|
92
89
|
// esc
|
|
@@ -95,13 +92,13 @@ var TabButton = function (props) {
|
|
|
95
92
|
else if (event.keyCode === 13) {
|
|
96
93
|
// enter
|
|
97
94
|
layout.setEditingTab(undefined);
|
|
98
|
-
layout.doAction(
|
|
95
|
+
layout.doAction(Actions.renameTab(node.getId(), event.target.value));
|
|
99
96
|
}
|
|
100
97
|
};
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
98
|
+
const cm = layout.getClassName;
|
|
99
|
+
const parentNode = node.getParent();
|
|
100
|
+
let baseClassName = CLASSES.FLEXLAYOUT__TAB_BUTTON;
|
|
101
|
+
let classNames = cm(baseClassName);
|
|
105
102
|
classNames += " " + cm(baseClassName + "_" + parentNode.getTabLocation());
|
|
106
103
|
if (selected) {
|
|
107
104
|
classNames += " " + cm(baseClassName + "--selected");
|
|
@@ -112,20 +109,19 @@ var TabButton = function (props) {
|
|
|
112
109
|
if (node.getClassName() !== undefined) {
|
|
113
110
|
classNames += " " + node.getClassName();
|
|
114
111
|
}
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
112
|
+
const renderState = getRenderStateEx(layout, node, iconFactory, titleFactory);
|
|
113
|
+
let content = renderState.content ? (React.createElement("div", { className: cm(CLASSES.FLEXLAYOUT__TAB_BUTTON_CONTENT) }, renderState.content)) : null;
|
|
114
|
+
const leading = renderState.leading ? (React.createElement("div", { className: cm(CLASSES.FLEXLAYOUT__TAB_BUTTON_LEADING) }, renderState.leading)) : null;
|
|
118
115
|
if (layout.getEditingTab() === node) {
|
|
119
|
-
content = (React.createElement("input", { ref: contentRef, className: cm(
|
|
116
|
+
content = (React.createElement("input", { ref: contentRef, className: cm(CLASSES.FLEXLAYOUT__TAB_BUTTON_TEXTBOX), "data-layout-path": path + "/textbox", type: "text", autoFocus: true, defaultValue: node.getName(), onKeyDown: onTextBoxKeyPress, onMouseDown: onTextBoxMouseDown, onTouchStart: onTextBoxMouseDown }));
|
|
120
117
|
}
|
|
121
118
|
if (node.isEnableClose()) {
|
|
122
|
-
|
|
123
|
-
renderState.buttons.push(React.createElement("div", { key: "close", "data-layout-path": path + "/button/close", title: closeTitle, className: cm(
|
|
119
|
+
const closeTitle = layout.i18nName(I18nLabel.Close_Tab);
|
|
120
|
+
renderState.buttons.push(React.createElement("div", { key: "close", "data-layout-path": path + "/button/close", title: closeTitle, className: cm(CLASSES.FLEXLAYOUT__TAB_BUTTON_TRAILING), onMouseDown: onCloseMouseDown, onClick: onClose, onTouchStart: onCloseMouseDown }, (typeof icons.close === "function") ? icons.close(node) : icons.close));
|
|
124
121
|
}
|
|
125
122
|
return (React.createElement("div", { ref: selfRef, "data-layout-path": path, className: classNames, onMouseDown: onMouseDown, onClick: onAuxMouseClick, onAuxClick: onAuxMouseClick, onContextMenu: onContextMenu, onTouchStart: onMouseDown, title: node.getHelpText() },
|
|
126
123
|
leading,
|
|
127
124
|
content,
|
|
128
125
|
renderState.buttons));
|
|
129
126
|
};
|
|
130
|
-
exports.TabButton = TabButton;
|
|
131
127
|
//# sourceMappingURL=TabButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabButton.js","sourceRoot":"","sources":["../../src/view/TabButton.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TabButton.js","sourceRoot":"","sources":["../../src/view/TabButton.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,22 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var React = require("react");
|
|
5
|
-
var Types_1 = require("../Types");
|
|
6
|
-
var Utils_1 = require("./Utils");
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { CLASSES } from "../Types";
|
|
3
|
+
import { getRenderStateEx } from "./Utils";
|
|
7
4
|
/** @internal */
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
5
|
+
export const TabButtonStamp = (props) => {
|
|
6
|
+
const { layout, node, iconFactory, titleFactory } = props;
|
|
7
|
+
const selfRef = React.useRef(null);
|
|
8
|
+
const cm = layout.getClassName;
|
|
9
|
+
let classNames = cm(CLASSES.FLEXLAYOUT__TAB_BUTTON_STAMP);
|
|
10
|
+
const renderState = getRenderStateEx(layout, node, iconFactory, titleFactory);
|
|
11
|
+
let content = renderState.content ? (React.createElement("div", { className: cm(CLASSES.FLEXLAYOUT__TAB_BUTTON_CONTENT) }, renderState.content))
|
|
15
12
|
: node._getNameForOverflowMenu();
|
|
16
|
-
|
|
13
|
+
const leading = renderState.leading ? (React.createElement("div", { className: cm(CLASSES.FLEXLAYOUT__TAB_BUTTON_LEADING) }, renderState.leading)) : null;
|
|
17
14
|
return (React.createElement("div", { ref: selfRef, className: classNames, title: node.getHelpText() },
|
|
18
15
|
leading,
|
|
19
16
|
content));
|
|
20
17
|
};
|
|
21
|
-
exports.TabButtonStamp = TabButtonStamp;
|
|
22
18
|
//# sourceMappingURL=TabButtonStamp.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabButtonStamp.js","sourceRoot":"","sources":["../../src/view/TabButtonStamp.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TabButtonStamp.js","sourceRoot":"","sources":["../../src/view/TabButtonStamp.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAU3C,gBAAgB;AAChB,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,KAA2B,EAAE,EAAE;IAC1D,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,KAAK,CAAC;IAC1D,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAwB,IAAI,CAAC,CAAC;IAE1D,MAAM,EAAE,GAAG,MAAM,CAAC,YAAY,CAAC;IAE/B,IAAI,UAAU,GAAG,EAAE,CAAC,OAAO,CAAC,4BAA4B,CAAC,CAAC;IAE1D,MAAM,WAAW,GAAG,gBAAgB,CAAC,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,YAAY,CAAC,CAAC;IAE9E,IAAI,OAAO,GAAG,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,CAChC,6BAAK,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,8BAA8B,CAAC,IACrD,WAAW,CAAC,OAAO,CAClB,CAAC;QACP,CAAC,CAAC,IAAI,CAAC,uBAAuB,EAAE,CAAC;IAErC,MAAM,OAAO,GAAG,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,CAClC,6BAAK,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,8BAA8B,CAAC,IACrD,WAAW,CAAC,OAAO,CAClB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAEnB,OAAO,CACH,6BACI,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,UAAU,EACrB,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE;QAExB,OAAO;QACP,OAAO,CACN,CACT,CAAC;AACN,CAAC,CAAC"}
|
package/lib/view/TabFloating.js
CHANGED
|
@@ -1,60 +1,57 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
var Types_1 = require("../Types");
|
|
8
|
-
var I18nLabel_1 = require("../I18nLabel");
|
|
9
|
-
var Utils_1 = require("./Utils");
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { Actions } from "../model/Actions";
|
|
3
|
+
import { TabSetNode } from "../model/TabSetNode";
|
|
4
|
+
import { CLASSES } from "../Types";
|
|
5
|
+
import { I18nLabel } from "../I18nLabel";
|
|
6
|
+
import { hideElement } from "./Utils";
|
|
10
7
|
/** @internal */
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
8
|
+
export const TabFloating = (props) => {
|
|
9
|
+
const { layout, selected, node, path } = props;
|
|
10
|
+
const showPopout = () => {
|
|
14
11
|
if (node.getWindow()) {
|
|
15
12
|
node.getWindow().focus();
|
|
16
13
|
}
|
|
17
14
|
};
|
|
18
|
-
|
|
19
|
-
layout.doAction(
|
|
15
|
+
const dockPopout = () => {
|
|
16
|
+
layout.doAction(Actions.unFloatTab(node.getId()));
|
|
20
17
|
};
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
if (parent.getType() ===
|
|
18
|
+
const onMouseDown = () => {
|
|
19
|
+
const parent = node.getParent();
|
|
20
|
+
if (parent.getType() === TabSetNode.TYPE) {
|
|
24
21
|
if (!parent.isActive()) {
|
|
25
|
-
layout.doAction(
|
|
22
|
+
layout.doAction(Actions.setActiveTabset(parent.getId()));
|
|
26
23
|
}
|
|
27
24
|
}
|
|
28
25
|
};
|
|
29
|
-
|
|
26
|
+
const onClickFocus = (event) => {
|
|
30
27
|
event.preventDefault();
|
|
31
28
|
showPopout();
|
|
32
29
|
};
|
|
33
|
-
|
|
30
|
+
const onClickDock = (event) => {
|
|
34
31
|
event.preventDefault();
|
|
35
32
|
dockPopout();
|
|
36
33
|
};
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
34
|
+
const cm = layout.getClassName;
|
|
35
|
+
const parentNode = node.getParent();
|
|
36
|
+
const style = node._styleWithPosition();
|
|
40
37
|
if (!selected) {
|
|
41
|
-
|
|
38
|
+
hideElement(style, node.getModel().isUseVisibility());
|
|
42
39
|
}
|
|
43
|
-
if (parentNode instanceof
|
|
40
|
+
if (parentNode instanceof TabSetNode) {
|
|
44
41
|
if (node.getModel().getMaximizedTabset() !== undefined && !parentNode.isMaximized()) {
|
|
45
|
-
|
|
42
|
+
hideElement(style, node.getModel().isUseVisibility());
|
|
46
43
|
}
|
|
47
44
|
}
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
45
|
+
const message = layout.i18nName(I18nLabel.Floating_Window_Message);
|
|
46
|
+
const showMessage = layout.i18nName(I18nLabel.Floating_Window_Show_Window);
|
|
47
|
+
const dockMessage = layout.i18nName(I18nLabel.Floating_Window_Dock_Window);
|
|
48
|
+
const customRenderCallback = layout.getOnRenderFloatingTabPlaceholder();
|
|
52
49
|
if (customRenderCallback) {
|
|
53
|
-
return (React.createElement("div", { className: cm(
|
|
50
|
+
return (React.createElement("div", { className: cm(CLASSES.FLEXLAYOUT__TAB_FLOATING), onMouseDown: onMouseDown, onTouchStart: onMouseDown, style: style }, customRenderCallback(dockPopout, showPopout)));
|
|
54
51
|
}
|
|
55
52
|
else {
|
|
56
|
-
return (React.createElement("div", { className: cm(
|
|
57
|
-
React.createElement("div", { className: cm(
|
|
53
|
+
return (React.createElement("div", { className: cm(CLASSES.FLEXLAYOUT__TAB_FLOATING), "data-layout-path": path, onMouseDown: onMouseDown, onTouchStart: onMouseDown, style: style },
|
|
54
|
+
React.createElement("div", { className: cm(CLASSES.FLEXLAYOUT__TAB_FLOATING_INNER) },
|
|
58
55
|
React.createElement("div", null, message),
|
|
59
56
|
React.createElement("div", null,
|
|
60
57
|
React.createElement("a", { href: "#", onClick: onClickFocus }, showMessage)),
|
|
@@ -62,5 +59,4 @@ var TabFloating = function (props) {
|
|
|
62
59
|
React.createElement("a", { href: "#", onClick: onClickDock }, dockMessage)))));
|
|
63
60
|
}
|
|
64
61
|
};
|
|
65
|
-
exports.TabFloating = TabFloating;
|
|
66
62
|
//# sourceMappingURL=TabFloating.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabFloating.js","sourceRoot":"","sources":["../../src/view/TabFloating.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TabFloating.js","sourceRoot":"","sources":["../../src/view/TabFloating.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,78 +1,75 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var Rect_1 = require("../Rect");
|
|
6
|
-
var TabSetNode_1 = require("../model/TabSetNode");
|
|
7
|
-
var Orientation_1 = require("../Orientation");
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { Rect } from "../Rect";
|
|
3
|
+
import { TabSetNode } from "../model/TabSetNode";
|
|
4
|
+
import { Orientation } from "../Orientation";
|
|
8
5
|
/** @internal */
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
6
|
+
export const useTabOverflow = (node, orientation, toolbarRef, stickyButtonsRef) => {
|
|
7
|
+
const firstRender = React.useRef(true);
|
|
8
|
+
const tabsTruncated = React.useRef(false);
|
|
9
|
+
const lastRect = React.useRef(new Rect(0, 0, 0, 0));
|
|
10
|
+
const selfRef = React.useRef(null);
|
|
11
|
+
const [position, setPosition] = React.useState(0);
|
|
12
|
+
const userControlledLeft = React.useRef(false);
|
|
13
|
+
const [hiddenTabs, setHiddenTabs] = React.useState([]);
|
|
14
|
+
const lastHiddenCount = React.useRef(0);
|
|
18
15
|
// if selected node or tabset/border rectangle change then unset usercontrolled (so selected tab will be kept in view)
|
|
19
|
-
React.useLayoutEffect(
|
|
16
|
+
React.useLayoutEffect(() => {
|
|
20
17
|
userControlledLeft.current = false;
|
|
21
18
|
}, [node.getSelectedNode(), node.getRect().width, node.getRect().height]);
|
|
22
|
-
React.useLayoutEffect(
|
|
19
|
+
React.useLayoutEffect(() => {
|
|
23
20
|
updateVisibleTabs();
|
|
24
21
|
});
|
|
25
|
-
React.useEffect(
|
|
26
|
-
|
|
22
|
+
React.useEffect(() => {
|
|
23
|
+
const instance = selfRef.current;
|
|
27
24
|
instance.addEventListener('wheel', onWheel, { passive: false });
|
|
28
|
-
return
|
|
25
|
+
return () => {
|
|
29
26
|
instance.removeEventListener('wheel', onWheel);
|
|
30
27
|
};
|
|
31
28
|
}, []);
|
|
32
29
|
// needed to prevent default mouse wheel over tabset/border (cannot do with react event?)
|
|
33
|
-
|
|
30
|
+
const onWheel = (event) => {
|
|
34
31
|
event.preventDefault();
|
|
35
32
|
};
|
|
36
|
-
|
|
37
|
-
if (orientation ===
|
|
33
|
+
const getNear = (rect) => {
|
|
34
|
+
if (orientation === Orientation.HORZ) {
|
|
38
35
|
return rect.x;
|
|
39
36
|
}
|
|
40
37
|
else {
|
|
41
38
|
return rect.y;
|
|
42
39
|
}
|
|
43
40
|
};
|
|
44
|
-
|
|
45
|
-
if (orientation ===
|
|
41
|
+
const getFar = (rect) => {
|
|
42
|
+
if (orientation === Orientation.HORZ) {
|
|
46
43
|
return rect.getRight();
|
|
47
44
|
}
|
|
48
45
|
else {
|
|
49
46
|
return rect.getBottom();
|
|
50
47
|
}
|
|
51
48
|
};
|
|
52
|
-
|
|
53
|
-
if (orientation ===
|
|
49
|
+
const getSize = (rect) => {
|
|
50
|
+
if (orientation === Orientation.HORZ) {
|
|
54
51
|
return rect.width;
|
|
55
52
|
}
|
|
56
53
|
else {
|
|
57
54
|
return rect.height;
|
|
58
55
|
}
|
|
59
56
|
};
|
|
60
|
-
|
|
61
|
-
|
|
57
|
+
const updateVisibleTabs = () => {
|
|
58
|
+
const tabMargin = 2;
|
|
62
59
|
if (firstRender.current === true) {
|
|
63
60
|
tabsTruncated.current = false;
|
|
64
61
|
}
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
62
|
+
const nodeRect = node instanceof TabSetNode ? node.getRect() : node.getTabHeaderRect();
|
|
63
|
+
let lastChild = node.getChildren()[node.getChildren().length - 1];
|
|
64
|
+
const stickyButtonsSize = stickyButtonsRef.current === null ? 0 : getSize(stickyButtonsRef.current.getBoundingClientRect());
|
|
68
65
|
if (firstRender.current === true ||
|
|
69
66
|
(lastHiddenCount.current === 0 && hiddenTabs.length !== 0) ||
|
|
70
67
|
nodeRect.width !== lastRect.current.width || // incase rect changed between first render and second
|
|
71
68
|
nodeRect.height !== lastRect.current.height) {
|
|
72
69
|
lastHiddenCount.current = hiddenTabs.length;
|
|
73
70
|
lastRect.current = nodeRect;
|
|
74
|
-
|
|
75
|
-
|
|
71
|
+
const enabled = node instanceof TabSetNode ? node.isEnableTabStrip() === true : true;
|
|
72
|
+
let endPos = getFar(nodeRect) - stickyButtonsSize;
|
|
76
73
|
if (toolbarRef.current !== null) {
|
|
77
74
|
endPos -= getSize(toolbarRef.current.getBoundingClientRect());
|
|
78
75
|
}
|
|
@@ -80,12 +77,12 @@ var useTabOverflow = function (node, orientation, toolbarRef, stickyButtonsRef)
|
|
|
80
77
|
if (hiddenTabs.length === 0 && position === 0 && getFar(lastChild.getTabRect()) + tabMargin < endPos) {
|
|
81
78
|
return; // nothing to do all tabs are shown in available space
|
|
82
79
|
}
|
|
83
|
-
|
|
84
|
-
|
|
80
|
+
let shiftPos = 0;
|
|
81
|
+
const selectedTab = node.getSelectedNode();
|
|
85
82
|
if (selectedTab && !userControlledLeft.current) {
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
83
|
+
const selectedRect = selectedTab.getTabRect();
|
|
84
|
+
const selectedStart = getNear(selectedRect) - tabMargin;
|
|
85
|
+
const selectedEnd = getFar(selectedRect) + tabMargin;
|
|
89
86
|
// when selected tab is larger than available space then align left
|
|
90
87
|
if (getSize(selectedRect) + 2 * tabMargin >= endPos - getNear(nodeRect)) {
|
|
91
88
|
shiftPos = getNear(nodeRect) - selectedStart;
|
|
@@ -102,13 +99,13 @@ var useTabOverflow = function (node, orientation, toolbarRef, stickyButtonsRef)
|
|
|
102
99
|
}
|
|
103
100
|
}
|
|
104
101
|
}
|
|
105
|
-
|
|
106
|
-
|
|
102
|
+
const extraSpace = Math.max(0, endPos - (getFar(lastChild.getTabRect()) + tabMargin + shiftPos));
|
|
103
|
+
const newPosition = Math.min(0, position + shiftPos + extraSpace);
|
|
107
104
|
// find hidden tabs
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
for (
|
|
111
|
-
|
|
105
|
+
const diff = newPosition - position;
|
|
106
|
+
const hidden = [];
|
|
107
|
+
for (let i = 0; i < node.getChildren().length; i++) {
|
|
108
|
+
const child = node.getChildren()[i];
|
|
112
109
|
if (getNear(child.getTabRect()) + diff < getNear(nodeRect) || getFar(child.getTabRect()) + diff > endPos) {
|
|
113
110
|
hidden.push({ node: child, index: i });
|
|
114
111
|
}
|
|
@@ -125,8 +122,8 @@ var useTabOverflow = function (node, orientation, toolbarRef, stickyButtonsRef)
|
|
|
125
122
|
firstRender.current = true;
|
|
126
123
|
}
|
|
127
124
|
};
|
|
128
|
-
|
|
129
|
-
|
|
125
|
+
const onMouseWheel = (event) => {
|
|
126
|
+
let delta = 0;
|
|
130
127
|
if (Math.abs(event.deltaX) > Math.abs(event.deltaY)) {
|
|
131
128
|
delta = -event.deltaX;
|
|
132
129
|
}
|
|
@@ -141,7 +138,6 @@ var useTabOverflow = function (node, orientation, toolbarRef, stickyButtonsRef)
|
|
|
141
138
|
userControlledLeft.current = true;
|
|
142
139
|
event.stopPropagation();
|
|
143
140
|
};
|
|
144
|
-
return { selfRef
|
|
141
|
+
return { selfRef, position, userControlledLeft, hiddenTabs, onMouseWheel, tabsTruncated: tabsTruncated.current };
|
|
145
142
|
};
|
|
146
|
-
exports.useTabOverflow = useTabOverflow;
|
|
147
143
|
//# sourceMappingURL=TabOverflowHook.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabOverflowHook.js","sourceRoot":"","sources":["../../src/view/TabOverflowHook.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TabOverflowHook.js","sourceRoot":"","sources":["../../src/view/TabOverflowHook.tsx"],"names":[],"mappings":"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"}
|