flexlayout-react 0.7.15 → 0.8.1
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 +28 -0
- package/README.md +157 -330
- package/Screenshot_light.png +0 -0
- package/Screenshot_rounded.png +0 -0
- package/declarations/Attribute.d.ts +1 -1
- package/declarations/AttributeDefinitions.d.ts +1 -1
- package/declarations/DockLocation.d.ts +12 -12
- package/declarations/DropInfo.d.ts +12 -12
- package/declarations/I18nLabel.d.ts +12 -14
- package/declarations/Orientation.d.ts +7 -7
- package/declarations/PopupMenu.d.ts +1 -1
- package/declarations/Rect.d.ts +41 -28
- package/declarations/Types.d.ts +95 -79
- package/declarations/examples/demo/Utils.d.ts +4 -0
- package/declarations/index.d.ts +21 -22
- package/declarations/model/Action.d.ts +5 -5
- package/declarations/model/Actions.d.ts +127 -110
- package/declarations/model/BorderNode.d.ts +30 -34
- package/declarations/model/BorderSet.d.ts +3 -4
- package/declarations/model/ICloseType.d.ts +5 -5
- package/declarations/model/IDraggable.d.ts +2 -2
- package/declarations/model/IDropTarget.d.ts +2 -2
- package/declarations/model/IJsonModel.d.ts +811 -149
- package/declarations/model/LayoutWindow.d.ts +28 -0
- package/declarations/model/Model.d.ts +91 -86
- package/declarations/model/Node.d.ts +17 -17
- package/declarations/model/RowNode.d.ts +10 -11
- package/declarations/model/TabNode.d.ts +44 -37
- package/declarations/model/TabSetNode.d.ts +44 -41
- package/declarations/model/Utils.d.ts +1 -1
- package/declarations/model/WindowLayout.d.ts +24 -0
- package/declarations/src/Attribute.d.ts +1 -0
- package/declarations/src/AttributeDefinitions.d.ts +1 -0
- package/declarations/src/DockLocation.d.ts +12 -0
- package/declarations/src/DropInfo.d.ts +12 -0
- package/declarations/src/I18nLabel.d.ts +10 -0
- package/declarations/src/Orientation.d.ts +7 -0
- package/declarations/src/PopupMenu.d.ts +1 -0
- package/declarations/src/Rect.d.ts +31 -0
- package/declarations/src/Types.d.ts +92 -0
- package/declarations/src/index.d.ts +20 -0
- package/declarations/src/model/Action.d.ts +5 -0
- package/declarations/src/model/Actions.d.ts +110 -0
- package/declarations/src/model/BorderNode.d.ts +28 -0
- package/declarations/src/model/BorderSet.d.ts +3 -0
- package/declarations/src/model/ICloseType.d.ts +5 -0
- package/declarations/src/model/IDraggable.d.ts +2 -0
- package/declarations/src/model/IDropTarget.d.ts +2 -0
- package/declarations/src/model/IJsonModel.d.ts +153 -0
- package/declarations/src/model/Model.d.ts +98 -0
- package/declarations/src/model/Node.d.ts +16 -0
- package/declarations/src/model/RowNode.d.ts +11 -0
- package/declarations/src/model/TabNode.d.ts +36 -0
- package/declarations/src/model/TabSetNode.d.ts +37 -0
- package/declarations/src/model/Utils.d.ts +1 -0
- package/declarations/src/view/BorderButton.d.ts +1 -0
- package/declarations/src/view/BorderTab.d.ts +2 -0
- package/declarations/src/view/BorderTabSet.d.ts +1 -0
- package/declarations/src/view/DragContainer.d.ts +1 -0
- package/declarations/src/view/ErrorBoundary.d.ts +1 -0
- package/declarations/src/view/FloatingWindow.d.ts +1 -0
- package/declarations/src/view/Icons.d.ts +7 -0
- package/declarations/src/view/Layout.d.ts +113 -0
- package/declarations/src/view/Overlay.d.ts +1 -0
- package/declarations/src/view/PopupMenu.d.ts +1 -0
- package/declarations/src/view/Row.d.ts +1 -0
- package/declarations/src/view/Splitter.d.ts +1 -0
- package/declarations/src/view/Tab.d.ts +1 -0
- package/declarations/src/view/TabButton.d.ts +1 -0
- package/declarations/src/view/TabButtonStamp.d.ts +1 -0
- package/declarations/src/view/TabOverflowHook.d.ts +1 -0
- package/declarations/src/view/TabSet.d.ts +1 -0
- package/declarations/src/view/Utils.d.ts +4 -0
- package/declarations/view/BorderButton.d.ts +1 -1
- package/declarations/view/BorderTab.d.ts +2 -0
- package/declarations/view/BorderTabSet.d.ts +1 -1
- package/declarations/view/DragContainer.d.ts +1 -0
- package/declarations/view/ErrorBoundary.d.ts +1 -1
- package/declarations/view/ExtendedResizeObserver.d.ts +23 -0
- package/declarations/view/FloatingWindow.d.ts +1 -1
- package/declarations/view/Icons.d.ts +8 -7
- package/declarations/view/Layout.d.ts +140 -161
- package/declarations/view/Overlay.d.ts +1 -0
- package/declarations/view/PopoutWindow.d.ts +1 -0
- package/declarations/view/PopupMenu.d.ts +1 -0
- package/declarations/view/Row.d.ts +1 -0
- package/declarations/view/SizeTracker.d.ts +10 -0
- package/declarations/view/Splitter.d.ts +1 -1
- package/declarations/view/Tab.d.ts +1 -1
- package/declarations/view/TabButton.d.ts +1 -1
- package/declarations/view/TabButtonStamp.d.ts +1 -1
- package/declarations/view/TabOverflowHook.d.ts +1 -1
- package/declarations/view/TabSet.d.ts +1 -1
- package/declarations/view/Utils.d.ts +11 -1
- package/dist/bundles/demo.js +232052 -0
- package/dist/bundles/demo.js.map +1 -0
- package/dist/flexlayout.js +122 -92
- package/dist/flexlayout_min.js +1 -1
- package/lib/Attribute.js +42 -31
- package/lib/Attribute.js.map +1 -1
- package/lib/AttributeDefinitions.js +131 -108
- package/lib/AttributeDefinitions.js.map +1 -1
- package/lib/DockLocation.js +120 -124
- package/lib/DockLocation.js.map +1 -1
- package/lib/DropInfo.js +9 -13
- package/lib/DropInfo.js.map +1 -1
- package/lib/I18nLabel.js +13 -18
- package/lib/I18nLabel.js.map +1 -1
- package/lib/Orientation.js +22 -26
- package/lib/Orientation.js.map +1 -1
- package/lib/Rect.js +104 -72
- package/lib/Rect.js.map +1 -1
- package/lib/Types.js +96 -83
- package/lib/Types.js.map +1 -1
- package/lib/index.js +21 -38
- package/lib/index.js.map +1 -1
- package/lib/model/Action.js +6 -10
- package/lib/model/Action.js.map +1 -1
- package/lib/model/Actions.js +169 -155
- package/lib/model/Actions.js.map +1 -1
- package/lib/model/BorderNode.js +385 -406
- package/lib/model/BorderNode.js.map +1 -1
- package/lib/model/BorderSet.js +66 -121
- package/lib/model/BorderSet.js.map +1 -1
- package/lib/model/ICloseType.js +6 -9
- 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/LayoutWindow.js +83 -0
- package/lib/model/LayoutWindow.js.map +1 -0
- package/lib/model/Model.js +614 -496
- package/lib/model/Model.js.map +1 -1
- package/lib/model/Node.js +217 -228
- package/lib/model/Node.js.map +1 -1
- package/lib/model/RowNode.js +491 -504
- package/lib/model/RowNode.js.map +1 -1
- package/lib/model/TabNode.js +289 -184
- package/lib/model/TabNode.js.map +1 -1
- package/lib/model/TabSetNode.js +459 -446
- package/lib/model/TabSetNode.js.map +1 -1
- package/lib/model/Utils.js +47 -82
- package/lib/model/Utils.js.map +1 -1
- package/lib/view/BorderButton.js +129 -138
- package/lib/view/BorderButton.js.map +1 -1
- package/lib/view/BorderTab.js +47 -0
- package/lib/view/BorderTab.js.map +1 -0
- package/lib/view/BorderTabSet.js +134 -128
- package/lib/view/BorderTabSet.js.map +1 -1
- package/lib/view/DragContainer.js +16 -0
- package/lib/view/DragContainer.js.map +1 -0
- package/lib/view/ErrorBoundary.js +23 -27
- package/lib/view/ErrorBoundary.js.map +1 -1
- package/lib/view/Icons.js +40 -45
- package/lib/view/Icons.js.map +1 -1
- package/lib/view/Layout.js +919 -907
- package/lib/view/Layout.js.map +1 -1
- package/lib/view/Overlay.js +9 -0
- package/lib/view/Overlay.js.map +1 -0
- package/lib/view/PopoutWindow.js +129 -0
- package/lib/view/PopoutWindow.js.map +1 -0
- package/lib/view/PopupMenu.js +71 -0
- package/lib/view/PopupMenu.js.map +1 -0
- package/lib/view/Row.js +45 -0
- package/lib/view/Row.js.map +1 -0
- package/lib/view/SizeTracker.js +11 -0
- package/lib/view/SizeTracker.js.map +1 -0
- package/lib/view/Splitter.js +191 -147
- package/lib/view/Splitter.js.map +1 -1
- package/lib/view/Tab.js +86 -60
- package/lib/view/Tab.js.map +1 -1
- package/lib/view/TabButton.js +127 -135
- package/lib/view/TabButton.js.map +1 -1
- package/lib/view/TabButtonStamp.js +16 -21
- package/lib/view/TabButtonStamp.js.map +1 -1
- package/lib/view/TabOverflowHook.js +150 -149
- package/lib/view/TabOverflowHook.js.map +1 -1
- package/lib/view/TabSet.js +272 -234
- package/lib/view/TabSet.js.map +1 -1
- package/lib/view/Utils.js +126 -68
- package/lib/view/Utils.js.map +1 -1
- package/package.json +36 -30
- package/src/Attribute.ts +23 -0
- package/src/AttributeDefinitions.ts +38 -15
- package/src/DockLocation.ts +13 -13
- package/src/I18nLabel.ts +7 -9
- package/src/Rect.ts +53 -1
- package/src/Types.ts +16 -0
- package/src/index.ts +1 -2
- package/src/model/Actions.ts +49 -29
- package/src/model/BorderNode.ts +208 -214
- package/src/model/BorderSet.ts +42 -91
- package/src/model/IJsonModel.ts +883 -103
- package/src/model/LayoutWindow.ts +121 -0
- package/src/model/Model.ts +488 -366
- package/src/model/Node.ts +98 -111
- package/src/model/RowNode.ts +323 -319
- package/src/model/TabNode.ts +294 -110
- package/src/model/TabSetNode.ts +303 -242
- package/src/model/Utils.ts +6 -32
- package/src/view/BorderButton.tsx +36 -52
- package/src/view/BorderTab.tsx +70 -0
- package/src/view/BorderTabSet.tsx +64 -52
- package/src/view/DragContainer.tsx +32 -0
- package/src/view/Icons.tsx +6 -0
- package/src/view/Layout.tsx +1053 -1046
- package/src/view/Overlay.tsx +22 -0
- package/src/view/PopoutWindow.tsx +152 -0
- package/src/{PopupMenu.tsx → view/PopupMenu.tsx} +36 -31
- package/src/view/Row.tsx +68 -0
- package/src/view/SizeTracker.tsx +20 -0
- package/src/view/Splitter.tsx +167 -112
- package/src/view/Tab.tsx +76 -42
- package/src/view/TabButton.tsx +39 -54
- package/src/view/TabButtonStamp.tsx +5 -9
- package/src/view/TabOverflowHook.tsx +14 -9
- package/src/view/TabSet.tsx +221 -176
- package/src/view/Utils.tsx +119 -39
- package/style/_base.scss +140 -34
- package/style/dark.css +140 -35
- package/style/dark.css.map +1 -1
- package/style/dark.scss +3 -1
- package/style/gray.css +139 -34
- package/style/gray.css.map +1 -1
- package/style/gray.scss +2 -0
- package/style/light.css +141 -36
- package/style/light.css.map +1 -1
- package/style/light.scss +4 -2
- package/style/rounded.css +697 -0
- package/style/rounded.css.map +1 -0
- package/style/rounded.scss +194 -0
- package/style/underline.css +139 -34
- package/style/underline.css.map +1 -1
- package/style/underline.scss +2 -0
- package/cypress.config.ts +0 -16
- package/lib/DragDrop.js +0 -316
- package/lib/DragDrop.js.map +0 -1
- package/lib/PopupMenu.js +0 -68
- package/lib/PopupMenu.js.map +0 -1
- package/lib/model/SplitterNode.js +0 -72
- package/lib/model/SplitterNode.js.map +0 -1
- package/lib/view/FloatingWindow.js +0 -123
- package/lib/view/FloatingWindow.js.map +0 -1
- package/lib/view/FloatingWindowTab.js +0 -19
- package/lib/view/FloatingWindowTab.js.map +0 -1
- package/lib/view/TabFloating.js +0 -66
- package/lib/view/TabFloating.js.map +0 -1
- package/src/DragDrop.ts +0 -392
- package/src/model/SplitterNode.ts +0 -78
- package/src/view/FloatingWindow.tsx +0 -140
- package/src/view/FloatingWindowTab.tsx +0 -29
- package/src/view/TabFloating.tsx +0 -101
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { I18nLabel } from "../I18nLabel";
|
|
3
|
+
import { Rect } from "../Rect";
|
|
4
|
+
import { Action } from "../model/Action";
|
|
5
|
+
import { BorderNode } from "../model/BorderNode";
|
|
6
|
+
import { IJsonTabNode } from "../model/IJsonModel";
|
|
7
|
+
import { Model } from "../model/Model";
|
|
8
|
+
import { Node } from "../model/Node";
|
|
9
|
+
import { TabNode } from "../model/TabNode";
|
|
10
|
+
import { TabSetNode } from "../model/TabSetNode";
|
|
11
|
+
export interface ILayoutProps {
|
|
12
|
+
model: Model;
|
|
13
|
+
factory: (node: TabNode) => React.ReactNode;
|
|
14
|
+
icons?: IIcons;
|
|
15
|
+
onAction?: (action: Action) => Action | undefined;
|
|
16
|
+
onRenderTab?: (node: TabNode, renderValues: ITabRenderValues) => void;
|
|
17
|
+
onRenderTabSet?: (tabSetNode: TabSetNode | BorderNode, renderValues: ITabSetRenderValues) => void;
|
|
18
|
+
onModelChange?: (model: Model, action: Action) => void;
|
|
19
|
+
onExternalDrag?: (event: React.DragEvent<HTMLElement>) => undefined | {
|
|
20
|
+
json: any;
|
|
21
|
+
onDrop?: (node?: Node, event?: React.DragEvent<HTMLElement>) => void;
|
|
22
|
+
};
|
|
23
|
+
classNameMapper?: (defaultClassName: string) => string;
|
|
24
|
+
i18nMapper?: (id: I18nLabel, param?: string) => string | undefined;
|
|
25
|
+
supportsPopout?: boolean | undefined;
|
|
26
|
+
popoutURL?: string | undefined;
|
|
27
|
+
realtimeResize?: boolean | undefined;
|
|
28
|
+
onRenderDragRect?: DragRectRenderCallback;
|
|
29
|
+
onContextMenu?: NodeMouseEvent;
|
|
30
|
+
onAuxMouseClick?: NodeMouseEvent;
|
|
31
|
+
onShowOverflowMenu?: ShowOverflowMenuCallback;
|
|
32
|
+
onTabSetPlaceHolder?: TabSetPlaceHolderCallback;
|
|
33
|
+
windowId?: string;
|
|
34
|
+
parentLayout?: Layout;
|
|
35
|
+
}
|
|
36
|
+
interface ILayoutState {
|
|
37
|
+
rect: Rect;
|
|
38
|
+
editingTab?: TabNode;
|
|
39
|
+
portal?: React.ReactPortal;
|
|
40
|
+
showEdges?: boolean;
|
|
41
|
+
showOverlay: boolean;
|
|
42
|
+
modelRevision: number;
|
|
43
|
+
}
|
|
44
|
+
/**
|
|
45
|
+
* A React component that hosts a multi-tabbed layout
|
|
46
|
+
*/
|
|
47
|
+
export declare class Layout extends React.Component<ILayoutProps, ILayoutState> {
|
|
48
|
+
constructor(props: ILayoutProps);
|
|
49
|
+
sortPortals(portals: Map<string, React.ReactNode>): React.ReactNode[];
|
|
50
|
+
renderEdgeIndicators(): React.ReactNode[];
|
|
51
|
+
renderWindows(): React.ReactNode[];
|
|
52
|
+
renderTabs(): {
|
|
53
|
+
portals: Map<string, React.ReactNode>;
|
|
54
|
+
tabStamps: React.ReactNode[];
|
|
55
|
+
};
|
|
56
|
+
renderHoistedTabs(): React.ReactNode[];
|
|
57
|
+
getFactory(): (node: TabNode) => React.ReactNode;
|
|
58
|
+
/**
|
|
59
|
+
* Adds a new tab to the given tabset
|
|
60
|
+
* @param tabsetId the id of the tabset where the new tab will be added
|
|
61
|
+
* @param json the json for the new tab node
|
|
62
|
+
* @returns the added tab node or undefined
|
|
63
|
+
*/
|
|
64
|
+
addTabToTabSet(tabsetId: string, json: IJsonTabNode): TabNode | undefined;
|
|
65
|
+
/**
|
|
66
|
+
* Adds a new tab to the active tabset (if there is one)
|
|
67
|
+
* @param json the json for the new tab node
|
|
68
|
+
* @returns the added tab node or undefined
|
|
69
|
+
*/
|
|
70
|
+
addTabToActiveTabSet(json: IJsonTabNode): TabNode | undefined;
|
|
71
|
+
getIcons: () => IIcons;
|
|
72
|
+
showOverlay(show: boolean): void;
|
|
73
|
+
setDraggingOverWindow(overWindow: boolean): void;
|
|
74
|
+
}
|
|
75
|
+
export type DragRectRenderCallback = (content: React.ReactElement | undefined, node?: Node, json?: IJsonTabNode) => React.ReactElement | undefined;
|
|
76
|
+
export type FloatingTabPlaceholderRenderCallback = (dockPopout: () => void, showPopout: () => void) => React.ReactElement | undefined;
|
|
77
|
+
export type NodeMouseEvent = (node: TabNode | TabSetNode | BorderNode, event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
|
78
|
+
export type ShowOverflowMenuCallback = (node: TabSetNode | BorderNode, mouseEvent: React.MouseEvent<HTMLElement, MouseEvent>, items: {
|
|
79
|
+
index: number;
|
|
80
|
+
node: TabNode;
|
|
81
|
+
}[], onSelect: (item: {
|
|
82
|
+
index: number;
|
|
83
|
+
node: TabNode;
|
|
84
|
+
}) => void) => void;
|
|
85
|
+
export type TabSetPlaceHolderCallback = (node: TabSetNode) => React.ReactNode;
|
|
86
|
+
export interface ITabSetRenderValues {
|
|
87
|
+
stickyButtons: React.ReactNode[];
|
|
88
|
+
buttons: React.ReactNode[];
|
|
89
|
+
overflowPosition: number | undefined;
|
|
90
|
+
}
|
|
91
|
+
export interface ITabRenderValues {
|
|
92
|
+
leading: React.ReactNode;
|
|
93
|
+
content: React.ReactNode;
|
|
94
|
+
name: string;
|
|
95
|
+
buttons: React.ReactNode[];
|
|
96
|
+
}
|
|
97
|
+
export interface ITitleObject {
|
|
98
|
+
titleContent: React.ReactNode;
|
|
99
|
+
name: string;
|
|
100
|
+
}
|
|
101
|
+
export interface IIcons {
|
|
102
|
+
close?: (React.ReactNode | ((tabNode: TabNode) => React.ReactNode));
|
|
103
|
+
closeTabset?: (React.ReactNode | ((tabSetNode: TabSetNode) => React.ReactNode));
|
|
104
|
+
popout?: (React.ReactNode | ((tabNode: TabNode) => React.ReactNode));
|
|
105
|
+
maximize?: (React.ReactNode | ((tabSetNode: TabSetNode) => React.ReactNode));
|
|
106
|
+
restore?: (React.ReactNode | ((tabSetNode: TabSetNode) => React.ReactNode));
|
|
107
|
+
more?: (React.ReactNode | ((tabSetNode: (TabSetNode | BorderNode), hiddenTabs: {
|
|
108
|
+
node: TabNode;
|
|
109
|
+
index: number;
|
|
110
|
+
}[]) => React.ReactNode));
|
|
111
|
+
edgeArrow?: React.ReactNode;
|
|
112
|
+
}
|
|
113
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
export declare function enablePointerOnIFrames(enable: boolean): void;
|
|
3
|
+
export declare function getElementsByTagName(tag: string): Element[];
|
|
4
|
+
export declare function startDrag(doc: Document, event: React.PointerEvent<HTMLElement>, drag: (x: number, y: number) => void, dragEnd: () => void, dragCancel: () => void): void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* This can be used to replace the global ResizeObserver with a proxy that
|
|
3
|
+
* will work in popout windows by listening to document resize instead
|
|
4
|
+
*
|
|
5
|
+
* To us it just include the following line:
|
|
6
|
+
*
|
|
7
|
+
* import "./ExtendedResizeObserver";
|
|
8
|
+
*
|
|
9
|
+
* Note: this code was written by chat gpt!
|
|
10
|
+
*/
|
|
11
|
+
declare const OriginalResizeObserver: {
|
|
12
|
+
new (callback: ResizeObserverCallback): ResizeObserver;
|
|
13
|
+
prototype: ResizeObserver;
|
|
14
|
+
};
|
|
15
|
+
interface ExtendedResizeObserver extends ResizeObserver {
|
|
16
|
+
__element?: Element;
|
|
17
|
+
__document?: Document;
|
|
18
|
+
__cleanup?: () => void;
|
|
19
|
+
}
|
|
20
|
+
declare const ResizeObserverProxy: {
|
|
21
|
+
new (callback: ResizeObserverCallback): ResizeObserver;
|
|
22
|
+
prototype: ResizeObserver;
|
|
23
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
export declare const CloseIcon: () => JSX.Element;
|
|
3
|
-
export declare const MaximizeIcon: () => JSX.Element;
|
|
4
|
-
export declare const OverflowIcon: () => JSX.Element;
|
|
5
|
-
export declare const EdgeIcon: () => JSX.Element;
|
|
6
|
-
export declare const PopoutIcon: () => JSX.Element;
|
|
7
|
-
export declare const RestoreIcon: () => JSX.Element;
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
export declare const CloseIcon: () => React.JSX.Element;
|
|
3
|
+
export declare const MaximizeIcon: () => React.JSX.Element;
|
|
4
|
+
export declare const OverflowIcon: () => React.JSX.Element;
|
|
5
|
+
export declare const EdgeIcon: () => React.JSX.Element;
|
|
6
|
+
export declare const PopoutIcon: () => React.JSX.Element;
|
|
7
|
+
export declare const RestoreIcon: () => React.JSX.Element;
|
|
8
|
+
export declare const AsterickIcon: () => React.JSX.Element;
|
|
@@ -1,161 +1,140 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import { Model } from "../model/Model";
|
|
7
|
-
import { Node } from "../model/Node";
|
|
8
|
-
import { TabNode } from "../model/TabNode";
|
|
9
|
-
import { TabSetNode } from "../model/TabSetNode";
|
|
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
|
-
|
|
39
|
-
|
|
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
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
export interface
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
/**
|
|
122
|
-
|
|
123
|
-
*/
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
* @param dragText the text to show on the drag panel
|
|
142
|
-
* @param json the json for the new tab node
|
|
143
|
-
* @param onDrop a callback to call when the drag is complete (node and event will be undefined if the drag was cancelled)
|
|
144
|
-
*/
|
|
145
|
-
addTabWithDragAndDrop(dragText: string | undefined, json: IJsonTabNode, onDrop?: (node?: Node, event?: Event) => void): void;
|
|
146
|
-
/**
|
|
147
|
-
* Move a tab/tabset using drag and drop
|
|
148
|
-
* @param node the tab or tabset to drag
|
|
149
|
-
* @param dragText the text to show on the drag panel
|
|
150
|
-
*/
|
|
151
|
-
moveTabWithDragAndDrop(node: (TabNode | TabSetNode), dragText?: string): void;
|
|
152
|
-
/**
|
|
153
|
-
* Adds a new tab by dragging a labeled panel to the drop location, dragging starts when you
|
|
154
|
-
* mouse down on the panel
|
|
155
|
-
*
|
|
156
|
-
* @param dragText the text to show on the drag panel
|
|
157
|
-
* @param json the json for the new tab node
|
|
158
|
-
* @param onDrop a callback to call when the drag is complete (node and event will be undefined if the drag was cancelled)
|
|
159
|
-
*/
|
|
160
|
-
addTabWithDragAndDropIndirect(dragText: string | undefined, json: IJsonTabNode, onDrop?: (node?: Node, event?: Event) => void): void;
|
|
161
|
-
}
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { I18nLabel } from "../I18nLabel";
|
|
3
|
+
import { Action } from "../model/Action";
|
|
4
|
+
import { BorderNode } from "../model/BorderNode";
|
|
5
|
+
import { IJsonTabNode } from "../model/IJsonModel";
|
|
6
|
+
import { Model } from "../model/Model";
|
|
7
|
+
import { Node } from "../model/Node";
|
|
8
|
+
import { TabNode } from "../model/TabNode";
|
|
9
|
+
import { TabSetNode } from "../model/TabSetNode";
|
|
10
|
+
export interface ILayoutProps {
|
|
11
|
+
/** the model for this layout */
|
|
12
|
+
model: Model;
|
|
13
|
+
/** factory function for creating the tab components */
|
|
14
|
+
factory: (node: TabNode) => React.ReactNode;
|
|
15
|
+
/** object mapping keys among close, maximize, restore, more, popout to React nodes to use in place of the default icons, can alternatively return functions for creating the React nodes */
|
|
16
|
+
icons?: IIcons;
|
|
17
|
+
/** function called whenever the layout generates an action to update the model (allows for intercepting actions before they are dispatched to the model, for example, asking the user to confirm a tab close.) Returning undefined from the function will halt the action, otherwise return the action to continue */
|
|
18
|
+
onAction?: (action: Action) => Action | undefined;
|
|
19
|
+
/** function called when rendering a tab, allows leading (icon), content section, buttons and name used in overflow menu to be customized */
|
|
20
|
+
onRenderTab?: (node: TabNode, renderValues: ITabRenderValues) => void;
|
|
21
|
+
/** function called when rendering a tabset, allows header and buttons to be customized */
|
|
22
|
+
onRenderTabSet?: (tabSetNode: TabSetNode | BorderNode, renderValues: ITabSetRenderValues) => void;
|
|
23
|
+
/** function called when model has changed */
|
|
24
|
+
onModelChange?: (model: Model, action: Action) => void;
|
|
25
|
+
/** function called when an external object (not a tab) gets dragged onto the layout, with a single dragenter argument. Should return either undefined to reject the drag/drop or an object with keys dragText, jsonDrop, to create a tab via drag (similar to a call to addTabToTabSet). Function onDropis passed the added tabNodeand thedrop DragEvent`, unless the drag was canceled. */
|
|
26
|
+
onExternalDrag?: (event: React.DragEvent<HTMLElement>) => undefined | {
|
|
27
|
+
json: any;
|
|
28
|
+
onDrop?: (node?: Node, event?: React.DragEvent<HTMLElement>) => void;
|
|
29
|
+
};
|
|
30
|
+
/** function called with default css class name, return value is class name that will be used. Mainly for use with css modules. */
|
|
31
|
+
classNameMapper?: (defaultClassName: string) => string;
|
|
32
|
+
/** function called for each I18nLabel to allow user translation, currently used for tab and tabset move messages, return undefined to use default values */
|
|
33
|
+
i18nMapper?: (id: I18nLabel, param?: string) => string | undefined;
|
|
34
|
+
/** if left undefined will do simple check based on userAgent */
|
|
35
|
+
supportsPopout?: boolean | undefined;
|
|
36
|
+
/** URL of popout window relative to origin, defaults to popout.html */
|
|
37
|
+
popoutURL?: string | undefined;
|
|
38
|
+
/** boolean value, defaults to false, resize tabs as splitters are dragged. Warning: this can cause resizing to become choppy when tabs are slow to draw */
|
|
39
|
+
realtimeResize?: boolean | undefined;
|
|
40
|
+
/** callback for rendering the drag rectangles */
|
|
41
|
+
onRenderDragRect?: DragRectRenderCallback;
|
|
42
|
+
/** callback for handling context actions on tabs and tabsets */
|
|
43
|
+
onContextMenu?: NodeMouseEvent;
|
|
44
|
+
/** callback for handling mouse clicks on tabs and tabsets with alt, meta, shift keys, also handles center mouse clicks */
|
|
45
|
+
onAuxMouseClick?: NodeMouseEvent;
|
|
46
|
+
/** callback for handling the display of the tab overflow menu */
|
|
47
|
+
onShowOverflowMenu?: ShowOverflowMenuCallback;
|
|
48
|
+
/** callback for rendering a placeholder when a tabset is empty */
|
|
49
|
+
onTabSetPlaceHolder?: TabSetPlaceHolderCallback;
|
|
50
|
+
/** Name given to popout windows, defaults to 'Popout Window' */
|
|
51
|
+
popoutWindowName?: string;
|
|
52
|
+
}
|
|
53
|
+
/**
|
|
54
|
+
* A React component that hosts a multi-tabbed layout
|
|
55
|
+
*/
|
|
56
|
+
export declare class Layout extends React.Component<ILayoutProps> {
|
|
57
|
+
/** re-render the layout */
|
|
58
|
+
redraw(): void;
|
|
59
|
+
/**
|
|
60
|
+
* Adds a new tab to the given tabset
|
|
61
|
+
* @param tabsetId the id of the tabset where the new tab will be added
|
|
62
|
+
* @param json the json for the new tab node
|
|
63
|
+
* @returns the added tab node or undefined
|
|
64
|
+
*/
|
|
65
|
+
addTabToTabSet(tabsetId: string, json: IJsonTabNode): TabNode | undefined;
|
|
66
|
+
/**
|
|
67
|
+
* Adds a new tab by dragging an item to the drop location, must be called from within an HTML
|
|
68
|
+
* drag start handler. You can use the setDragComponent() method to set the drag image before calling this
|
|
69
|
+
* method.
|
|
70
|
+
* @param event the drag start event
|
|
71
|
+
* @param json the json for the new tab node
|
|
72
|
+
* @param onDrop a callback to call when the drag is complete
|
|
73
|
+
*/
|
|
74
|
+
addTabWithDragAndDrop(event: DragEvent, json: IJsonTabNode, onDrop?: (node?: Node, event?: React.DragEvent<HTMLElement>) => void): void;
|
|
75
|
+
/**
|
|
76
|
+
* Move a tab/tabset using drag and drop, must be called from within an HTML
|
|
77
|
+
* drag start handler
|
|
78
|
+
* @param event the drag start event
|
|
79
|
+
* @param node the tab or tabset to drag
|
|
80
|
+
*/
|
|
81
|
+
moveTabWithDragAndDrop(event: DragEvent, node: (TabNode | TabSetNode)): void;
|
|
82
|
+
/**
|
|
83
|
+
* Adds a new tab to the active tabset (if there is one)
|
|
84
|
+
* @param json the json for the new tab node
|
|
85
|
+
* @returns the added tab node or undefined
|
|
86
|
+
*/
|
|
87
|
+
addTabToActiveTabSet(json: IJsonTabNode): TabNode | undefined;
|
|
88
|
+
/**
|
|
89
|
+
* Sets the drag image from a react component for a drag event
|
|
90
|
+
* @param event the drag event
|
|
91
|
+
* @param component the react component to be used for the drag image
|
|
92
|
+
* @param x the x position of the drag cursor on the image
|
|
93
|
+
* @param y the x position of the drag cursor on the image
|
|
94
|
+
*/
|
|
95
|
+
setDragComponent(event: DragEvent, component: React.ReactNode, x: number, y: number): void;
|
|
96
|
+
/** Get the root div element of the layout */
|
|
97
|
+
getRootDiv(): HTMLDivElement | null;
|
|
98
|
+
}
|
|
99
|
+
export declare const FlexLayoutVersion = "0.8.1";
|
|
100
|
+
export type DragRectRenderCallback = (content: React.ReactNode | undefined, node?: Node, json?: IJsonTabNode) => React.ReactNode | undefined;
|
|
101
|
+
export type NodeMouseEvent = (node: TabNode | TabSetNode | BorderNode, event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
|
102
|
+
export type ShowOverflowMenuCallback = (node: TabSetNode | BorderNode, mouseEvent: React.MouseEvent<HTMLElement, MouseEvent>, items: {
|
|
103
|
+
index: number;
|
|
104
|
+
node: TabNode;
|
|
105
|
+
}[], onSelect: (item: {
|
|
106
|
+
index: number;
|
|
107
|
+
node: TabNode;
|
|
108
|
+
}) => void) => void;
|
|
109
|
+
export type TabSetPlaceHolderCallback = (node: TabSetNode) => React.ReactNode;
|
|
110
|
+
export interface ITabSetRenderValues {
|
|
111
|
+
/** components that will be added after the tabs */
|
|
112
|
+
stickyButtons: React.ReactNode[];
|
|
113
|
+
/** components that will be added at the end of the tabset */
|
|
114
|
+
buttons: React.ReactNode[];
|
|
115
|
+
/** position to insert overflow button within [...stickyButtons, ...buttons]
|
|
116
|
+
* if left undefined position will be after the sticky buttons (if any)
|
|
117
|
+
*/
|
|
118
|
+
overflowPosition: number | undefined;
|
|
119
|
+
}
|
|
120
|
+
export interface ITabRenderValues {
|
|
121
|
+
/** the icon or other leading component */
|
|
122
|
+
leading: React.ReactNode;
|
|
123
|
+
/** the main tab text/component */
|
|
124
|
+
content: React.ReactNode;
|
|
125
|
+
/** a set of react components to add to the tab after the content */
|
|
126
|
+
buttons: React.ReactNode[];
|
|
127
|
+
}
|
|
128
|
+
export interface IIcons {
|
|
129
|
+
close?: (React.ReactNode | ((tabNode: TabNode) => React.ReactNode));
|
|
130
|
+
closeTabset?: (React.ReactNode | ((tabSetNode: TabSetNode) => React.ReactNode));
|
|
131
|
+
popout?: (React.ReactNode | ((tabNode: TabNode) => React.ReactNode));
|
|
132
|
+
maximize?: (React.ReactNode | ((tabSetNode: TabSetNode) => React.ReactNode));
|
|
133
|
+
restore?: (React.ReactNode | ((tabSetNode: TabSetNode) => React.ReactNode));
|
|
134
|
+
more?: (React.ReactNode | ((tabSetNode: (TabSetNode | BorderNode), hiddenTabs: {
|
|
135
|
+
node: TabNode;
|
|
136
|
+
index: number;
|
|
137
|
+
}[]) => React.ReactNode));
|
|
138
|
+
edgeArrow?: React.ReactNode;
|
|
139
|
+
activeTabset?: (React.ReactNode | ((tabSetNode: TabSetNode) => React.ReactNode));
|
|
140
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { Rect } from "../Rect";
|
|
3
|
+
export interface ISizeTrackerProps {
|
|
4
|
+
rect: Rect;
|
|
5
|
+
selected: boolean;
|
|
6
|
+
forceRevision: number;
|
|
7
|
+
tabsRevision: number;
|
|
8
|
+
children: React.ReactNode;
|
|
9
|
+
}
|
|
10
|
+
export declare const SizeTracker: React.MemoExoticComponent<({ children }: ISizeTrackerProps) => React.JSX.Element>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
|
@@ -1 +1,11 @@
|
|
|
1
|
-
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { Node } from "../model/Node";
|
|
3
|
+
import { Rect } from "../Rect";
|
|
4
|
+
export declare function enablePointerOnIFrames(enable: boolean, currentDocument: Document): void;
|
|
5
|
+
export declare function getElementsByTagName(tag: string, currentDocument: Document): Element[];
|
|
6
|
+
export declare function startDrag(doc: Document, event: React.PointerEvent<HTMLElement>, drag: (x: number, y: number) => void, dragEnd: () => void, dragCancel: () => void): void;
|
|
7
|
+
export declare function canDockToWindow(node: Node): boolean;
|
|
8
|
+
export declare function keepOnScreen(rect: Rect): Rect;
|
|
9
|
+
export declare function isOnScreen(rect: Rect): boolean;
|
|
10
|
+
export declare function copyInlineStyles(source: HTMLElement, target: HTMLElement): boolean;
|
|
11
|
+
export declare function isSafari(): boolean;
|