@vuu-ui/vuu-layout 2.1.18 → 2.1.19-beta.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.
Files changed (265) hide show
  1. package/package.json +14 -16
  2. package/types/dock-layout/DockLayout.d.ts +4 -4
  3. package/types/dock-layout/Drawer.d.ts +4 -4
  4. package/types/drag-drop/BoxModel.d.ts +7 -7
  5. package/types/flexbox/FlexboxLayout.d.ts +4 -4
  6. package/types/flexbox/Splitter.d.ts +1 -1
  7. package/types/layout-reducer/layoutUtils.d.ts +1 -1
  8. package/types/layout-reducer/remove-layout-element.d.ts +1 -1
  9. package/types/layout-reducer/replace-layout-element.d.ts +2 -2
  10. package/types/layout-reducer/resize-flex-children.d.ts +2 -2
  11. package/types/layout-view/useView.d.ts +1 -1
  12. package/types/placeholder/Placeholder.d.ts +4 -4
  13. package/types/responsive/overflowUtils.d.ts +2 -2
  14. package/types/stack/StackLayout.d.ts +4 -4
  15. package/types/tools/devtools-box/layout-configurator.d.ts +26 -26
  16. package/types/tools/devtools-tree/layout-tree-viewer.d.ts +2 -2
  17. package/types/utils/pathUtils.d.ts +1 -1
  18. package/cjs/Component.js +0 -14
  19. package/cjs/Component.js.map +0 -1
  20. package/cjs/LayoutContainer.css.js +0 -6
  21. package/cjs/LayoutContainer.css.js.map +0 -1
  22. package/cjs/LayoutContainer.js +0 -33
  23. package/cjs/LayoutContainer.js.map +0 -1
  24. package/cjs/dock-layout/DockLayout.css.js +0 -6
  25. package/cjs/dock-layout/DockLayout.css.js.map +0 -1
  26. package/cjs/dock-layout/DockLayout.js +0 -41
  27. package/cjs/dock-layout/DockLayout.js.map +0 -1
  28. package/cjs/dock-layout/Drawer.css.js +0 -6
  29. package/cjs/dock-layout/Drawer.css.js.map +0 -1
  30. package/cjs/dock-layout/Drawer.js +0 -95
  31. package/cjs/dock-layout/Drawer.js.map +0 -1
  32. package/cjs/drag-drop/BoxModel.js +0 -416
  33. package/cjs/drag-drop/BoxModel.js.map +0 -1
  34. package/cjs/drag-drop/DragState.js +0 -161
  35. package/cjs/drag-drop/DragState.js.map +0 -1
  36. package/cjs/drag-drop/Draggable.js +0 -192
  37. package/cjs/drag-drop/Draggable.js.map +0 -1
  38. package/cjs/drag-drop/DropTarget.js +0 -257
  39. package/cjs/drag-drop/DropTarget.js.map +0 -1
  40. package/cjs/drag-drop/DropTargetRenderer.js +0 -218
  41. package/cjs/drag-drop/DropTargetRenderer.js.map +0 -1
  42. package/cjs/flexbox/Flexbox.css.js +0 -6
  43. package/cjs/flexbox/Flexbox.css.js.map +0 -1
  44. package/cjs/flexbox/Flexbox.js +0 -69
  45. package/cjs/flexbox/Flexbox.js.map +0 -1
  46. package/cjs/flexbox/FlexboxLayout.js +0 -30
  47. package/cjs/flexbox/FlexboxLayout.js.map +0 -1
  48. package/cjs/flexbox/Splitter.css.js +0 -6
  49. package/cjs/flexbox/Splitter.css.js.map +0 -1
  50. package/cjs/flexbox/Splitter.js +0 -122
  51. package/cjs/flexbox/Splitter.js.map +0 -1
  52. package/cjs/flexbox/flexbox-utils.js +0 -95
  53. package/cjs/flexbox/flexbox-utils.js.map +0 -1
  54. package/cjs/flexbox/useSplitterResizing.js +0 -197
  55. package/cjs/flexbox/useSplitterResizing.js.map +0 -1
  56. package/cjs/index.js +0 -122
  57. package/cjs/index.js.map +0 -1
  58. package/cjs/layout-action.js +0 -24
  59. package/cjs/layout-action.js.map +0 -1
  60. package/cjs/layout-header/Header.css.js +0 -6
  61. package/cjs/layout-header/Header.css.js.map +0 -1
  62. package/cjs/layout-header/Header.js +0 -152
  63. package/cjs/layout-header/Header.js.map +0 -1
  64. package/cjs/layout-header/useHeader.js +0 -85
  65. package/cjs/layout-header/useHeader.js.map +0 -1
  66. package/cjs/layout-provider/LayoutProvider.js +0 -304
  67. package/cjs/layout-provider/LayoutProvider.js.map +0 -1
  68. package/cjs/layout-provider/LayoutProviderContext.js +0 -23
  69. package/cjs/layout-provider/LayoutProviderContext.js.map +0 -1
  70. package/cjs/layout-provider/useLayoutDragDrop.js +0 -177
  71. package/cjs/layout-provider/useLayoutDragDrop.js.map +0 -1
  72. package/cjs/layout-reducer/flexUtils.js +0 -227
  73. package/cjs/layout-reducer/flexUtils.js.map +0 -1
  74. package/cjs/layout-reducer/insert-layout-element.js +0 -286
  75. package/cjs/layout-reducer/insert-layout-element.js.map +0 -1
  76. package/cjs/layout-reducer/layout-reducer.js +0 -202
  77. package/cjs/layout-reducer/layout-reducer.js.map +0 -1
  78. package/cjs/layout-reducer/layoutTypes.js +0 -40
  79. package/cjs/layout-reducer/layoutTypes.js.map +0 -1
  80. package/cjs/layout-reducer/layoutUtils.js +0 -237
  81. package/cjs/layout-reducer/layoutUtils.js.map +0 -1
  82. package/cjs/layout-reducer/move-layout-element.js +0 -31
  83. package/cjs/layout-reducer/move-layout-element.js.map +0 -1
  84. package/cjs/layout-reducer/remove-layout-element.js +0 -237
  85. package/cjs/layout-reducer/remove-layout-element.js.map +0 -1
  86. package/cjs/layout-reducer/replace-layout-element.js +0 -96
  87. package/cjs/layout-reducer/replace-layout-element.js.map +0 -1
  88. package/cjs/layout-reducer/resize-flex-children.js +0 -62
  89. package/cjs/layout-reducer/resize-flex-children.js.map +0 -1
  90. package/cjs/layout-reducer/wrap-layout-element.js +0 -211
  91. package/cjs/layout-reducer/wrap-layout-element.js.map +0 -1
  92. package/cjs/layout-view/View.css.js +0 -6
  93. package/cjs/layout-view/View.css.js.map +0 -1
  94. package/cjs/layout-view/View.js +0 -160
  95. package/cjs/layout-view/View.js.map +0 -1
  96. package/cjs/layout-view/useView.js +0 -75
  97. package/cjs/layout-view/useView.js.map +0 -1
  98. package/cjs/layout-view/useViewBroadcastChannel.js +0 -35
  99. package/cjs/layout-view/useViewBroadcastChannel.js.map +0 -1
  100. package/cjs/layout-view/useViewResize.js +0 -42
  101. package/cjs/layout-view/useViewResize.js.map +0 -1
  102. package/cjs/layout-view-actions/ViewContext.js +0 -16
  103. package/cjs/layout-view-actions/ViewContext.js.map +0 -1
  104. package/cjs/layout-view-actions/useViewActionDispatcher.js +0 -112
  105. package/cjs/layout-view-actions/useViewActionDispatcher.js.map +0 -1
  106. package/cjs/layout-view-actions/useViewContributions.js +0 -33
  107. package/cjs/layout-view-actions/useViewContributions.js.map +0 -1
  108. package/cjs/palette/Palette.css.js +0 -6
  109. package/cjs/palette/Palette.css.js.map +0 -1
  110. package/cjs/palette/Palette.js +0 -115
  111. package/cjs/palette/Palette.js.map +0 -1
  112. package/cjs/placeholder/LayoutStartPanel.css.js +0 -6
  113. package/cjs/placeholder/LayoutStartPanel.css.js.map +0 -1
  114. package/cjs/placeholder/LayoutStartPanel.js +0 -56
  115. package/cjs/placeholder/LayoutStartPanel.js.map +0 -1
  116. package/cjs/placeholder/Placeholder.css.js +0 -6
  117. package/cjs/placeholder/Placeholder.css.js.map +0 -1
  118. package/cjs/placeholder/Placeholder.js +0 -34
  119. package/cjs/placeholder/Placeholder.js.map +0 -1
  120. package/cjs/responsive/useResizeObserver.js +0 -118
  121. package/cjs/responsive/useResizeObserver.js.map +0 -1
  122. package/cjs/responsive/utils.js +0 -34
  123. package/cjs/responsive/utils.js.map +0 -1
  124. package/cjs/stack/Stack.css.js +0 -6
  125. package/cjs/stack/Stack.css.js.map +0 -1
  126. package/cjs/stack/Stack.js +0 -150
  127. package/cjs/stack/Stack.js.map +0 -1
  128. package/cjs/stack/StackLayout.js +0 -116
  129. package/cjs/stack/StackLayout.js.map +0 -1
  130. package/cjs/use-persistent-state.js +0 -63
  131. package/cjs/use-persistent-state.js.map +0 -1
  132. package/cjs/utils/pathUtils.js +0 -293
  133. package/cjs/utils/pathUtils.js.map +0 -1
  134. package/cjs/utils/propUtils.js +0 -27
  135. package/cjs/utils/propUtils.js.map +0 -1
  136. package/cjs/utils/refUtils.js +0 -12
  137. package/cjs/utils/refUtils.js.map +0 -1
  138. package/cjs/utils/styleUtils.js +0 -15
  139. package/cjs/utils/styleUtils.js.map +0 -1
  140. package/cjs/utils/typeOf.js +0 -27
  141. package/cjs/utils/typeOf.js.map +0 -1
  142. package/esm/Component.js +0 -12
  143. package/esm/Component.js.map +0 -1
  144. package/esm/LayoutContainer.css.js +0 -4
  145. package/esm/LayoutContainer.css.js.map +0 -1
  146. package/esm/LayoutContainer.js +0 -31
  147. package/esm/LayoutContainer.js.map +0 -1
  148. package/esm/dock-layout/DockLayout.css.js +0 -4
  149. package/esm/dock-layout/DockLayout.css.js.map +0 -1
  150. package/esm/dock-layout/DockLayout.js +0 -39
  151. package/esm/dock-layout/DockLayout.js.map +0 -1
  152. package/esm/dock-layout/Drawer.css.js +0 -4
  153. package/esm/dock-layout/Drawer.css.js.map +0 -1
  154. package/esm/dock-layout/Drawer.js +0 -93
  155. package/esm/dock-layout/Drawer.js.map +0 -1
  156. package/esm/drag-drop/BoxModel.js +0 -409
  157. package/esm/drag-drop/BoxModel.js.map +0 -1
  158. package/esm/drag-drop/DragState.js +0 -159
  159. package/esm/drag-drop/DragState.js.map +0 -1
  160. package/esm/drag-drop/Draggable.js +0 -190
  161. package/esm/drag-drop/Draggable.js.map +0 -1
  162. package/esm/drag-drop/DropTarget.js +0 -253
  163. package/esm/drag-drop/DropTarget.js.map +0 -1
  164. package/esm/drag-drop/DropTargetRenderer.js +0 -216
  165. package/esm/drag-drop/DropTargetRenderer.js.map +0 -1
  166. package/esm/flexbox/Flexbox.css.js +0 -4
  167. package/esm/flexbox/Flexbox.css.js.map +0 -1
  168. package/esm/flexbox/Flexbox.js +0 -67
  169. package/esm/flexbox/Flexbox.js.map +0 -1
  170. package/esm/flexbox/FlexboxLayout.js +0 -28
  171. package/esm/flexbox/FlexboxLayout.js.map +0 -1
  172. package/esm/flexbox/Splitter.css.js +0 -4
  173. package/esm/flexbox/Splitter.css.js.map +0 -1
  174. package/esm/flexbox/Splitter.js +0 -120
  175. package/esm/flexbox/Splitter.js.map +0 -1
  176. package/esm/flexbox/flexbox-utils.js +0 -89
  177. package/esm/flexbox/flexbox-utils.js.map +0 -1
  178. package/esm/flexbox/useSplitterResizing.js +0 -195
  179. package/esm/flexbox/useSplitterResizing.js.map +0 -1
  180. package/esm/index.js +0 -33
  181. package/esm/index.js.map +0 -1
  182. package/esm/layout-action.js +0 -22
  183. package/esm/layout-action.js.map +0 -1
  184. package/esm/layout-header/Header.css.js +0 -4
  185. package/esm/layout-header/Header.css.js.map +0 -1
  186. package/esm/layout-header/Header.js +0 -150
  187. package/esm/layout-header/Header.js.map +0 -1
  188. package/esm/layout-header/useHeader.js +0 -83
  189. package/esm/layout-header/useHeader.js.map +0 -1
  190. package/esm/layout-provider/LayoutProvider.js +0 -297
  191. package/esm/layout-provider/LayoutProvider.js.map +0 -1
  192. package/esm/layout-provider/LayoutProviderContext.js +0 -20
  193. package/esm/layout-provider/LayoutProviderContext.js.map +0 -1
  194. package/esm/layout-provider/useLayoutDragDrop.js +0 -175
  195. package/esm/layout-provider/useLayoutDragDrop.js.map +0 -1
  196. package/esm/layout-reducer/flexUtils.js +0 -218
  197. package/esm/layout-reducer/flexUtils.js.map +0 -1
  198. package/esm/layout-reducer/insert-layout-element.js +0 -282
  199. package/esm/layout-reducer/insert-layout-element.js.map +0 -1
  200. package/esm/layout-reducer/layout-reducer.js +0 -200
  201. package/esm/layout-reducer/layout-reducer.js.map +0 -1
  202. package/esm/layout-reducer/layoutTypes.js +0 -36
  203. package/esm/layout-reducer/layoutTypes.js.map +0 -1
  204. package/esm/layout-reducer/layoutUtils.js +0 -226
  205. package/esm/layout-reducer/layoutUtils.js.map +0 -1
  206. package/esm/layout-reducer/move-layout-element.js +0 -29
  207. package/esm/layout-reducer/move-layout-element.js.map +0 -1
  208. package/esm/layout-reducer/remove-layout-element.js +0 -235
  209. package/esm/layout-reducer/remove-layout-element.js.map +0 -1
  210. package/esm/layout-reducer/replace-layout-element.js +0 -92
  211. package/esm/layout-reducer/replace-layout-element.js.map +0 -1
  212. package/esm/layout-reducer/resize-flex-children.js +0 -59
  213. package/esm/layout-reducer/resize-flex-children.js.map +0 -1
  214. package/esm/layout-reducer/wrap-layout-element.js +0 -209
  215. package/esm/layout-reducer/wrap-layout-element.js.map +0 -1
  216. package/esm/layout-view/View.css.js +0 -4
  217. package/esm/layout-view/View.css.js.map +0 -1
  218. package/esm/layout-view/View.js +0 -158
  219. package/esm/layout-view/View.js.map +0 -1
  220. package/esm/layout-view/useView.js +0 -73
  221. package/esm/layout-view/useView.js.map +0 -1
  222. package/esm/layout-view/useViewBroadcastChannel.js +0 -33
  223. package/esm/layout-view/useViewBroadcastChannel.js.map +0 -1
  224. package/esm/layout-view/useViewResize.js +0 -40
  225. package/esm/layout-view/useViewResize.js.map +0 -1
  226. package/esm/layout-view-actions/ViewContext.js +0 -12
  227. package/esm/layout-view-actions/ViewContext.js.map +0 -1
  228. package/esm/layout-view-actions/useViewActionDispatcher.js +0 -110
  229. package/esm/layout-view-actions/useViewActionDispatcher.js.map +0 -1
  230. package/esm/layout-view-actions/useViewContributions.js +0 -31
  231. package/esm/layout-view-actions/useViewContributions.js.map +0 -1
  232. package/esm/palette/Palette.css.js +0 -4
  233. package/esm/palette/Palette.css.js.map +0 -1
  234. package/esm/palette/Palette.js +0 -112
  235. package/esm/palette/Palette.js.map +0 -1
  236. package/esm/placeholder/LayoutStartPanel.css.js +0 -4
  237. package/esm/placeholder/LayoutStartPanel.css.js.map +0 -1
  238. package/esm/placeholder/LayoutStartPanel.js +0 -54
  239. package/esm/placeholder/LayoutStartPanel.js.map +0 -1
  240. package/esm/placeholder/Placeholder.css.js +0 -4
  241. package/esm/placeholder/Placeholder.css.js.map +0 -1
  242. package/esm/placeholder/Placeholder.js +0 -32
  243. package/esm/placeholder/Placeholder.js.map +0 -1
  244. package/esm/responsive/useResizeObserver.js +0 -112
  245. package/esm/responsive/useResizeObserver.js.map +0 -1
  246. package/esm/responsive/utils.js +0 -31
  247. package/esm/responsive/utils.js.map +0 -1
  248. package/esm/stack/Stack.css.js +0 -4
  249. package/esm/stack/Stack.css.js.map +0 -1
  250. package/esm/stack/Stack.js +0 -148
  251. package/esm/stack/Stack.js.map +0 -1
  252. package/esm/stack/StackLayout.js +0 -114
  253. package/esm/stack/StackLayout.js.map +0 -1
  254. package/esm/use-persistent-state.js +0 -58
  255. package/esm/use-persistent-state.js.map +0 -1
  256. package/esm/utils/pathUtils.js +0 -280
  257. package/esm/utils/pathUtils.js.map +0 -1
  258. package/esm/utils/propUtils.js +0 -23
  259. package/esm/utils/propUtils.js.map +0 -1
  260. package/esm/utils/refUtils.js +0 -10
  261. package/esm/utils/refUtils.js.map +0 -1
  262. package/esm/utils/styleUtils.js +0 -13
  263. package/esm/utils/styleUtils.js.map +0 -1
  264. package/esm/utils/typeOf.js +0 -23
  265. package/esm/utils/typeOf.js.map +0 -1
@@ -1,282 +0,0 @@
1
- import { uuid } from '@vuu-ui/vuu-utils';
2
- import React from 'react';
3
- import { nextStep, resetPath } from '../utils/pathUtils.js';
4
- import { getProps, getProp } from '../utils/propUtils.js';
5
- import { typeOf } from '../utils/typeOf.js';
6
- import { getIntrinsicSize, wrapIntrinsicSizeComponentWithFlexbox, createPlaceHolder, getFlexOrIntrinsicStyle, getFlexDimensions } from './flexUtils.js';
7
- import { getManagedDimension, getDefaultTabLabel } from './layoutUtils.js';
8
-
9
- function getInsertTabBeforeAfter(stack, pos) {
10
- const { children: tabs } = stack.props;
11
- const tabCount = tabs.length;
12
- const { index = -1, positionRelativeToTab = "after" } = pos.tab || {};
13
- return index === -1 || index >= tabCount ? [tabs[tabCount - 1], "after"] : [tabs[index] ?? null, positionRelativeToTab];
14
- }
15
- function insertIntoContainer(container, targetContainer, newComponent) {
16
- const {
17
- active: containerActive,
18
- children: containerChildren = [],
19
- path: containerPath
20
- } = getProps(container);
21
- const existingComponentPath = getProp(targetContainer, "path");
22
- const { idx, finalStep } = nextStep(
23
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
24
- containerPath,
25
- existingComponentPath,
26
- true
27
- );
28
- const [insertedIdx, children] = finalStep ? insertIntoChildren(container, containerChildren, newComponent) : [
29
- containerActive,
30
- containerChildren?.map(
31
- (child, index) => index === idx ? insertIntoContainer(
32
- child,
33
- targetContainer,
34
- newComponent
35
- ) : child
36
- )
37
- ];
38
- const active = typeOf(container) === "Stack" ? Array.isArray(insertedIdx) ? insertedIdx[0] : insertedIdx : containerActive;
39
- return React.cloneElement(container, { active }, children);
40
- }
41
- const getDefaultTitle = (containerType, component, index, existingLabels) => containerType === "Stack" ? getDefaultTabLabel(component, index, existingLabels) : void 0;
42
- const getChildrenTitles = (children) => children.map((child) => child.props.title);
43
- function insertIntoChildren(container, containerChildren, newComponent) {
44
- if (Array.isArray(newComponent)) {
45
- const [firstChild, ...rest] = newComponent;
46
- let [idx, children] = insertIntoChildren(
47
- container,
48
- containerChildren,
49
- firstChild
50
- );
51
- for (const child of rest) {
52
- [, children] = insertIntoChildren(container, children, child);
53
- }
54
- return [idx, children];
55
- }
56
- const containerPath = getProp(container, "path");
57
- const count = containerChildren?.length;
58
- const {
59
- id = uuid(),
60
- title = getDefaultTitle(
61
- typeOf(container),
62
- newComponent,
63
- count ?? 0,
64
- getChildrenTitles(containerChildren)
65
- )
66
- } = getProps(newComponent);
67
- if (count) {
68
- return [
69
- count,
70
- containerChildren.concat(
71
- resetPath(newComponent, `${containerPath}.${count}`, {
72
- id,
73
- key: id,
74
- title
75
- })
76
- )
77
- ];
78
- } else {
79
- return [0, [resetPath(newComponent, `${containerPath}.0`, { id, title })]];
80
- }
81
- }
82
- function insertBesideChild(container, existingComponent, newComponent, insertionPosition, pos, clientRect, dropRect) {
83
- const {
84
- active: containerActive,
85
- children: containerChildren,
86
- path: containerPath
87
- } = getProps(container);
88
- const existingComponentPath = getProp(existingComponent, "path");
89
- const { idx, finalStep } = nextStep(containerPath, existingComponentPath);
90
- const [insertedIdx, children] = finalStep ? updateChildren(
91
- container,
92
- containerChildren,
93
- idx,
94
- newComponent,
95
- insertionPosition,
96
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
97
- pos,
98
- clientRect,
99
- dropRect
100
- ) : [
101
- containerActive,
102
- containerChildren.map(
103
- (child, index) => index === idx ? insertBesideChild(
104
- child,
105
- existingComponent,
106
- newComponent,
107
- insertionPosition,
108
- pos,
109
- clientRect,
110
- dropRect
111
- ) : child
112
- )
113
- ];
114
- const active = typeOf(container) === "Stack" ? insertedIdx : containerActive;
115
- return React.cloneElement(container, { active }, children);
116
- }
117
- function updateChildren(container, containerChildren, idx, newComponent, insertionPosition, pos, clientRect, dropRect) {
118
- const intrinsicSize = getIntrinsicSize(newComponent);
119
- if (intrinsicSize?.width && intrinsicSize?.height) {
120
- return insertIntrinsicSizedComponent(
121
- container,
122
- containerChildren,
123
- idx,
124
- newComponent,
125
- insertionPosition,
126
- clientRect,
127
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
128
- dropRect
129
- );
130
- } else {
131
- return insertFlexComponent(
132
- container,
133
- containerChildren,
134
- idx,
135
- newComponent,
136
- insertionPosition,
137
- pos?.width || pos?.height,
138
- clientRect
139
- );
140
- }
141
- }
142
- const getLeadingPlaceholderSize = (flexDirection2, insertionPosition, { top, right, bottom, left }, [rectLeft, rectTop, rectRight, rectBottom]) => {
143
- if (flexDirection2 === "column" && insertionPosition === "before") {
144
- return rectTop - top;
145
- } else if (flexDirection2 === "column") {
146
- return bottom - rectBottom;
147
- } else if (flexDirection2 === "row" && insertionPosition === "before") {
148
- return rectLeft - left;
149
- } else if (flexDirection2 === "row") {
150
- return right - rectRight;
151
- }
152
- };
153
- function insertIntrinsicSizedComponent(container, containerChildren, idx, newComponent, insertionPosition, clientRect, dropRect) {
154
- const {
155
- style: { flexDirection: flexDirection2 }
156
- } = getProps(container);
157
- const [dimension, crossDimension, contraDirection] = getFlexDimensions(flexDirection2);
158
- const { [crossDimension]: intrinsicCrossSize, [dimension]: intrinsicSize } = getIntrinsicSize(newComponent);
159
- const path = getProp(containerChildren[idx], "path");
160
- const placeholderSize = getLeadingPlaceholderSize(
161
- flexDirection2,
162
- insertionPosition,
163
- clientRect,
164
- dropRect
165
- );
166
- const [itemToInsert, size] = intrinsicCrossSize < clientRect[crossDimension] ? [
167
- wrapIntrinsicSizeComponentWithFlexbox(
168
- newComponent,
169
- contraDirection,
170
- path,
171
- clientRect,
172
- dropRect
173
- ),
174
- intrinsicSize
175
- ] : [newComponent, void 0];
176
- const placeholder = placeholderSize ? createPlaceHolder(path, placeholderSize, { flexGrow: 0, flexShrink: 0 }) : void 0;
177
- if (intrinsicCrossSize > clientRect[crossDimension]) {
178
- containerChildren = containerChildren.map((child) => {
179
- if (getProp(child, "placeholder")) {
180
- return child;
181
- } else {
182
- const { [crossDimension]: intrinsicCrossChildSize } = getIntrinsicSize(
183
- child
184
- );
185
- if (intrinsicCrossChildSize && intrinsicCrossChildSize < intrinsicCrossSize) {
186
- return wrapIntrinsicSizeComponentWithFlexbox(
187
- child,
188
- contraDirection,
189
- getProp(child, "path")
190
- );
191
- } else {
192
- return child;
193
- }
194
- }
195
- });
196
- }
197
- return insertFlexComponent(
198
- container,
199
- containerChildren,
200
- idx,
201
- itemToInsert,
202
- insertionPosition,
203
- size,
204
- clientRect,
205
- placeholder
206
- );
207
- }
208
- function insertFlexComponent(container, containerChildren, idx, newComponent, insertionPosition, size, targetRect, placeholder) {
209
- const containerPath = getProp(container, "path");
210
- let insertedIdx = 0;
211
- const children = !containerChildren || containerChildren.length === 0 ? [newComponent] : containerChildren.reduce((arr, child, i) => {
212
- if (idx === i) {
213
- const [existingComponent, insertedComponent] = getStyledComponents(container, child, newComponent, targetRect);
214
- if (insertionPosition === "before") {
215
- if (placeholder) {
216
- arr.push(placeholder, insertedComponent, existingComponent);
217
- } else {
218
- arr.push(insertedComponent, existingComponent);
219
- }
220
- } else {
221
- if (placeholder) {
222
- arr.push(existingComponent, insertedComponent, placeholder);
223
- } else {
224
- arr.push(existingComponent, insertedComponent);
225
- }
226
- }
227
- insertedIdx = arr.indexOf(insertedComponent);
228
- } else {
229
- arr.push(child);
230
- }
231
- return arr;
232
- }, []).map(
233
- (child, i) => i < insertedIdx ? child : resetPath(child, `${containerPath}.${i}`)
234
- );
235
- return [insertedIdx, children];
236
- }
237
- function getStyledComponents(container, existingComponent, newComponent, targetRect) {
238
- const id = uuid();
239
- let { version = 0 } = getProps(newComponent);
240
- version += 1;
241
- if (typeOf(container) === "Flexbox") {
242
- const { style: containerStyle } = container.props;
243
- const [dim] = getManagedDimension(containerStyle);
244
- const splitterSize = 6;
245
- const size = { [dim]: (targetRect[dim] - splitterSize) / 2 };
246
- const existingComponentStyle = getFlexOrIntrinsicStyle(
247
- existingComponent,
248
- dim,
249
- size
250
- );
251
- const newComponentStyle = getFlexOrIntrinsicStyle(newComponent, dim, size);
252
- return [
253
- React.cloneElement(existingComponent, {
254
- style: existingComponentStyle
255
- }),
256
- React.cloneElement(newComponent, {
257
- id,
258
- version,
259
- style: newComponentStyle
260
- })
261
- ];
262
- } else {
263
- const {
264
- style: { left: _1, top: _2, flex: _3, ...style } = {
265
- left: void 0,
266
- top: void 0,
267
- flex: void 0
268
- }
269
- } = getProps(newComponent);
270
- return [
271
- existingComponent,
272
- React.cloneElement(newComponent, {
273
- id,
274
- version,
275
- style: { ...style, flex: "1 1 0px" }
276
- })
277
- ];
278
- }
279
- }
280
-
281
- export { getInsertTabBeforeAfter, insertBesideChild, insertIntoContainer };
282
- //# sourceMappingURL=insert-layout-element.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"insert-layout-element.js","sources":["../../../../packages/vuu-layout/src/layout-reducer/insert-layout-element.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { LayoutModel, 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 {\n LayoutProps,\n getDefaultTabLabel,\n getManagedDimension,\n} from \"./layoutUtils\";\n\ntype insertionPosition = \"before\" | \"after\";\n\nexport function getInsertTabBeforeAfter(stack: LayoutModel, pos: DropPos) {\n const { children: tabs } = stack.props as any;\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 | 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 } as any, 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 as any).title);\n\nfunction insertIntoChildren(\n container: ReactElement,\n containerChildren: ReactElement[],\n newComponent: ReactElement | ReactElement[],\n): [number, ReactElement[]] {\n if (Array.isArray(newComponent)) {\n const [firstChild, ...rest] = newComponent;\n let [idx, children] = insertIntoChildren(\n container,\n containerChildren,\n firstChild,\n );\n for (const child of rest) {\n [, children] = insertIntoChildren(container, children, child);\n }\n return [idx, children];\n }\n\n const containerPath = getProp(container, \"path\");\n const count = containerChildren?.length;\n\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 } as any, 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 { style: containerStyle } = container.props as any;\n const [dim] = getManagedDimension(containerStyle);\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 } as any),\n React.cloneElement(newComponent, {\n id,\n version,\n style: newComponentStyle,\n } as any),\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 } as any),\n ];\n }\n}\n"],"names":["flexDirection"],"mappings":"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"}
@@ -1,200 +0,0 @@
1
- import { isContainer } from '@vuu-ui/vuu-utils';
2
- import React from 'react';
3
- import { followPath, findTarget, followPathToParent } from '../utils/pathUtils.js';
4
- import { getProps, getProp } from '../utils/propUtils.js';
5
- import { typeOf } from '../utils/typeOf.js';
6
- import { getIntrinsicSize } from './flexUtils.js';
7
- import { getInsertTabBeforeAfter, insertIntoContainer, insertBesideChild } from './insert-layout-element.js';
8
- import { moveChild } from './move-layout-element.js';
9
- import { LayoutActionType } from './layoutTypes.js';
10
- import { removeChild } from './remove-layout-element.js';
11
- import { replaceChild, swapChild, _replaceChild } from './replace-layout-element.js';
12
- import { resizeFlexChild, resizeFlexChildren } from './resize-flex-children.js';
13
- import { wrap } from './wrap-layout-element.js';
14
-
15
- const layoutReducer = (state, action) => {
16
- switch (action.type) {
17
- case LayoutActionType.ADD:
18
- return addChild(state, action);
19
- case LayoutActionType.DRAG_DROP:
20
- return dragDrop(state, action);
21
- case "collapse":
22
- case "expand":
23
- return setChildProps(state, action);
24
- case LayoutActionType.REMOVE:
25
- return removeChild(state, action);
26
- case LayoutActionType.REPLACE:
27
- return replaceChild(state, action);
28
- case LayoutActionType.SET_PROP:
29
- return setProp(state, action);
30
- case LayoutActionType.SET_PROPS:
31
- return setProps(state, action);
32
- case LayoutActionType.SET_TITLE:
33
- return setProp(state, {
34
- type: "set-prop",
35
- path: action.path,
36
- propName: "title",
37
- propValue: action.title
38
- });
39
- case LayoutActionType.SPLITTER_RESIZE:
40
- return resizeFlexChildren(state, action);
41
- case LayoutActionType.LAYOUT_RESIZE:
42
- return resizeFlexChild(state, action);
43
- case LayoutActionType.SWITCH_TAB:
44
- return switchTab(state, action);
45
- case LayoutActionType.MOVE_CHILD:
46
- return moveChild(state, action);
47
- default:
48
- return state;
49
- }
50
- };
51
- const switchTab = (state, { path, nextIdx }) => {
52
- const target = followPath(state, path, true);
53
- const replacement = React.cloneElement(target, {
54
- active: nextIdx
55
- });
56
- return swapChild(state, target, replacement);
57
- };
58
- const setProp = (state, { path, propName, propValue }) => {
59
- const target = followPath(state, path, true);
60
- const replacement = React.cloneElement(target, {
61
- [propName]: propValue
62
- });
63
- return swapChild(state, target, replacement);
64
- };
65
- const setProps = (state, { path, props }) => {
66
- const target = followPath(state, path, true);
67
- const replacement = React.cloneElement(target, props);
68
- return swapChild(state, target, replacement);
69
- };
70
- const setChildProps = (state, { path, type }) => {
71
- if (path) {
72
- const target = followPath(state, path, true);
73
- return swapChild(state, target, target, type);
74
- } else {
75
- return state;
76
- }
77
- };
78
- const dragDrop = (layoutRoot, action) => {
79
- const {
80
- draggedReactElement: newComponent,
81
- dragInstructions,
82
- dropTarget
83
- } = action;
84
- const existingComponent = dropTarget.component;
85
- const { pos } = dropTarget;
86
- const destinationTabstrip = pos?.position?.Header && typeOf(existingComponent) === "Stack";
87
- const { id, version } = getProps(newComponent);
88
- const intrinsicSize = getIntrinsicSize(newComponent);
89
- let newLayoutRoot;
90
- if (destinationTabstrip) {
91
- const [targetTab, insertionPosition] = getInsertTabBeforeAfter(
92
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
93
- existingComponent,
94
- pos
95
- );
96
- if (targetTab === void 0) {
97
- newLayoutRoot = insertIntoContainer(
98
- layoutRoot,
99
- existingComponent,
100
- newComponent
101
- );
102
- } else {
103
- newLayoutRoot = insertBesideChild(
104
- layoutRoot,
105
- targetTab,
106
- newComponent,
107
- insertionPosition
108
- );
109
- }
110
- } else if (!intrinsicSize && pos?.position?.Centre) {
111
- newLayoutRoot = _replaceChild(
112
- layoutRoot,
113
- existingComponent,
114
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
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 = findTarget(
128
- newLayoutRoot,
129
- (props) => props.id === id && props.version === version
130
- );
131
- const finalPath = getProp(finalTarget, "path");
132
- return removeChild(newLayoutRoot, { path: finalPath, type: "remove" });
133
- };
134
- const addChild = (layoutRoot, { path: containerPath, component }) => {
135
- return insertIntoContainer(
136
- layoutRoot,
137
- 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 = getProp(existingComponent, "path");
145
- if (existingComponentPath === "0.0") {
146
- return wrap(
147
- layoutRoot,
148
- existingComponent,
149
- newComponent,
150
- pos
151
- );
152
- }
153
- const targetContainer = followPathToParent(
154
- layoutRoot,
155
- existingComponentPath
156
- );
157
- if (withTheGrain(pos, targetContainer)) {
158
- const insertionPosition = pos.position.SouthOrEast ? "after" : "before";
159
- return insertBesideChild(
160
- layoutRoot,
161
- existingComponent,
162
- newComponent,
163
- insertionPosition,
164
- pos,
165
- clientRect,
166
- dropRect
167
- );
168
- }
169
- if (!withTheGrain(pos, targetContainer)) {
170
- return wrap(
171
- layoutRoot,
172
- existingComponent,
173
- newComponent,
174
- pos,
175
- clientRect,
176
- dropRect
177
- );
178
- }
179
- if (isContainer(typeOf(targetContainer))) {
180
- return 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
- const { style } = container.props;
192
- return typeOf(container) === "Flexbox" && style.flexDirection === "column";
193
- };
194
- const isTerrace = (container) => {
195
- const { style } = container.props;
196
- return typeOf(container) === "Flexbox" && style.flexDirection !== "column";
197
- };
198
-
199
- export { layoutReducer };
200
- //# sourceMappingURL=layout-reducer.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"layout-reducer.js","sources":["../../../../packages/vuu-layout/src/layout-reducer/layout-reducer.ts"],"sourcesContent":["import { isContainer } from \"@vuu-ui/vuu-utils\";\nimport React, { ReactElement } from \"react\";\nimport { DropPos } from \"../drag-drop/dragDropTypes\";\nimport { DropTarget } from \"../drag-drop/DropTarget\";\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 CollapseAction,\n DragDropAction,\n ExpandAction,\n LayoutActionType,\n LayoutReducerAction,\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 \"collapse\":\n case \"expand\":\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 = (\n state: ReactElement,\n { path, type }: CollapseAction | ExpandAction,\n) => {\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n newComponent as any,\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { style } = container.props as any;\n return typeOf(container) === \"Flexbox\" && style.flexDirection === \"column\";\n};\n\nconst isTerrace = (container: ReactElement) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { style } = container.props as any;\n return typeOf(container) === \"Flexbox\" && style.flexDirection !== \"column\";\n};\n"],"names":[],"mappings":"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"}
@@ -1,36 +0,0 @@
1
- const LayoutActionType = {
2
- ADD: "add",
3
- DRAG_START: "drag-start",
4
- DRAG_DROP: "drag-drop",
5
- LAYOUT_RESIZE: "layout-resize",
6
- MAXIMIZE: "maximize",
7
- MINIMIZE: "minimize",
8
- MOVE_CHILD: "move-child",
9
- QUERY: "query",
10
- REMOVE: "remove",
11
- REPLACE: "replace",
12
- RESTORE: "restore",
13
- SET_PROP: "set-prop",
14
- SET_PROPS: "set-props",
15
- SET_TITLE: "set-title",
16
- SPLITTER_RESIZE: "splitter-resize",
17
- SWITCH_TAB: "switch-tab",
18
- TEAROUT: "tearout"
19
- };
20
- const isApplicationLevelChange = (layoutChangeReason) => [
21
- "switch-active-layout",
22
- "open-layout",
23
- "close-layout",
24
- "rename-layout"
25
- ].includes(layoutChangeReason);
26
- const isLayoutLevelChange = (layoutChangeReason) => [
27
- "switch-active-tab",
28
- "edit-feature-title",
29
- "save-feature-props",
30
- "remove-component",
31
- "resize-component",
32
- "drag-drop-operation"
33
- ].includes(layoutChangeReason);
34
-
35
- export { LayoutActionType, isApplicationLevelChange, isLayoutLevelChange };
36
- //# sourceMappingURL=layoutTypes.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"layoutTypes.js","sources":["../../../../packages/vuu-layout/src/layout-reducer/layoutTypes.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { LayoutJSON } from \"@vuu-ui/vuu-utils\";\nimport { ReactElement } from \"react\";\nimport { DragDropRect, DragInstructions } from \"../drag-drop\";\nimport { DropTarget } from \"../drag-drop/DropTarget\";\n\nexport type layoutType = \"Flexbox\" | \"View\" | \"LayoutContainer\" | \"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 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 CollapseAction = {\n path?: string;\n type: \"collapse\";\n};\n\nexport type ExpandAction = {\n path?: string;\n type: \"expand\";\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 | CollapseAction\n | ExpandAction\n | MoveChildAction\n | RemoveAction\n | ReplaceAction\n | RestoreAction\n | SetPropAction\n | SetPropsAction\n | SetTitleAction\n | SplitterResizeAction\n | SwitchTabAction;\n\nexport type MousedownViewAction = {\n preDragActivity?: unknown;\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 | \"add-component\"\n | \"drag-drop-operation\"\n | \"edit-feature-title\"\n | \"remove-component\"\n | \"resize-component\"\n | \"switch-active-tab\"\n | \"save-feature-props\";\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":"AASO,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,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;AACX;AA+Ja,MAAA,wBAAA,GAA2B,CACtC,kBAEA,KAAA;AAAA,EACE,sBAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAAA,CAAE,SAAS,kBAAkB;AAElB,MAAA,mBAAA,GAAsB,CACjC,kBAEA,KAAA;AAAA,EACE,mBAAA;AAAA,EACA,oBAAA;AAAA,EACA,oBAAA;AAAA,EACA,kBAAA;AAAA,EACA,kBAAA;AAAA,EACA;AACF,CAAA,CAAE,SAAS,kBAAkB;;;;"}