@vuu-ui/vuu-layout 0.8.35 → 0.8.37
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/README.md +1 -0
- package/cjs/Component.js +14 -0
- package/cjs/Component.js.map +1 -0
- package/cjs/DraggableLayout.css +18 -0
- package/cjs/DraggableLayout.js +24 -0
- package/cjs/DraggableLayout.js.map +1 -0
- package/cjs/dock-layout/DockLayout.css +36 -0
- package/cjs/dock-layout/DockLayout.js +27 -0
- package/cjs/dock-layout/DockLayout.js.map +1 -0
- package/cjs/dock-layout/Drawer.css +159 -0
- package/cjs/dock-layout/Drawer.js +87 -0
- package/cjs/dock-layout/Drawer.js.map +1 -0
- package/cjs/drag-drop/BoxModel.js +422 -0
- package/cjs/drag-drop/BoxModel.js.map +1 -0
- package/cjs/drag-drop/DragState.js +154 -0
- package/cjs/drag-drop/DragState.js.map +1 -0
- package/cjs/drag-drop/Draggable.js +192 -0
- package/cjs/drag-drop/Draggable.js.map +1 -0
- package/cjs/drag-drop/DropMenu.css +71 -0
- package/cjs/drag-drop/DropMenu.js +46 -0
- package/cjs/drag-drop/DropMenu.js.map +1 -0
- package/cjs/drag-drop/DropTarget.js +244 -0
- package/cjs/drag-drop/DropTarget.js.map +1 -0
- package/cjs/drag-drop/DropTargetRenderer.css +40 -0
- package/cjs/drag-drop/DropTargetRenderer.js +233 -0
- package/cjs/drag-drop/DropTargetRenderer.js.map +1 -0
- package/cjs/flexbox/Flexbox.css +45 -0
- package/cjs/flexbox/Flexbox.js +61 -0
- package/cjs/flexbox/Flexbox.js.map +1 -0
- package/cjs/flexbox/FlexboxLayout.js +30 -0
- package/cjs/flexbox/FlexboxLayout.js.map +1 -0
- package/cjs/flexbox/FluidGrid.css +134 -0
- package/cjs/flexbox/FluidGrid.js +78 -0
- package/cjs/flexbox/FluidGrid.js.map +1 -0
- package/cjs/flexbox/FluidGridLayout.js +14 -0
- package/cjs/flexbox/FluidGridLayout.js.map +1 -0
- package/cjs/flexbox/Splitter.css +148 -0
- package/cjs/flexbox/Splitter.js +113 -0
- package/cjs/flexbox/Splitter.js.map +1 -0
- package/cjs/flexbox/flexbox-utils.js +109 -0
- package/cjs/flexbox/flexbox-utils.js.map +1 -0
- package/cjs/flexbox/useResponsiveSizing.js +62 -0
- package/cjs/flexbox/useResponsiveSizing.js.map +1 -0
- package/cjs/flexbox/useSplitterResizing.js +209 -0
- package/cjs/flexbox/useSplitterResizing.js.map +1 -0
- package/cjs/index.js.map +1 -0
- package/cjs/layout-action.js +27 -0
- package/cjs/layout-action.js.map +1 -0
- package/cjs/layout-header/Header.css +9 -0
- package/cjs/layout-header/Header.js +122 -0
- package/cjs/layout-header/Header.js.map +1 -0
- package/cjs/layout-provider/LayoutProvider.js +178 -0
- package/cjs/layout-provider/LayoutProvider.js.map +1 -0
- package/cjs/layout-provider/LayoutProviderContext.js +14 -0
- package/cjs/layout-provider/LayoutProviderContext.js.map +1 -0
- package/cjs/layout-provider/useLayoutDragDrop.js +170 -0
- package/cjs/layout-provider/useLayoutDragDrop.js.map +1 -0
- package/cjs/layout-reducer/flexUtils.js +219 -0
- package/cjs/layout-reducer/flexUtils.js.map +1 -0
- package/cjs/layout-reducer/insert-layout-element.js +273 -0
- package/cjs/layout-reducer/insert-layout-element.js.map +1 -0
- package/cjs/layout-reducer/layout-reducer.js +198 -0
- package/cjs/layout-reducer/layout-reducer.js.map +1 -0
- package/cjs/layout-reducer/layoutTypes.js +41 -0
- package/cjs/layout-reducer/layoutTypes.js.map +1 -0
- package/cjs/layout-reducer/layoutUtils.js +226 -0
- package/cjs/layout-reducer/layoutUtils.js.map +1 -0
- package/cjs/layout-reducer/move-layout-element.js +31 -0
- package/cjs/layout-reducer/move-layout-element.js.map +1 -0
- package/cjs/layout-reducer/remove-layout-element.js +223 -0
- package/cjs/layout-reducer/remove-layout-element.js.map +1 -0
- package/cjs/layout-reducer/replace-layout-element.js +91 -0
- package/cjs/layout-reducer/replace-layout-element.js.map +1 -0
- package/cjs/layout-reducer/resize-flex-children.js +61 -0
- package/cjs/layout-reducer/resize-flex-children.js.map +1 -0
- package/cjs/layout-reducer/wrap-layout-element.js +212 -0
- package/cjs/layout-reducer/wrap-layout-element.js.map +1 -0
- package/cjs/layout-view/View.css +62 -0
- package/cjs/layout-view/View.js +155 -0
- package/cjs/layout-view/View.js.map +1 -0
- package/cjs/layout-view/useView.js +92 -0
- package/cjs/layout-view/useView.js.map +1 -0
- package/cjs/layout-view/useViewResize.js +42 -0
- package/cjs/layout-view/useViewResize.js.map +1 -0
- package/cjs/layout-view-actions/ViewContext.js +16 -0
- package/cjs/layout-view-actions/ViewContext.js.map +1 -0
- package/cjs/layout-view-actions/useViewActionDispatcher.js +103 -0
- package/cjs/layout-view-actions/useViewActionDispatcher.js.map +1 -0
- package/cjs/palette/Palette.css +33 -0
- package/cjs/palette/Palette.js +118 -0
- package/cjs/palette/Palette.js.map +1 -0
- package/cjs/placeholder/LayoutStartPanel.css +30 -0
- package/cjs/placeholder/LayoutStartPanel.js +51 -0
- package/cjs/placeholder/LayoutStartPanel.js.map +1 -0
- package/cjs/placeholder/Placeholder.css +17 -0
- package/cjs/placeholder/Placeholder.js +25 -0
- package/cjs/placeholder/Placeholder.js.map +1 -0
- package/cjs/registry/ComponentRegistry.js +27 -0
- package/cjs/registry/ComponentRegistry.js.map +1 -0
- package/cjs/responsive/breakpoints.js +36 -0
- package/cjs/responsive/breakpoints.js.map +1 -0
- package/cjs/responsive/use-breakpoints.js +76 -0
- package/cjs/responsive/use-breakpoints.js.map +1 -0
- package/cjs/responsive/useResizeObserver.js +118 -0
- package/cjs/responsive/useResizeObserver.js.map +1 -0
- package/cjs/responsive/utils.js +34 -0
- package/cjs/responsive/utils.js.map +1 -0
- package/cjs/stack/Stack.css +39 -0
- package/cjs/stack/Stack.js +139 -0
- package/cjs/stack/Stack.js.map +1 -0
- package/cjs/stack/StackLayout.js +122 -0
- package/cjs/stack/StackLayout.js.map +1 -0
- package/cjs/use-persistent-state.js +109 -0
- package/cjs/use-persistent-state.js.map +1 -0
- package/cjs/utils/pathUtils.js +293 -0
- package/cjs/utils/pathUtils.js.map +1 -0
- package/cjs/utils/propUtils.js +27 -0
- package/cjs/utils/propUtils.js.map +1 -0
- package/cjs/utils/refUtils.js +12 -0
- package/cjs/utils/refUtils.js.map +1 -0
- package/cjs/utils/styleUtils.js +15 -0
- package/cjs/utils/styleUtils.js.map +1 -0
- package/cjs/utils/typeOf.js +27 -0
- package/cjs/utils/typeOf.js.map +1 -0
- package/esm/Component.js +12 -0
- package/esm/Component.js.map +1 -0
- package/esm/DraggableLayout.css +18 -0
- package/esm/DraggableLayout.js +22 -0
- package/esm/DraggableLayout.js.map +1 -0
- package/esm/dock-layout/DockLayout.css +36 -0
- package/esm/dock-layout/DockLayout.js +25 -0
- package/esm/dock-layout/DockLayout.js.map +1 -0
- package/esm/dock-layout/Drawer.css +159 -0
- package/esm/dock-layout/Drawer.js +85 -0
- package/esm/dock-layout/Drawer.js.map +1 -0
- package/esm/drag-drop/BoxModel.js +415 -0
- package/esm/drag-drop/BoxModel.js.map +1 -0
- package/esm/drag-drop/DragState.js +152 -0
- package/esm/drag-drop/DragState.js.map +1 -0
- package/esm/drag-drop/Draggable.js +190 -0
- package/esm/drag-drop/Draggable.js.map +1 -0
- package/esm/drag-drop/DropMenu.css +71 -0
- package/esm/drag-drop/DropMenu.js +43 -0
- package/esm/drag-drop/DropMenu.js.map +1 -0
- package/esm/drag-drop/DropTarget.js +240 -0
- package/esm/drag-drop/DropTarget.js.map +1 -0
- package/esm/drag-drop/DropTargetRenderer.css +40 -0
- package/esm/drag-drop/DropTargetRenderer.js +231 -0
- package/esm/drag-drop/DropTargetRenderer.js.map +1 -0
- package/esm/flexbox/Flexbox.css +45 -0
- package/esm/flexbox/Flexbox.js +59 -0
- package/esm/flexbox/Flexbox.js.map +1 -0
- package/esm/flexbox/FlexboxLayout.js +28 -0
- package/esm/flexbox/FlexboxLayout.js.map +1 -0
- package/esm/flexbox/FluidGrid.css +134 -0
- package/esm/flexbox/FluidGrid.js +76 -0
- package/esm/flexbox/FluidGrid.js.map +1 -0
- package/esm/flexbox/FluidGridLayout.js +12 -0
- package/esm/flexbox/FluidGridLayout.js.map +1 -0
- package/esm/flexbox/Splitter.css +148 -0
- package/esm/flexbox/Splitter.js +111 -0
- package/esm/flexbox/Splitter.js.map +1 -0
- package/esm/flexbox/flexbox-utils.js +103 -0
- package/esm/flexbox/flexbox-utils.js.map +1 -0
- package/esm/flexbox/useResponsiveSizing.js +60 -0
- package/esm/flexbox/useResponsiveSizing.js.map +1 -0
- package/esm/flexbox/useSplitterResizing.js +207 -0
- package/esm/flexbox/useSplitterResizing.js.map +1 -0
- package/esm/index.js +37 -0
- package/esm/index.js.map +1 -0
- package/esm/layout-action.js +25 -0
- package/esm/layout-action.js.map +1 -0
- package/esm/layout-header/Header.css +9 -0
- package/esm/layout-header/Header.js +120 -0
- package/esm/layout-header/Header.js.map +1 -0
- package/esm/layout-provider/LayoutProvider.js +172 -0
- package/esm/layout-provider/LayoutProvider.js.map +1 -0
- package/esm/layout-provider/LayoutProviderContext.js +12 -0
- package/esm/layout-provider/LayoutProviderContext.js.map +1 -0
- package/esm/layout-provider/useLayoutDragDrop.js +168 -0
- package/esm/layout-provider/useLayoutDragDrop.js.map +1 -0
- package/esm/layout-reducer/flexUtils.js +210 -0
- package/esm/layout-reducer/flexUtils.js.map +1 -0
- package/esm/layout-reducer/insert-layout-element.js +269 -0
- package/esm/layout-reducer/insert-layout-element.js.map +1 -0
- package/esm/layout-reducer/layout-reducer.js +196 -0
- package/esm/layout-reducer/layout-reducer.js.map +1 -0
- package/esm/layout-reducer/layoutTypes.js +37 -0
- package/esm/layout-reducer/layoutTypes.js.map +1 -0
- package/esm/layout-reducer/layoutUtils.js +215 -0
- package/esm/layout-reducer/layoutUtils.js.map +1 -0
- package/esm/layout-reducer/move-layout-element.js +29 -0
- package/esm/layout-reducer/move-layout-element.js.map +1 -0
- package/esm/layout-reducer/remove-layout-element.js +221 -0
- package/esm/layout-reducer/remove-layout-element.js.map +1 -0
- package/esm/layout-reducer/replace-layout-element.js +87 -0
- package/esm/layout-reducer/replace-layout-element.js.map +1 -0
- package/esm/layout-reducer/resize-flex-children.js +58 -0
- package/esm/layout-reducer/resize-flex-children.js.map +1 -0
- package/esm/layout-reducer/wrap-layout-element.js +210 -0
- package/esm/layout-reducer/wrap-layout-element.js.map +1 -0
- package/esm/layout-view/View.css +62 -0
- package/esm/layout-view/View.js +153 -0
- package/esm/layout-view/View.js.map +1 -0
- package/esm/layout-view/useView.js +90 -0
- package/esm/layout-view/useView.js.map +1 -0
- package/esm/layout-view/useViewResize.js +40 -0
- package/esm/layout-view/useViewResize.js.map +1 -0
- package/esm/layout-view-actions/ViewContext.js +12 -0
- package/esm/layout-view-actions/ViewContext.js.map +1 -0
- package/esm/layout-view-actions/useViewActionDispatcher.js +101 -0
- package/esm/layout-view-actions/useViewActionDispatcher.js.map +1 -0
- package/esm/palette/Palette.css +33 -0
- package/esm/palette/Palette.js +115 -0
- package/esm/palette/Palette.js.map +1 -0
- package/esm/placeholder/LayoutStartPanel.css +30 -0
- package/esm/placeholder/LayoutStartPanel.js +49 -0
- package/esm/placeholder/LayoutStartPanel.js.map +1 -0
- package/esm/placeholder/Placeholder.css +17 -0
- package/esm/placeholder/Placeholder.js +23 -0
- package/esm/placeholder/Placeholder.js.map +1 -0
- package/esm/registry/ComponentRegistry.js +21 -0
- package/esm/registry/ComponentRegistry.js.map +1 -0
- package/esm/responsive/breakpoints.js +33 -0
- package/esm/responsive/breakpoints.js.map +1 -0
- package/esm/responsive/use-breakpoints.js +74 -0
- package/esm/responsive/use-breakpoints.js.map +1 -0
- package/esm/responsive/useResizeObserver.js +112 -0
- package/esm/responsive/useResizeObserver.js.map +1 -0
- package/esm/responsive/utils.js +31 -0
- package/esm/responsive/utils.js.map +1 -0
- package/esm/stack/Stack.css +39 -0
- package/esm/stack/Stack.js +137 -0
- package/esm/stack/Stack.js.map +1 -0
- package/esm/stack/StackLayout.js +120 -0
- package/esm/stack/StackLayout.js.map +1 -0
- package/esm/use-persistent-state.js +104 -0
- package/esm/use-persistent-state.js.map +1 -0
- package/esm/utils/pathUtils.js +280 -0
- package/esm/utils/pathUtils.js.map +1 -0
- package/esm/utils/propUtils.js +23 -0
- package/esm/utils/propUtils.js.map +1 -0
- package/esm/utils/refUtils.js +10 -0
- package/esm/utils/refUtils.js.map +1 -0
- package/esm/utils/styleUtils.js +13 -0
- package/esm/utils/styleUtils.js.map +1 -0
- package/esm/utils/typeOf.js +23 -0
- package/esm/utils/typeOf.js.map +1 -0
- package/package.json +10 -8
|
@@ -0,0 +1,273 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var vuuUtils = require('@vuu-ui/vuu-utils');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
var pathUtils = require('../utils/pathUtils.js');
|
|
6
|
+
var propUtils = require('../utils/propUtils.js');
|
|
7
|
+
var typeOf = require('../utils/typeOf.js');
|
|
8
|
+
var flexUtils = require('./flexUtils.js');
|
|
9
|
+
var layoutUtils = require('./layoutUtils.js');
|
|
10
|
+
|
|
11
|
+
function getInsertTabBeforeAfter(stack, pos) {
|
|
12
|
+
const tabs = stack.props.children;
|
|
13
|
+
const tabCount = tabs.length;
|
|
14
|
+
const { index = -1, positionRelativeToTab = "after" } = pos.tab || {};
|
|
15
|
+
return index === -1 || index >= tabCount ? [tabs[tabCount - 1], "after"] : [tabs[index] ?? null, positionRelativeToTab];
|
|
16
|
+
}
|
|
17
|
+
function insertIntoContainer(container, targetContainer, newComponent) {
|
|
18
|
+
const {
|
|
19
|
+
active: containerActive,
|
|
20
|
+
children: containerChildren = [],
|
|
21
|
+
path: containerPath
|
|
22
|
+
} = propUtils.getProps(container);
|
|
23
|
+
const existingComponentPath = propUtils.getProp(targetContainer, "path");
|
|
24
|
+
const { idx, finalStep } = pathUtils.nextStep(
|
|
25
|
+
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
26
|
+
containerPath,
|
|
27
|
+
existingComponentPath,
|
|
28
|
+
true
|
|
29
|
+
);
|
|
30
|
+
const [insertedIdx, children] = finalStep ? insertIntoChildren(container, containerChildren, newComponent) : [
|
|
31
|
+
containerActive,
|
|
32
|
+
containerChildren?.map(
|
|
33
|
+
(child, index) => index === idx ? insertIntoContainer(
|
|
34
|
+
child,
|
|
35
|
+
targetContainer,
|
|
36
|
+
newComponent
|
|
37
|
+
) : child
|
|
38
|
+
)
|
|
39
|
+
];
|
|
40
|
+
const active = typeOf.typeOf(container) === "Stack" ? Array.isArray(insertedIdx) ? insertedIdx[0] : insertedIdx : containerActive;
|
|
41
|
+
return React.cloneElement(container, { active }, children);
|
|
42
|
+
}
|
|
43
|
+
const getDefaultTitle = (containerType, component, index, existingLabels) => containerType === "Stack" ? layoutUtils.getDefaultTabLabel(component, index, existingLabels) : void 0;
|
|
44
|
+
const getChildrenTitles = (children) => children.map((child) => child.props.title);
|
|
45
|
+
function insertIntoChildren(container, containerChildren, newComponent) {
|
|
46
|
+
const containerPath = propUtils.getProp(container, "path");
|
|
47
|
+
const count = containerChildren?.length;
|
|
48
|
+
const {
|
|
49
|
+
id = vuuUtils.uuid(),
|
|
50
|
+
title = getDefaultTitle(
|
|
51
|
+
typeOf.typeOf(container),
|
|
52
|
+
newComponent,
|
|
53
|
+
count ?? 0,
|
|
54
|
+
getChildrenTitles(containerChildren)
|
|
55
|
+
)
|
|
56
|
+
} = propUtils.getProps(newComponent);
|
|
57
|
+
if (count) {
|
|
58
|
+
return [
|
|
59
|
+
count,
|
|
60
|
+
containerChildren.concat(
|
|
61
|
+
pathUtils.resetPath(newComponent, `${containerPath}.${count}`, {
|
|
62
|
+
id,
|
|
63
|
+
key: id,
|
|
64
|
+
title
|
|
65
|
+
})
|
|
66
|
+
)
|
|
67
|
+
];
|
|
68
|
+
} else {
|
|
69
|
+
return [0, [pathUtils.resetPath(newComponent, `${containerPath}.0`, { id, title })]];
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
function insertBesideChild(container, existingComponent, newComponent, insertionPosition, pos, clientRect, dropRect) {
|
|
73
|
+
const {
|
|
74
|
+
active: containerActive,
|
|
75
|
+
children: containerChildren,
|
|
76
|
+
path: containerPath
|
|
77
|
+
} = propUtils.getProps(container);
|
|
78
|
+
const existingComponentPath = propUtils.getProp(existingComponent, "path");
|
|
79
|
+
const { idx, finalStep } = pathUtils.nextStep(containerPath, existingComponentPath);
|
|
80
|
+
const [insertedIdx, children] = finalStep ? updateChildren(
|
|
81
|
+
container,
|
|
82
|
+
containerChildren,
|
|
83
|
+
idx,
|
|
84
|
+
newComponent,
|
|
85
|
+
insertionPosition,
|
|
86
|
+
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
87
|
+
pos,
|
|
88
|
+
clientRect,
|
|
89
|
+
dropRect
|
|
90
|
+
) : [
|
|
91
|
+
containerActive,
|
|
92
|
+
containerChildren.map(
|
|
93
|
+
(child, index) => index === idx ? insertBesideChild(
|
|
94
|
+
child,
|
|
95
|
+
existingComponent,
|
|
96
|
+
newComponent,
|
|
97
|
+
insertionPosition,
|
|
98
|
+
pos,
|
|
99
|
+
clientRect,
|
|
100
|
+
dropRect
|
|
101
|
+
) : child
|
|
102
|
+
)
|
|
103
|
+
];
|
|
104
|
+
const active = typeOf.typeOf(container) === "Stack" ? insertedIdx : containerActive;
|
|
105
|
+
return React.cloneElement(container, { active }, children);
|
|
106
|
+
}
|
|
107
|
+
function updateChildren(container, containerChildren, idx, newComponent, insertionPosition, pos, clientRect, dropRect) {
|
|
108
|
+
const intrinsicSize = flexUtils.getIntrinsicSize(newComponent);
|
|
109
|
+
if (intrinsicSize?.width && intrinsicSize?.height) {
|
|
110
|
+
return insertIntrinsicSizedComponent(
|
|
111
|
+
container,
|
|
112
|
+
containerChildren,
|
|
113
|
+
idx,
|
|
114
|
+
newComponent,
|
|
115
|
+
insertionPosition,
|
|
116
|
+
clientRect,
|
|
117
|
+
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
118
|
+
dropRect
|
|
119
|
+
);
|
|
120
|
+
} else {
|
|
121
|
+
return insertFlexComponent(
|
|
122
|
+
container,
|
|
123
|
+
containerChildren,
|
|
124
|
+
idx,
|
|
125
|
+
newComponent,
|
|
126
|
+
insertionPosition,
|
|
127
|
+
pos?.width || pos?.height,
|
|
128
|
+
clientRect
|
|
129
|
+
);
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
const getLeadingPlaceholderSize = (flexDirection2, insertionPosition, { top, right, bottom, left }, [rectLeft, rectTop, rectRight, rectBottom]) => {
|
|
133
|
+
if (flexDirection2 === "column" && insertionPosition === "before") {
|
|
134
|
+
return rectTop - top;
|
|
135
|
+
} else if (flexDirection2 === "column") {
|
|
136
|
+
return bottom - rectBottom;
|
|
137
|
+
} else if (flexDirection2 === "row" && insertionPosition === "before") {
|
|
138
|
+
return rectLeft - left;
|
|
139
|
+
} else if (flexDirection2 === "row") {
|
|
140
|
+
return right - rectRight;
|
|
141
|
+
}
|
|
142
|
+
};
|
|
143
|
+
function insertIntrinsicSizedComponent(container, containerChildren, idx, newComponent, insertionPosition, clientRect, dropRect) {
|
|
144
|
+
const {
|
|
145
|
+
style: { flexDirection: flexDirection2 }
|
|
146
|
+
} = propUtils.getProps(container);
|
|
147
|
+
const [dimension, crossDimension, contraDirection] = flexUtils.getFlexDimensions(flexDirection2);
|
|
148
|
+
const { [crossDimension]: intrinsicCrossSize, [dimension]: intrinsicSize } = flexUtils.getIntrinsicSize(newComponent);
|
|
149
|
+
const path = propUtils.getProp(containerChildren[idx], "path");
|
|
150
|
+
const placeholderSize = getLeadingPlaceholderSize(
|
|
151
|
+
flexDirection2,
|
|
152
|
+
insertionPosition,
|
|
153
|
+
clientRect,
|
|
154
|
+
dropRect
|
|
155
|
+
);
|
|
156
|
+
const [itemToInsert, size] = intrinsicCrossSize < clientRect[crossDimension] ? [
|
|
157
|
+
flexUtils.wrapIntrinsicSizeComponentWithFlexbox(
|
|
158
|
+
newComponent,
|
|
159
|
+
contraDirection,
|
|
160
|
+
path,
|
|
161
|
+
clientRect,
|
|
162
|
+
dropRect
|
|
163
|
+
),
|
|
164
|
+
intrinsicSize
|
|
165
|
+
] : [newComponent, void 0];
|
|
166
|
+
const placeholder = placeholderSize ? flexUtils.createPlaceHolder(path, placeholderSize, { flexGrow: 0, flexShrink: 0 }) : void 0;
|
|
167
|
+
if (intrinsicCrossSize > clientRect[crossDimension]) {
|
|
168
|
+
containerChildren = containerChildren.map((child) => {
|
|
169
|
+
if (propUtils.getProp(child, "placeholder")) {
|
|
170
|
+
return child;
|
|
171
|
+
} else {
|
|
172
|
+
const { [crossDimension]: intrinsicCrossChildSize } = flexUtils.getIntrinsicSize(
|
|
173
|
+
child
|
|
174
|
+
);
|
|
175
|
+
if (intrinsicCrossChildSize && intrinsicCrossChildSize < intrinsicCrossSize) {
|
|
176
|
+
return flexUtils.wrapIntrinsicSizeComponentWithFlexbox(
|
|
177
|
+
child,
|
|
178
|
+
contraDirection,
|
|
179
|
+
propUtils.getProp(child, "path")
|
|
180
|
+
);
|
|
181
|
+
} else {
|
|
182
|
+
return child;
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
});
|
|
186
|
+
}
|
|
187
|
+
return insertFlexComponent(
|
|
188
|
+
container,
|
|
189
|
+
containerChildren,
|
|
190
|
+
idx,
|
|
191
|
+
itemToInsert,
|
|
192
|
+
insertionPosition,
|
|
193
|
+
size,
|
|
194
|
+
clientRect,
|
|
195
|
+
placeholder
|
|
196
|
+
);
|
|
197
|
+
}
|
|
198
|
+
function insertFlexComponent(container, containerChildren, idx, newComponent, insertionPosition, size, targetRect, placeholder) {
|
|
199
|
+
const containerPath = propUtils.getProp(container, "path");
|
|
200
|
+
let insertedIdx = 0;
|
|
201
|
+
const children = !containerChildren || containerChildren.length === 0 ? [newComponent] : containerChildren.reduce((arr, child, i) => {
|
|
202
|
+
if (idx === i) {
|
|
203
|
+
const [existingComponent, insertedComponent] = getStyledComponents(container, child, newComponent, targetRect);
|
|
204
|
+
if (insertionPosition === "before") {
|
|
205
|
+
if (placeholder) {
|
|
206
|
+
arr.push(placeholder, insertedComponent, existingComponent);
|
|
207
|
+
} else {
|
|
208
|
+
arr.push(insertedComponent, existingComponent);
|
|
209
|
+
}
|
|
210
|
+
} else {
|
|
211
|
+
if (placeholder) {
|
|
212
|
+
arr.push(existingComponent, insertedComponent, placeholder);
|
|
213
|
+
} else {
|
|
214
|
+
arr.push(existingComponent, insertedComponent);
|
|
215
|
+
}
|
|
216
|
+
}
|
|
217
|
+
insertedIdx = arr.indexOf(insertedComponent);
|
|
218
|
+
} else {
|
|
219
|
+
arr.push(child);
|
|
220
|
+
}
|
|
221
|
+
return arr;
|
|
222
|
+
}, []).map(
|
|
223
|
+
(child, i) => i < insertedIdx ? child : pathUtils.resetPath(child, `${containerPath}.${i}`)
|
|
224
|
+
);
|
|
225
|
+
return [insertedIdx, children];
|
|
226
|
+
}
|
|
227
|
+
function getStyledComponents(container, existingComponent, newComponent, targetRect) {
|
|
228
|
+
const id = vuuUtils.uuid();
|
|
229
|
+
let { version = 0 } = propUtils.getProps(newComponent);
|
|
230
|
+
version += 1;
|
|
231
|
+
if (typeOf.typeOf(container) === "Flexbox") {
|
|
232
|
+
const [dim] = layoutUtils.getManagedDimension(container.props.style);
|
|
233
|
+
const splitterSize = 6;
|
|
234
|
+
const size = { [dim]: (targetRect[dim] - splitterSize) / 2 };
|
|
235
|
+
const existingComponentStyle = flexUtils.getFlexOrIntrinsicStyle(
|
|
236
|
+
existingComponent,
|
|
237
|
+
dim,
|
|
238
|
+
size
|
|
239
|
+
);
|
|
240
|
+
const newComponentStyle = flexUtils.getFlexOrIntrinsicStyle(newComponent, dim, size);
|
|
241
|
+
return [
|
|
242
|
+
React.cloneElement(existingComponent, {
|
|
243
|
+
style: existingComponentStyle
|
|
244
|
+
}),
|
|
245
|
+
React.cloneElement(newComponent, {
|
|
246
|
+
id,
|
|
247
|
+
version,
|
|
248
|
+
style: newComponentStyle
|
|
249
|
+
})
|
|
250
|
+
];
|
|
251
|
+
} else {
|
|
252
|
+
const {
|
|
253
|
+
style: { left: _1, top: _2, flex: _3, ...style } = {
|
|
254
|
+
left: void 0,
|
|
255
|
+
top: void 0,
|
|
256
|
+
flex: void 0
|
|
257
|
+
}
|
|
258
|
+
} = propUtils.getProps(newComponent);
|
|
259
|
+
return [
|
|
260
|
+
existingComponent,
|
|
261
|
+
React.cloneElement(newComponent, {
|
|
262
|
+
id,
|
|
263
|
+
version,
|
|
264
|
+
style: { ...style, flex: "1 1 0px" }
|
|
265
|
+
})
|
|
266
|
+
];
|
|
267
|
+
}
|
|
268
|
+
}
|
|
269
|
+
|
|
270
|
+
exports.getInsertTabBeforeAfter = getInsertTabBeforeAfter;
|
|
271
|
+
exports.insertBesideChild = insertBesideChild;
|
|
272
|
+
exports.insertIntoContainer = insertIntoContainer;
|
|
273
|
+
//# sourceMappingURL=insert-layout-element.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"insert-layout-element.js","sources":["../../src/layout-reducer/insert-layout-element.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { rectTuple, uuid } from \"@vuu-ui/vuu-utils\";\nimport React, { ReactElement } from \"react\";\nimport { DropPos } from \"../drag-drop\";\nimport { DropTarget } from \"../drag-drop/DropTarget\";\nimport { getProp, getProps, nextStep, resetPath, typeOf } from \"../utils\";\nimport {\n createPlaceHolder,\n flexDirection,\n getFlexDimensions,\n getFlexOrIntrinsicStyle,\n getIntrinsicSize,\n wrapIntrinsicSizeComponentWithFlexbox,\n} from \"./flexUtils\";\nimport { LayoutModel } from \"./layoutTypes\";\nimport {\n getDefaultTabLabel,\n getManagedDimension,\n LayoutProps,\n} from \"./layoutUtils\";\n\ntype insertionPosition = \"before\" | \"after\";\n\nexport function getInsertTabBeforeAfter(stack: LayoutModel, pos: DropPos) {\n const tabs = stack.props.children;\n const tabCount = tabs.length;\n const { index = -1, positionRelativeToTab = \"after\" } = pos.tab || {};\n return index === -1 || index >= tabCount\n ? [tabs[tabCount - 1], \"after\"]\n : [tabs[index] ?? null, positionRelativeToTab];\n}\n\nexport function insertIntoContainer(\n container: ReactElement,\n targetContainer: ReactElement,\n newComponent: ReactElement\n): ReactElement {\n const {\n active: containerActive,\n children: containerChildren = [],\n path: containerPath,\n } = getProps(container) as LayoutProps;\n\n const existingComponentPath = getProp(targetContainer, \"path\");\n const { idx, finalStep } = nextStep(\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n containerPath!,\n existingComponentPath,\n true\n );\n const [insertedIdx, children] = finalStep\n ? insertIntoChildren(container, containerChildren, newComponent)\n : [\n containerActive,\n containerChildren?.map((child, index) =>\n index === idx\n ? (insertIntoContainer(\n child,\n targetContainer,\n newComponent\n ) as ReactElement)\n : child\n ),\n ];\n const active =\n typeOf(container) === \"Stack\"\n ? Array.isArray(insertedIdx)\n ? (insertedIdx[0] as number)\n : insertedIdx\n : containerActive;\n\n return React.cloneElement(container, { active }, children);\n}\n\nconst getDefaultTitle = (\n containerType: string | undefined,\n component: ReactElement,\n index: number,\n existingLabels: string[]\n) =>\n containerType === \"Stack\"\n ? getDefaultTabLabel(component, index, existingLabels)\n : undefined;\n\nconst getChildrenTitles = (children: ReactElement[]) =>\n children.map((child) => child.props.title);\n\nfunction insertIntoChildren(\n container: ReactElement,\n containerChildren: ReactElement[],\n newComponent: ReactElement\n): [number, ReactElement[]] {\n const containerPath = getProp(container, \"path\");\n const count = containerChildren?.length;\n const {\n id = uuid(),\n title = getDefaultTitle(\n typeOf(container),\n newComponent,\n count ?? 0,\n getChildrenTitles(containerChildren)\n ),\n } = getProps(newComponent);\n\n if (count) {\n return [\n count,\n containerChildren.concat(\n resetPath(newComponent, `${containerPath}.${count}`, {\n id,\n key: id,\n title,\n })\n ),\n ];\n } else {\n return [0, [resetPath(newComponent, `${containerPath}.0`, { id, title })]];\n }\n}\n\nexport function insertBesideChild(\n container: ReactElement,\n existingComponent: any,\n newComponent: any,\n insertionPosition: insertionPosition,\n pos?: DropPos,\n clientRect?: any,\n dropRect?: any\n): ReactElement {\n const {\n active: containerActive,\n children: containerChildren,\n path: containerPath,\n } = getProps(container);\n\n const existingComponentPath = getProp(existingComponent, \"path\");\n const { idx, finalStep } = nextStep(containerPath, existingComponentPath);\n const [insertedIdx, children] = finalStep\n ? updateChildren(\n container,\n containerChildren,\n idx,\n newComponent,\n insertionPosition,\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n pos!,\n clientRect,\n dropRect\n )\n : [\n containerActive,\n containerChildren.map((child: ReactElement, index: number) =>\n index === idx\n ? insertBesideChild(\n child,\n existingComponent,\n newComponent,\n insertionPosition,\n pos,\n clientRect,\n dropRect\n )\n : child\n ),\n ];\n\n const active = typeOf(container) === \"Stack\" ? insertedIdx : containerActive;\n return React.cloneElement(container, { active }, children);\n}\n\nfunction updateChildren(\n container: LayoutModel,\n containerChildren: ReactElement[],\n idx: number,\n newComponent: ReactElement,\n insertionPosition: insertionPosition,\n pos: DropPos,\n clientRect: DropTarget[\"clientRect\"],\n dropRect: DropTarget[\"dropRect\"]\n) {\n const intrinsicSize = getIntrinsicSize(newComponent);\n if (intrinsicSize?.width && intrinsicSize?.height) {\n return insertIntrinsicSizedComponent(\n container,\n containerChildren,\n idx,\n newComponent,\n insertionPosition,\n clientRect,\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n dropRect!\n );\n } else {\n return insertFlexComponent(\n container,\n containerChildren,\n idx,\n newComponent,\n insertionPosition,\n pos?.width || pos?.height,\n clientRect\n );\n }\n}\n\nconst getLeadingPlaceholderSize = (\n flexDirection: flexDirection,\n insertionPosition: insertionPosition,\n { top, right, bottom, left }: DropTarget[\"clientRect\"],\n [rectLeft, rectTop, rectRight, rectBottom]: rectTuple\n) => {\n if (flexDirection === \"column\" && insertionPosition === \"before\") {\n return rectTop - top;\n } else if (flexDirection === \"column\") {\n return bottom - rectBottom;\n } else if (flexDirection === \"row\" && insertionPosition === \"before\") {\n return rectLeft - left;\n } else if (flexDirection === \"row\") {\n return right - rectRight;\n }\n};\n\nfunction insertIntrinsicSizedComponent(\n container: LayoutModel,\n containerChildren: ReactElement[],\n idx: number,\n newComponent: ReactElement,\n insertionPosition: insertionPosition,\n clientRect: DropTarget[\"clientRect\"],\n dropRect: rectTuple\n) {\n const {\n style: { flexDirection },\n } = getProps(container);\n const [dimension, crossDimension, contraDirection] =\n getFlexDimensions(flexDirection);\n const { [crossDimension]: intrinsicCrossSize, [dimension]: intrinsicSize } =\n getIntrinsicSize(newComponent) as { height: number; width: number };\n const path = getProp(containerChildren[idx], \"path\");\n\n const placeholderSize = getLeadingPlaceholderSize(\n flexDirection,\n insertionPosition,\n clientRect,\n dropRect\n );\n\n const [itemToInsert, size] =\n intrinsicCrossSize < clientRect[crossDimension]\n ? [\n wrapIntrinsicSizeComponentWithFlexbox(\n newComponent,\n contraDirection,\n path,\n clientRect,\n dropRect\n ),\n intrinsicSize,\n ]\n : [newComponent, undefined];\n\n const placeholder = placeholderSize\n ? createPlaceHolder(path, placeholderSize, { flexGrow: 0, flexShrink: 0 })\n : undefined;\n\n if (intrinsicCrossSize > clientRect[crossDimension]) {\n containerChildren = containerChildren.map((child) => {\n if (getProp(child, \"placeholder\")) {\n return child;\n } else {\n const { [crossDimension]: intrinsicCrossChildSize } = getIntrinsicSize(\n child\n ) as {\n height: number;\n width: number;\n };\n if (\n intrinsicCrossChildSize &&\n intrinsicCrossChildSize < intrinsicCrossSize\n ) {\n return wrapIntrinsicSizeComponentWithFlexbox(\n child,\n contraDirection,\n getProp(child, \"path\")\n );\n } else {\n return child;\n }\n }\n });\n }\n\n return insertFlexComponent(\n container,\n containerChildren,\n idx,\n itemToInsert,\n insertionPosition,\n size,\n clientRect,\n placeholder\n );\n}\n\nfunction insertFlexComponent(\n container: LayoutModel,\n containerChildren: ReactElement[],\n idx: number,\n newComponent: ReactElement,\n insertionPosition: \"before\" | \"after\",\n size: number | undefined,\n targetRect: DropTarget[\"clientRect\"],\n placeholder?: ReactElement\n) {\n const containerPath = getProp(container, \"path\");\n let insertedIdx = 0;\n const children =\n !containerChildren || containerChildren.length === 0\n ? [newComponent]\n : containerChildren\n .reduce<ReactElement[]>((arr, child, i) => {\n if (idx === i) {\n const [existingComponent, insertedComponent] =\n getStyledComponents(container, child, newComponent, targetRect);\n if (insertionPosition === \"before\") {\n if (placeholder) {\n arr.push(placeholder, insertedComponent, existingComponent);\n } else {\n arr.push(insertedComponent, existingComponent);\n }\n } else {\n if (placeholder) {\n arr.push(existingComponent, insertedComponent, placeholder);\n } else {\n arr.push(existingComponent, insertedComponent);\n }\n }\n insertedIdx = arr.indexOf(insertedComponent);\n } else {\n arr.push(child);\n }\n return arr;\n }, [])\n .map((child, i) =>\n i < insertedIdx ? child : resetPath(child, `${containerPath}.${i}`)\n );\n\n return [insertedIdx, children];\n}\n\nfunction getStyledComponents(\n container: LayoutModel,\n existingComponent: ReactElement,\n newComponent: ReactElement,\n targetRect: DropTarget[\"clientRect\"]\n): [ReactElement, ReactElement] {\n const id = uuid();\n let { version = 0 } = getProps(newComponent);\n version += 1;\n if (typeOf(container) === \"Flexbox\") {\n const [dim] = getManagedDimension(container.props.style);\n const splitterSize = 6;\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n const size = { [dim]: (targetRect[dim] - splitterSize) / 2 };\n const existingComponentStyle = getFlexOrIntrinsicStyle(\n existingComponent,\n dim,\n size\n );\n const newComponentStyle = getFlexOrIntrinsicStyle(newComponent, dim, size);\n\n return [\n React.cloneElement(existingComponent, {\n style: existingComponentStyle,\n }),\n React.cloneElement(newComponent, {\n id,\n version,\n style: newComponentStyle,\n }),\n ];\n } else {\n const {\n style: { left: _1, top: _2, flex: _3, ...style } = {\n left: undefined,\n top: undefined,\n flex: undefined,\n },\n } = getProps(newComponent);\n return [\n existingComponent,\n React.cloneElement(newComponent, {\n id,\n version,\n style: { ...style, flex: \"1 1 0px\" },\n }),\n ];\n }\n}\n"],"names":["getProps","getProp","nextStep","typeOf","getDefaultTabLabel","uuid","resetPath","getIntrinsicSize","flexDirection","getFlexDimensions","wrapIntrinsicSizeComponentWithFlexbox","createPlaceHolder","getManagedDimension","getFlexOrIntrinsicStyle"],"mappings":"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"}
|
|
@@ -0,0 +1,198 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var ComponentRegistry = require('../registry/ComponentRegistry.js');
|
|
5
|
+
var pathUtils = require('../utils/pathUtils.js');
|
|
6
|
+
var propUtils = require('../utils/propUtils.js');
|
|
7
|
+
var typeOf = require('../utils/typeOf.js');
|
|
8
|
+
var flexUtils = require('./flexUtils.js');
|
|
9
|
+
var insertLayoutElement = require('./insert-layout-element.js');
|
|
10
|
+
var moveLayoutElement = require('./move-layout-element.js');
|
|
11
|
+
var layoutTypes = require('./layoutTypes.js');
|
|
12
|
+
var removeLayoutElement = require('./remove-layout-element.js');
|
|
13
|
+
var replaceLayoutElement = require('./replace-layout-element.js');
|
|
14
|
+
var resizeFlexChildren = require('./resize-flex-children.js');
|
|
15
|
+
var wrapLayoutElement = require('./wrap-layout-element.js');
|
|
16
|
+
|
|
17
|
+
const layoutReducer = (state, action) => {
|
|
18
|
+
switch (action.type) {
|
|
19
|
+
case layoutTypes.LayoutActionType.ADD:
|
|
20
|
+
return addChild(state, action);
|
|
21
|
+
case layoutTypes.LayoutActionType.DRAG_DROP:
|
|
22
|
+
return dragDrop(state, action);
|
|
23
|
+
case layoutTypes.LayoutActionType.MAXIMIZE:
|
|
24
|
+
return setChildProps(state, action);
|
|
25
|
+
case layoutTypes.LayoutActionType.REMOVE:
|
|
26
|
+
return removeLayoutElement.removeChild(state, action);
|
|
27
|
+
case layoutTypes.LayoutActionType.REPLACE:
|
|
28
|
+
return replaceLayoutElement.replaceChild(state, action);
|
|
29
|
+
case layoutTypes.LayoutActionType.SET_PROP:
|
|
30
|
+
return setProp(state, action);
|
|
31
|
+
case layoutTypes.LayoutActionType.SET_PROPS:
|
|
32
|
+
return setProps(state, action);
|
|
33
|
+
case layoutTypes.LayoutActionType.SET_TITLE:
|
|
34
|
+
return setProp(state, {
|
|
35
|
+
type: "set-prop",
|
|
36
|
+
path: action.path,
|
|
37
|
+
propName: "title",
|
|
38
|
+
propValue: action.title
|
|
39
|
+
});
|
|
40
|
+
case layoutTypes.LayoutActionType.SPLITTER_RESIZE:
|
|
41
|
+
return resizeFlexChildren.resizeFlexChildren(state, action);
|
|
42
|
+
case layoutTypes.LayoutActionType.LAYOUT_RESIZE:
|
|
43
|
+
return resizeFlexChildren.resizeFlexChild(state, action);
|
|
44
|
+
case layoutTypes.LayoutActionType.SWITCH_TAB:
|
|
45
|
+
return switchTab(state, action);
|
|
46
|
+
case layoutTypes.LayoutActionType.MOVE_CHILD:
|
|
47
|
+
return moveLayoutElement.moveChild(state, action);
|
|
48
|
+
default:
|
|
49
|
+
return state;
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
const switchTab = (state, { path, nextIdx }) => {
|
|
53
|
+
const target = pathUtils.followPath(state, path, true);
|
|
54
|
+
const replacement = React.cloneElement(target, {
|
|
55
|
+
active: nextIdx
|
|
56
|
+
});
|
|
57
|
+
return replaceLayoutElement.swapChild(state, target, replacement);
|
|
58
|
+
};
|
|
59
|
+
const setProp = (state, { path, propName, propValue }) => {
|
|
60
|
+
const target = pathUtils.followPath(state, path, true);
|
|
61
|
+
const replacement = React.cloneElement(target, {
|
|
62
|
+
[propName]: propValue
|
|
63
|
+
});
|
|
64
|
+
return replaceLayoutElement.swapChild(state, target, replacement);
|
|
65
|
+
};
|
|
66
|
+
const setProps = (state, { path, props }) => {
|
|
67
|
+
const target = pathUtils.followPath(state, path, true);
|
|
68
|
+
const replacement = React.cloneElement(target, props);
|
|
69
|
+
return replaceLayoutElement.swapChild(state, target, replacement);
|
|
70
|
+
};
|
|
71
|
+
const setChildProps = (state, { path, type }) => {
|
|
72
|
+
if (path) {
|
|
73
|
+
const target = pathUtils.followPath(state, path, true);
|
|
74
|
+
return replaceLayoutElement.swapChild(state, target, target, type);
|
|
75
|
+
} else {
|
|
76
|
+
return state;
|
|
77
|
+
}
|
|
78
|
+
};
|
|
79
|
+
const dragDrop = (layoutRoot, action) => {
|
|
80
|
+
const {
|
|
81
|
+
draggedReactElement: newComponent,
|
|
82
|
+
dragInstructions,
|
|
83
|
+
dropTarget
|
|
84
|
+
} = action;
|
|
85
|
+
const existingComponent = dropTarget.component;
|
|
86
|
+
const { pos } = dropTarget;
|
|
87
|
+
const destinationTabstrip = pos?.position?.Header && typeOf.typeOf(existingComponent) === "Stack";
|
|
88
|
+
const { id, version } = propUtils.getProps(newComponent);
|
|
89
|
+
const intrinsicSize = flexUtils.getIntrinsicSize(newComponent);
|
|
90
|
+
let newLayoutRoot;
|
|
91
|
+
if (destinationTabstrip) {
|
|
92
|
+
const [targetTab, insertionPosition] = insertLayoutElement.getInsertTabBeforeAfter(
|
|
93
|
+
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
94
|
+
existingComponent,
|
|
95
|
+
pos
|
|
96
|
+
);
|
|
97
|
+
if (targetTab === void 0) {
|
|
98
|
+
newLayoutRoot = insertLayoutElement.insertIntoContainer(
|
|
99
|
+
layoutRoot,
|
|
100
|
+
existingComponent,
|
|
101
|
+
newComponent
|
|
102
|
+
);
|
|
103
|
+
} else {
|
|
104
|
+
newLayoutRoot = insertLayoutElement.insertBesideChild(
|
|
105
|
+
layoutRoot,
|
|
106
|
+
targetTab,
|
|
107
|
+
newComponent,
|
|
108
|
+
insertionPosition
|
|
109
|
+
);
|
|
110
|
+
}
|
|
111
|
+
} else if (!intrinsicSize && pos?.position?.Centre) {
|
|
112
|
+
newLayoutRoot = replaceLayoutElement._replaceChild(
|
|
113
|
+
layoutRoot,
|
|
114
|
+
existingComponent,
|
|
115
|
+
newComponent
|
|
116
|
+
);
|
|
117
|
+
} else {
|
|
118
|
+
newLayoutRoot = dropLayoutIntoContainer(
|
|
119
|
+
layoutRoot,
|
|
120
|
+
dropTarget,
|
|
121
|
+
newComponent
|
|
122
|
+
);
|
|
123
|
+
}
|
|
124
|
+
if (dragInstructions.DoNotRemove) {
|
|
125
|
+
return newLayoutRoot;
|
|
126
|
+
}
|
|
127
|
+
const finalTarget = pathUtils.findTarget(
|
|
128
|
+
newLayoutRoot,
|
|
129
|
+
(props) => props.id === id && props.version === version
|
|
130
|
+
);
|
|
131
|
+
const finalPath = propUtils.getProp(finalTarget, "path");
|
|
132
|
+
return removeLayoutElement.removeChild(newLayoutRoot, { path: finalPath, type: "remove" });
|
|
133
|
+
};
|
|
134
|
+
const addChild = (layoutRoot, { path: containerPath, component }) => {
|
|
135
|
+
return insertLayoutElement.insertIntoContainer(
|
|
136
|
+
layoutRoot,
|
|
137
|
+
pathUtils.followPath(layoutRoot, containerPath),
|
|
138
|
+
component
|
|
139
|
+
);
|
|
140
|
+
};
|
|
141
|
+
const dropLayoutIntoContainer = (layoutRoot, dropTarget, newComponent) => {
|
|
142
|
+
const { component, pos, clientRect, dropRect } = dropTarget;
|
|
143
|
+
const existingComponent = component;
|
|
144
|
+
const existingComponentPath = propUtils.getProp(existingComponent, "path");
|
|
145
|
+
if (existingComponentPath === "0.0") {
|
|
146
|
+
return wrapLayoutElement.wrap(
|
|
147
|
+
layoutRoot,
|
|
148
|
+
existingComponent,
|
|
149
|
+
newComponent,
|
|
150
|
+
pos
|
|
151
|
+
);
|
|
152
|
+
}
|
|
153
|
+
const targetContainer = pathUtils.followPathToParent(
|
|
154
|
+
layoutRoot,
|
|
155
|
+
existingComponentPath
|
|
156
|
+
);
|
|
157
|
+
if (withTheGrain(pos, targetContainer)) {
|
|
158
|
+
const insertionPosition = pos.position.SouthOrEast ? "after" : "before";
|
|
159
|
+
return insertLayoutElement.insertBesideChild(
|
|
160
|
+
layoutRoot,
|
|
161
|
+
existingComponent,
|
|
162
|
+
newComponent,
|
|
163
|
+
insertionPosition,
|
|
164
|
+
pos,
|
|
165
|
+
clientRect,
|
|
166
|
+
dropRect
|
|
167
|
+
);
|
|
168
|
+
}
|
|
169
|
+
if (!withTheGrain(pos, targetContainer)) {
|
|
170
|
+
return wrapLayoutElement.wrap(
|
|
171
|
+
layoutRoot,
|
|
172
|
+
existingComponent,
|
|
173
|
+
newComponent,
|
|
174
|
+
pos,
|
|
175
|
+
clientRect,
|
|
176
|
+
dropRect
|
|
177
|
+
);
|
|
178
|
+
}
|
|
179
|
+
if (ComponentRegistry.isContainer(typeOf.typeOf(targetContainer))) {
|
|
180
|
+
return wrapLayoutElement.wrap(layoutRoot, existingComponent, newComponent, pos);
|
|
181
|
+
}
|
|
182
|
+
throw Error(`no support right now for position = ${pos.position}`);
|
|
183
|
+
};
|
|
184
|
+
const withTheGrain = (pos, container) => {
|
|
185
|
+
if (pos.position.Centre) {
|
|
186
|
+
return isTerrace(container) || isTower(container);
|
|
187
|
+
}
|
|
188
|
+
return pos.position.NorthOrSouth ? isTower(container) : pos.position.EastOrWest ? isTerrace(container) : false;
|
|
189
|
+
};
|
|
190
|
+
const isTower = (container) => {
|
|
191
|
+
return typeOf.typeOf(container) === "Flexbox" && container.props.style.flexDirection === "column";
|
|
192
|
+
};
|
|
193
|
+
const isTerrace = (container) => {
|
|
194
|
+
return typeOf.typeOf(container) === "Flexbox" && container.props.style.flexDirection !== "column";
|
|
195
|
+
};
|
|
196
|
+
|
|
197
|
+
exports.layoutReducer = layoutReducer;
|
|
198
|
+
//# sourceMappingURL=layout-reducer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-reducer.js","sources":["../../src/layout-reducer/layout-reducer.ts"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { DropPos } from \"../drag-drop/dragDropTypes\";\nimport { DropTarget } from \"../drag-drop/DropTarget\";\nimport { isContainer } from \"../registry/ComponentRegistry\";\nimport {\n findTarget,\n followPath,\n followPathToParent,\n getProp,\n getProps,\n typeOf,\n} from \"../utils\";\nimport { getIntrinsicSize } from \"./flexUtils\";\nimport {\n getInsertTabBeforeAfter,\n insertBesideChild,\n insertIntoContainer,\n} from \"./insert-layout-element\";\nimport { moveChild } from \"./move-layout-element\";\nimport {\n AddAction,\n DragDropAction,\n LayoutActionType,\n LayoutReducerAction,\n MaximizeAction,\n SetPropAction,\n SetPropsAction,\n SwitchTabAction,\n} from \"./layoutTypes\";\nimport { LayoutProps } from \"./layoutUtils\";\nimport { removeChild } from \"./remove-layout-element\";\nimport {\n replaceChild,\n swapChild,\n _replaceChild,\n} from \"./replace-layout-element\";\nimport { resizeFlexChild, resizeFlexChildren } from \"./resize-flex-children\";\nimport { wrap } from \"./wrap-layout-element\";\n\nexport const layoutReducer = (\n state: ReactElement,\n action: LayoutReducerAction\n): ReactElement => {\n switch (action.type) {\n case LayoutActionType.ADD:\n return addChild(state, action);\n case LayoutActionType.DRAG_DROP:\n return dragDrop(state, action);\n case LayoutActionType.MAXIMIZE:\n return setChildProps(state, action);\n case LayoutActionType.REMOVE:\n return removeChild(state, action);\n case LayoutActionType.REPLACE:\n return replaceChild(state, action);\n case LayoutActionType.SET_PROP:\n return setProp(state, action);\n case LayoutActionType.SET_PROPS:\n return setProps(state, action);\n case LayoutActionType.SET_TITLE:\n return setProp(state, {\n type: \"set-prop\",\n path: action.path,\n propName: \"title\",\n propValue: action.title,\n });\n case LayoutActionType.SPLITTER_RESIZE:\n return resizeFlexChildren(state, action);\n case LayoutActionType.LAYOUT_RESIZE:\n return resizeFlexChild(state, action);\n case LayoutActionType.SWITCH_TAB:\n return switchTab(state, action);\n case LayoutActionType.MOVE_CHILD:\n return moveChild(state, action);\n default:\n return state;\n }\n};\n\nconst switchTab = (state: ReactElement, { path, nextIdx }: SwitchTabAction) => {\n const target = followPath(state, path, true);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const replacement = React.cloneElement<any>(target, {\n active: nextIdx,\n });\n return swapChild(state, target, replacement);\n};\n\nconst setProp = (\n state: ReactElement,\n { path, propName, propValue }: SetPropAction\n) => {\n const target = followPath(state, path, true);\n const replacement = React.cloneElement(target, {\n [propName]: propValue,\n });\n return swapChild(state, target, replacement);\n};\n\nconst setProps = (state: ReactElement, { path, props }: SetPropsAction) => {\n const target = followPath(state, path, true);\n const replacement = React.cloneElement(target, props);\n return swapChild(state, target, replacement);\n};\n\nconst setChildProps = (state: ReactElement, { path, type }: MaximizeAction) => {\n if (path) {\n const target = followPath(state, path, true);\n return swapChild(state, target, target, type);\n } else {\n return state;\n }\n};\n\nconst dragDrop = (\n layoutRoot: ReactElement,\n action: DragDropAction\n): ReactElement => {\n const {\n draggedReactElement: newComponent,\n dragInstructions,\n dropTarget,\n } = action;\n const existingComponent = dropTarget.component as ReactElement;\n const { pos } = dropTarget;\n const destinationTabstrip =\n pos?.position?.Header && typeOf(existingComponent) === \"Stack\";\n const { id, version } = getProps(newComponent);\n const intrinsicSize = getIntrinsicSize(newComponent);\n let newLayoutRoot: ReactElement;\n if (destinationTabstrip) {\n const [targetTab, insertionPosition] = getInsertTabBeforeAfter(\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n existingComponent!,\n pos\n );\n if (targetTab === undefined) {\n newLayoutRoot = insertIntoContainer(\n layoutRoot,\n existingComponent,\n newComponent\n );\n } else {\n newLayoutRoot = insertBesideChild(\n layoutRoot,\n targetTab,\n newComponent,\n insertionPosition\n );\n }\n } else if (!intrinsicSize && pos?.position?.Centre) {\n newLayoutRoot = _replaceChild(\n layoutRoot,\n existingComponent as ReactElement,\n newComponent\n );\n } else {\n newLayoutRoot = dropLayoutIntoContainer(\n layoutRoot,\n dropTarget as DropTarget,\n newComponent\n );\n }\n\n if (dragInstructions.DoNotRemove) {\n return newLayoutRoot;\n }\n\n const finalTarget = findTarget(\n newLayoutRoot,\n (props: LayoutProps) => props.id === id && props.version === version\n ) as ReactElement;\n const finalPath = getProp(finalTarget, \"path\");\n return removeChild(newLayoutRoot, { path: finalPath, type: \"remove\" });\n};\n\nconst addChild = (\n layoutRoot: ReactElement,\n { path: containerPath, component }: AddAction\n) => {\n return insertIntoContainer(\n layoutRoot,\n followPath(layoutRoot, containerPath) as ReactElement,\n component\n );\n};\n\nconst dropLayoutIntoContainer = (\n layoutRoot: ReactElement,\n dropTarget: DropTarget,\n newComponent: ReactElement\n): ReactElement => {\n const { component, pos, clientRect, dropRect } = dropTarget;\n const existingComponent = component as ReactElement;\n\n const existingComponentPath = getProp(existingComponent, \"path\");\n\n if (existingComponentPath === \"0.0\") {\n return wrap(\n layoutRoot,\n existingComponent as ReactElement,\n newComponent,\n pos\n );\n }\n\n const targetContainer = followPathToParent(\n layoutRoot,\n existingComponentPath\n ) as ReactElement;\n\n if (withTheGrain(pos, targetContainer)) {\n const insertionPosition = pos.position.SouthOrEast ? \"after\" : \"before\";\n return insertBesideChild(\n layoutRoot,\n existingComponent,\n newComponent,\n insertionPosition,\n pos,\n clientRect,\n dropRect\n );\n }\n\n if (!withTheGrain(pos, targetContainer)) {\n return wrap(\n layoutRoot,\n existingComponent,\n newComponent,\n pos,\n clientRect,\n dropRect\n );\n }\n\n if (isContainer(typeOf(targetContainer) as string)) {\n return wrap(layoutRoot, existingComponent, newComponent, pos);\n }\n\n throw Error(`no support right now for position = ${pos.position}`);\n};\n\nconst withTheGrain = (pos: DropPos, container: ReactElement) => {\n if (pos.position.Centre) {\n return isTerrace(container) || isTower(container);\n }\n\n return pos.position.NorthOrSouth\n ? isTower(container)\n : pos.position.EastOrWest\n ? isTerrace(container)\n : false;\n};\n\nconst isTower = (container: ReactElement) => {\n return (\n typeOf(container) === \"Flexbox\" &&\n container.props.style.flexDirection === \"column\"\n );\n};\n\nconst isTerrace = (container: ReactElement) => {\n return (\n typeOf(container) === \"Flexbox\" &&\n container.props.style.flexDirection !== \"column\"\n );\n};\n"],"names":["LayoutActionType","removeChild","replaceChild","resizeFlexChildren","resizeFlexChild","moveChild","followPath","swapChild","typeOf","getProps","getIntrinsicSize","getInsertTabBeforeAfter","insertIntoContainer","insertBesideChild","_replaceChild","findTarget","getProp","wrap","followPathToParent","isContainer"],"mappings":"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"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
const LayoutActionType = {
|
|
4
|
+
ADD: "add",
|
|
5
|
+
DRAG_START: "drag-start",
|
|
6
|
+
DRAG_DROP: "drag-drop",
|
|
7
|
+
LAYOUT_RESIZE: "layout-resize",
|
|
8
|
+
MAXIMIZE: "maximize",
|
|
9
|
+
MINIMIZE: "minimize",
|
|
10
|
+
MOVE_CHILD: "move-child",
|
|
11
|
+
QUERY: "query",
|
|
12
|
+
REMOVE: "remove",
|
|
13
|
+
REPLACE: "replace",
|
|
14
|
+
RESTORE: "restore",
|
|
15
|
+
SAVE: "save",
|
|
16
|
+
SET_PROP: "set-prop",
|
|
17
|
+
SET_PROPS: "set-props",
|
|
18
|
+
SET_TITLE: "set-title",
|
|
19
|
+
SPLITTER_RESIZE: "splitter-resize",
|
|
20
|
+
SWITCH_TAB: "switch-tab",
|
|
21
|
+
TEAROUT: "tearout"
|
|
22
|
+
};
|
|
23
|
+
const isApplicationLevelChange = (layoutChangeReason) => [
|
|
24
|
+
"switch-active-layout",
|
|
25
|
+
"open-layout",
|
|
26
|
+
"close-layout",
|
|
27
|
+
"rename-layout"
|
|
28
|
+
].includes(layoutChangeReason);
|
|
29
|
+
const isLayoutLevelChange = (layoutChangeReason) => [
|
|
30
|
+
"switch-active-tab",
|
|
31
|
+
"edit-feature-title",
|
|
32
|
+
"save-feature-props",
|
|
33
|
+
"remove-component",
|
|
34
|
+
"resize-component",
|
|
35
|
+
"drag-drop-operation"
|
|
36
|
+
].includes(layoutChangeReason);
|
|
37
|
+
|
|
38
|
+
exports.LayoutActionType = LayoutActionType;
|
|
39
|
+
exports.isApplicationLevelChange = isApplicationLevelChange;
|
|
40
|
+
exports.isLayoutLevelChange = isLayoutLevelChange;
|
|
41
|
+
//# sourceMappingURL=layoutTypes.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layoutTypes.js","sources":["../../src/layout-reducer/layoutTypes.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { NamedFilter } from \"@vuu-ui/vuu-filter-types\";\nimport { CSSProperties, ReactElement } from \"react\";\nimport { DragDropRect, DragInstructions } from \"../drag-drop\";\nimport { DropTarget } from \"../drag-drop/DropTarget\";\nimport { ContributionLocation } from \"../layout-view-actions\";\n\nexport interface WithProps {\n props?: { [key: string]: any };\n}\n\nexport interface WithType {\n props?: any;\n title?: string;\n type: string;\n}\n\nexport interface LayoutRoot extends WithProps {\n active?: number;\n children?: ReactElement[];\n type: string;\n}\n\nexport type ValueOf<T> = T[keyof T];\nexport interface ApplicationSettings {\n leftNav?: {\n activeTabIndex: number;\n expanded: boolean;\n };\n /**\n * filters are keyed by MODULE:tablename\n */\n filters?: { [key: string]: NamedFilter[] };\n}\nexport type ApplicationSetting = ValueOf<ApplicationSettings>;\n\nexport interface ApplicationJSON {\n layout: LayoutJSON;\n settings?: ApplicationSettings;\n}\n\nexport interface LayoutJSON extends WithType {\n active?: number;\n children?: LayoutJSON[];\n id?: string;\n props?: { [key: string]: any };\n state?: any;\n type: string;\n style?: CSSProperties;\n}\n\nexport interface WithActive {\n active?: number;\n}\n\nexport type LayoutModel = LayoutRoot | ReactElement | WithType;\n\nexport type layoutType = \"Flexbox\" | \"View\" | \"DraggableLayout\" | \"Stack\";\n\n// TODO duplicated in layout-action\nexport const LayoutActionType = {\n ADD: \"add\",\n DRAG_START: \"drag-start\",\n DRAG_DROP: \"drag-drop\",\n LAYOUT_RESIZE: \"layout-resize\",\n MAXIMIZE: \"maximize\",\n MINIMIZE: \"minimize\",\n MOVE_CHILD: \"move-child\",\n QUERY: \"query\",\n REMOVE: \"remove\",\n REPLACE: \"replace\",\n RESTORE: \"restore\",\n SAVE: \"save\",\n SET_PROP: \"set-prop\",\n SET_PROPS: \"set-props\",\n SET_TITLE: \"set-title\",\n SPLITTER_RESIZE: \"splitter-resize\",\n SWITCH_TAB: \"switch-tab\",\n TEAROUT: \"tearout\",\n} as const;\n\nexport type AddAction = {\n component: any;\n path: string;\n type: typeof LayoutActionType.ADD;\n};\n\nexport type DragDropAction = {\n draggedReactElement: ReactElement;\n dragInstructions: any;\n dropTarget: Partial<DropTarget>;\n type: typeof LayoutActionType.DRAG_DROP;\n};\n\nexport type MaximizeAction = {\n path?: string;\n type: typeof LayoutActionType.MAXIMIZE;\n};\n\nexport type MinimizeAction = {\n path?: string;\n type: typeof LayoutActionType.MINIMIZE;\n};\n\nexport type MoveChildAction = {\n fromIndex: number;\n toIndex: number;\n path: string;\n type: typeof LayoutActionType.MOVE_CHILD;\n};\n\nexport type QueryAction = {\n path?: string;\n query: string;\n type: typeof LayoutActionType.QUERY;\n};\n\nexport type RemoveAction = {\n path?: string;\n type: typeof LayoutActionType.REMOVE;\n};\n\nexport type ReplaceAction = {\n replacement: any;\n target: any;\n type: typeof LayoutActionType.REPLACE;\n};\n\nexport type RestoreAction = {\n path?: string;\n type: typeof LayoutActionType.RESTORE;\n};\n\nexport type SetPropAction = {\n path: string;\n propName: string;\n propValue: string | number | boolean;\n type: typeof LayoutActionType.SET_PROP;\n};\n\nexport type SetPropsAction = {\n path: string;\n props: { [key: string]: unknown };\n type: typeof LayoutActionType.SET_PROPS;\n};\n\nexport type SetTitleAction = {\n path: string;\n title: string;\n type: typeof LayoutActionType.SET_TITLE;\n};\n\nexport type SplitterResizeAction = {\n path: string;\n sizes: { currentSize: number; flexBasis: number }[];\n type: typeof LayoutActionType.SPLITTER_RESIZE;\n};\n\nexport type LayoutResizeAction = {\n path: string;\n size: number;\n type: typeof LayoutActionType.LAYOUT_RESIZE;\n};\n\nexport type SwitchTabAction = {\n id?: string;\n nextIdx: number;\n path: string;\n type: typeof LayoutActionType.SWITCH_TAB;\n};\n\nexport type TearoutAction = {\n path?: string;\n type: typeof LayoutActionType.TEAROUT;\n};\n\nexport type LayoutReducerAction =\n | AddAction\n | DragDropAction\n | LayoutResizeAction\n | MaximizeAction\n | MinimizeAction\n | MoveChildAction\n | RemoveAction\n | ReplaceAction\n | RestoreAction\n | SetPropAction\n | SetPropsAction\n | SetTitleAction\n | SplitterResizeAction\n | SwitchTabAction;\n\nexport type SaveAction = {\n type: typeof LayoutActionType.SAVE;\n};\n\nexport type AddToolbarContributionViewAction = {\n content: ReactElement;\n location: ContributionLocation;\n type: \"add-toolbar-contribution\";\n};\n\nexport type RemoveToolbarContributionViewAction = {\n location: ContributionLocation;\n type: \"remove-toolbar-contribution\";\n};\n\nexport type MousedownViewAction = {\n preDragActivity?: any;\n index?: number;\n type: \"mousedown\";\n};\n\nexport type DragStartAction = {\n payload?: ReactElement;\n dragContainerPath?: string;\n dragElement?: HTMLElement;\n dragRect: DragDropRect;\n dropTargets?: string[];\n evt: MouseEvent;\n instructions?: DragInstructions;\n path: string;\n type: typeof LayoutActionType.DRAG_START;\n};\n\nexport type LayoutLevelChange =\n | \"switch-active-tab\"\n | \"edit-feature-title\"\n | \"save-feature-props\"\n | \"resize-component\"\n | \"remove-component\"\n | \"drag-drop-operation\";\n\nexport type ApplicationLevelChange =\n | \"switch-active-layout\"\n | \"open-layout\"\n | \"close-layout\"\n | \"rename-layout\"\n | \"resize-application-chrome\";\n\nexport type LayoutChangeReason = LayoutLevelChange | ApplicationLevelChange;\n\nexport type LayoutChangeHandler = (\n layout: LayoutJSON,\n layoutChangeReason: LayoutChangeReason\n) => void;\n\nexport const isApplicationLevelChange = (\n layoutChangeReason: LayoutChangeReason\n): layoutChangeReason is ApplicationLevelChange =>\n [\n \"switch-active-layout\",\n \"open-layout\",\n \"close-layout\",\n \"rename-layout\",\n ].includes(layoutChangeReason);\n\nexport const isLayoutLevelChange = (\n layoutChangeReason: LayoutChangeReason\n): layoutChangeReason is LayoutLevelChange =>\n [\n \"switch-active-tab\",\n \"edit-feature-title\",\n \"save-feature-props\",\n \"remove-component\",\n \"resize-component\",\n \"drag-drop-operation\",\n ].includes(layoutChangeReason);\n"],"names":[],"mappings":";;AA4DO,MAAM,gBAAmB,GAAA;AAAA,EAC9B,GAAK,EAAA,KAAA;AAAA,EACL,UAAY,EAAA,YAAA;AAAA,EACZ,SAAW,EAAA,WAAA;AAAA,EACX,aAAe,EAAA,eAAA;AAAA,EACf,QAAU,EAAA,UAAA;AAAA,EACV,QAAU,EAAA,UAAA;AAAA,EACV,UAAY,EAAA,YAAA;AAAA,EACZ,KAAO,EAAA,OAAA;AAAA,EACP,MAAQ,EAAA,QAAA;AAAA,EACR,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AAAA,EACT,IAAM,EAAA,MAAA;AAAA,EACN,QAAU,EAAA,UAAA;AAAA,EACV,SAAW,EAAA,WAAA;AAAA,EACX,SAAW,EAAA,WAAA;AAAA,EACX,eAAiB,EAAA,iBAAA;AAAA,EACjB,UAAY,EAAA,YAAA;AAAA,EACZ,OAAS,EAAA,SAAA;AACX,EAAA;AAwKa,MAAA,wBAAA,GAA2B,CACtC,kBAEA,KAAA;AAAA,EACE,sBAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,eAAA;AACF,CAAA,CAAE,SAAS,kBAAkB,EAAA;AAElB,MAAA,mBAAA,GAAsB,CACjC,kBAEA,KAAA;AAAA,EACE,mBAAA;AAAA,EACA,oBAAA;AAAA,EACA,oBAAA;AAAA,EACA,kBAAA;AAAA,EACA,kBAAA;AAAA,EACA,qBAAA;AACF,CAAA,CAAE,SAAS,kBAAkB;;;;;;"}
|