@vuu-ui/vuu-layout 0.13.6 → 0.13.8

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 (245) hide show
  1. package/cjs/index.js +5513 -113
  2. package/cjs/index.js.map +1 -1
  3. package/esm/index.js +5436 -32
  4. package/esm/index.js.map +1 -1
  5. package/package.json +9 -9
  6. package/cjs/Component.js +0 -14
  7. package/cjs/Component.js.map +0 -1
  8. package/cjs/LayoutContainer.css.js +0 -6
  9. package/cjs/LayoutContainer.css.js.map +0 -1
  10. package/cjs/LayoutContainer.js +0 -33
  11. package/cjs/LayoutContainer.js.map +0 -1
  12. package/cjs/dock-layout/DockLayout.css.js +0 -6
  13. package/cjs/dock-layout/DockLayout.css.js.map +0 -1
  14. package/cjs/dock-layout/DockLayout.js +0 -41
  15. package/cjs/dock-layout/DockLayout.js.map +0 -1
  16. package/cjs/dock-layout/Drawer.css.js +0 -6
  17. package/cjs/dock-layout/Drawer.css.js.map +0 -1
  18. package/cjs/dock-layout/Drawer.js +0 -95
  19. package/cjs/dock-layout/Drawer.js.map +0 -1
  20. package/cjs/drag-drop/BoxModel.js +0 -416
  21. package/cjs/drag-drop/BoxModel.js.map +0 -1
  22. package/cjs/drag-drop/DragState.js +0 -161
  23. package/cjs/drag-drop/DragState.js.map +0 -1
  24. package/cjs/drag-drop/Draggable.js +0 -192
  25. package/cjs/drag-drop/Draggable.js.map +0 -1
  26. package/cjs/drag-drop/DropTarget.js +0 -257
  27. package/cjs/drag-drop/DropTarget.js.map +0 -1
  28. package/cjs/drag-drop/DropTargetRenderer.js +0 -218
  29. package/cjs/drag-drop/DropTargetRenderer.js.map +0 -1
  30. package/cjs/flexbox/Flexbox.css.js +0 -6
  31. package/cjs/flexbox/Flexbox.css.js.map +0 -1
  32. package/cjs/flexbox/Flexbox.js +0 -69
  33. package/cjs/flexbox/Flexbox.js.map +0 -1
  34. package/cjs/flexbox/FlexboxLayout.js +0 -30
  35. package/cjs/flexbox/FlexboxLayout.js.map +0 -1
  36. package/cjs/flexbox/Splitter.css.js +0 -6
  37. package/cjs/flexbox/Splitter.css.js.map +0 -1
  38. package/cjs/flexbox/Splitter.js +0 -122
  39. package/cjs/flexbox/Splitter.js.map +0 -1
  40. package/cjs/flexbox/flexbox-utils.js +0 -95
  41. package/cjs/flexbox/flexbox-utils.js.map +0 -1
  42. package/cjs/flexbox/useSplitterResizing.js +0 -198
  43. package/cjs/flexbox/useSplitterResizing.js.map +0 -1
  44. package/cjs/layout-action.js +0 -24
  45. package/cjs/layout-action.js.map +0 -1
  46. package/cjs/layout-header/Header.css.js +0 -6
  47. package/cjs/layout-header/Header.css.js.map +0 -1
  48. package/cjs/layout-header/Header.js +0 -152
  49. package/cjs/layout-header/Header.js.map +0 -1
  50. package/cjs/layout-header/useHeader.js +0 -86
  51. package/cjs/layout-header/useHeader.js.map +0 -1
  52. package/cjs/layout-provider/LayoutProvider.js +0 -306
  53. package/cjs/layout-provider/LayoutProvider.js.map +0 -1
  54. package/cjs/layout-provider/LayoutProviderContext.js +0 -23
  55. package/cjs/layout-provider/LayoutProviderContext.js.map +0 -1
  56. package/cjs/layout-provider/useLayoutDragDrop.js +0 -177
  57. package/cjs/layout-provider/useLayoutDragDrop.js.map +0 -1
  58. package/cjs/layout-reducer/flexUtils.js +0 -227
  59. package/cjs/layout-reducer/flexUtils.js.map +0 -1
  60. package/cjs/layout-reducer/insert-layout-element.js +0 -286
  61. package/cjs/layout-reducer/insert-layout-element.js.map +0 -1
  62. package/cjs/layout-reducer/layout-reducer.js +0 -202
  63. package/cjs/layout-reducer/layout-reducer.js.map +0 -1
  64. package/cjs/layout-reducer/layoutTypes.js +0 -40
  65. package/cjs/layout-reducer/layoutTypes.js.map +0 -1
  66. package/cjs/layout-reducer/layoutUtils.js +0 -237
  67. package/cjs/layout-reducer/layoutUtils.js.map +0 -1
  68. package/cjs/layout-reducer/move-layout-element.js +0 -31
  69. package/cjs/layout-reducer/move-layout-element.js.map +0 -1
  70. package/cjs/layout-reducer/remove-layout-element.js +0 -237
  71. package/cjs/layout-reducer/remove-layout-element.js.map +0 -1
  72. package/cjs/layout-reducer/replace-layout-element.js +0 -96
  73. package/cjs/layout-reducer/replace-layout-element.js.map +0 -1
  74. package/cjs/layout-reducer/resize-flex-children.js +0 -62
  75. package/cjs/layout-reducer/resize-flex-children.js.map +0 -1
  76. package/cjs/layout-reducer/wrap-layout-element.js +0 -211
  77. package/cjs/layout-reducer/wrap-layout-element.js.map +0 -1
  78. package/cjs/layout-view/View.css.js +0 -6
  79. package/cjs/layout-view/View.css.js.map +0 -1
  80. package/cjs/layout-view/View.js +0 -167
  81. package/cjs/layout-view/View.js.map +0 -1
  82. package/cjs/layout-view/useView.js +0 -91
  83. package/cjs/layout-view/useView.js.map +0 -1
  84. package/cjs/layout-view/useViewBroadcastChannel.js +0 -35
  85. package/cjs/layout-view/useViewBroadcastChannel.js.map +0 -1
  86. package/cjs/layout-view/useViewResize.js +0 -42
  87. package/cjs/layout-view/useViewResize.js.map +0 -1
  88. package/cjs/layout-view-actions/ViewContext.js +0 -16
  89. package/cjs/layout-view-actions/ViewContext.js.map +0 -1
  90. package/cjs/layout-view-actions/useViewActionDispatcher.js +0 -129
  91. package/cjs/layout-view-actions/useViewActionDispatcher.js.map +0 -1
  92. package/cjs/palette/Palette.css.js +0 -6
  93. package/cjs/palette/Palette.css.js.map +0 -1
  94. package/cjs/palette/Palette.js +0 -132
  95. package/cjs/palette/Palette.js.map +0 -1
  96. package/cjs/placeholder/LayoutStartPanel.css.js +0 -6
  97. package/cjs/placeholder/LayoutStartPanel.css.js.map +0 -1
  98. package/cjs/placeholder/LayoutStartPanel.js +0 -56
  99. package/cjs/placeholder/LayoutStartPanel.js.map +0 -1
  100. package/cjs/placeholder/Placeholder.css.js +0 -6
  101. package/cjs/placeholder/Placeholder.css.js.map +0 -1
  102. package/cjs/placeholder/Placeholder.js +0 -34
  103. package/cjs/placeholder/Placeholder.js.map +0 -1
  104. package/cjs/responsive/useResizeObserver.js +0 -118
  105. package/cjs/responsive/useResizeObserver.js.map +0 -1
  106. package/cjs/responsive/utils.js +0 -34
  107. package/cjs/responsive/utils.js.map +0 -1
  108. package/cjs/stack/Stack.css.js +0 -6
  109. package/cjs/stack/Stack.css.js.map +0 -1
  110. package/cjs/stack/Stack.js +0 -150
  111. package/cjs/stack/Stack.js.map +0 -1
  112. package/cjs/stack/StackLayout.js +0 -118
  113. package/cjs/stack/StackLayout.js.map +0 -1
  114. package/cjs/use-persistent-state.js +0 -112
  115. package/cjs/use-persistent-state.js.map +0 -1
  116. package/cjs/utils/pathUtils.js +0 -293
  117. package/cjs/utils/pathUtils.js.map +0 -1
  118. package/cjs/utils/propUtils.js +0 -27
  119. package/cjs/utils/propUtils.js.map +0 -1
  120. package/cjs/utils/refUtils.js +0 -12
  121. package/cjs/utils/refUtils.js.map +0 -1
  122. package/cjs/utils/styleUtils.js +0 -15
  123. package/cjs/utils/styleUtils.js.map +0 -1
  124. package/cjs/utils/typeOf.js +0 -27
  125. package/cjs/utils/typeOf.js.map +0 -1
  126. package/esm/Component.js +0 -12
  127. package/esm/Component.js.map +0 -1
  128. package/esm/LayoutContainer.css.js +0 -4
  129. package/esm/LayoutContainer.css.js.map +0 -1
  130. package/esm/LayoutContainer.js +0 -31
  131. package/esm/LayoutContainer.js.map +0 -1
  132. package/esm/dock-layout/DockLayout.css.js +0 -4
  133. package/esm/dock-layout/DockLayout.css.js.map +0 -1
  134. package/esm/dock-layout/DockLayout.js +0 -39
  135. package/esm/dock-layout/DockLayout.js.map +0 -1
  136. package/esm/dock-layout/Drawer.css.js +0 -4
  137. package/esm/dock-layout/Drawer.css.js.map +0 -1
  138. package/esm/dock-layout/Drawer.js +0 -93
  139. package/esm/dock-layout/Drawer.js.map +0 -1
  140. package/esm/drag-drop/BoxModel.js +0 -409
  141. package/esm/drag-drop/BoxModel.js.map +0 -1
  142. package/esm/drag-drop/DragState.js +0 -159
  143. package/esm/drag-drop/DragState.js.map +0 -1
  144. package/esm/drag-drop/Draggable.js +0 -190
  145. package/esm/drag-drop/Draggable.js.map +0 -1
  146. package/esm/drag-drop/DropTarget.js +0 -253
  147. package/esm/drag-drop/DropTarget.js.map +0 -1
  148. package/esm/drag-drop/DropTargetRenderer.js +0 -216
  149. package/esm/drag-drop/DropTargetRenderer.js.map +0 -1
  150. package/esm/flexbox/Flexbox.css.js +0 -4
  151. package/esm/flexbox/Flexbox.css.js.map +0 -1
  152. package/esm/flexbox/Flexbox.js +0 -67
  153. package/esm/flexbox/Flexbox.js.map +0 -1
  154. package/esm/flexbox/FlexboxLayout.js +0 -28
  155. package/esm/flexbox/FlexboxLayout.js.map +0 -1
  156. package/esm/flexbox/Splitter.css.js +0 -4
  157. package/esm/flexbox/Splitter.css.js.map +0 -1
  158. package/esm/flexbox/Splitter.js +0 -120
  159. package/esm/flexbox/Splitter.js.map +0 -1
  160. package/esm/flexbox/flexbox-utils.js +0 -89
  161. package/esm/flexbox/flexbox-utils.js.map +0 -1
  162. package/esm/flexbox/useSplitterResizing.js +0 -196
  163. package/esm/flexbox/useSplitterResizing.js.map +0 -1
  164. package/esm/layout-action.js +0 -22
  165. package/esm/layout-action.js.map +0 -1
  166. package/esm/layout-header/Header.css.js +0 -4
  167. package/esm/layout-header/Header.css.js.map +0 -1
  168. package/esm/layout-header/Header.js +0 -150
  169. package/esm/layout-header/Header.js.map +0 -1
  170. package/esm/layout-header/useHeader.js +0 -84
  171. package/esm/layout-header/useHeader.js.map +0 -1
  172. package/esm/layout-provider/LayoutProvider.js +0 -299
  173. package/esm/layout-provider/LayoutProvider.js.map +0 -1
  174. package/esm/layout-provider/LayoutProviderContext.js +0 -20
  175. package/esm/layout-provider/LayoutProviderContext.js.map +0 -1
  176. package/esm/layout-provider/useLayoutDragDrop.js +0 -175
  177. package/esm/layout-provider/useLayoutDragDrop.js.map +0 -1
  178. package/esm/layout-reducer/flexUtils.js +0 -218
  179. package/esm/layout-reducer/flexUtils.js.map +0 -1
  180. package/esm/layout-reducer/insert-layout-element.js +0 -282
  181. package/esm/layout-reducer/insert-layout-element.js.map +0 -1
  182. package/esm/layout-reducer/layout-reducer.js +0 -200
  183. package/esm/layout-reducer/layout-reducer.js.map +0 -1
  184. package/esm/layout-reducer/layoutTypes.js +0 -36
  185. package/esm/layout-reducer/layoutTypes.js.map +0 -1
  186. package/esm/layout-reducer/layoutUtils.js +0 -226
  187. package/esm/layout-reducer/layoutUtils.js.map +0 -1
  188. package/esm/layout-reducer/move-layout-element.js +0 -29
  189. package/esm/layout-reducer/move-layout-element.js.map +0 -1
  190. package/esm/layout-reducer/remove-layout-element.js +0 -235
  191. package/esm/layout-reducer/remove-layout-element.js.map +0 -1
  192. package/esm/layout-reducer/replace-layout-element.js +0 -92
  193. package/esm/layout-reducer/replace-layout-element.js.map +0 -1
  194. package/esm/layout-reducer/resize-flex-children.js +0 -59
  195. package/esm/layout-reducer/resize-flex-children.js.map +0 -1
  196. package/esm/layout-reducer/wrap-layout-element.js +0 -209
  197. package/esm/layout-reducer/wrap-layout-element.js.map +0 -1
  198. package/esm/layout-view/View.css.js +0 -4
  199. package/esm/layout-view/View.css.js.map +0 -1
  200. package/esm/layout-view/View.js +0 -165
  201. package/esm/layout-view/View.js.map +0 -1
  202. package/esm/layout-view/useView.js +0 -89
  203. package/esm/layout-view/useView.js.map +0 -1
  204. package/esm/layout-view/useViewBroadcastChannel.js +0 -33
  205. package/esm/layout-view/useViewBroadcastChannel.js.map +0 -1
  206. package/esm/layout-view/useViewResize.js +0 -40
  207. package/esm/layout-view/useViewResize.js.map +0 -1
  208. package/esm/layout-view-actions/ViewContext.js +0 -12
  209. package/esm/layout-view-actions/ViewContext.js.map +0 -1
  210. package/esm/layout-view-actions/useViewActionDispatcher.js +0 -127
  211. package/esm/layout-view-actions/useViewActionDispatcher.js.map +0 -1
  212. package/esm/palette/Palette.css.js +0 -4
  213. package/esm/palette/Palette.css.js.map +0 -1
  214. package/esm/palette/Palette.js +0 -129
  215. package/esm/palette/Palette.js.map +0 -1
  216. package/esm/placeholder/LayoutStartPanel.css.js +0 -4
  217. package/esm/placeholder/LayoutStartPanel.css.js.map +0 -1
  218. package/esm/placeholder/LayoutStartPanel.js +0 -54
  219. package/esm/placeholder/LayoutStartPanel.js.map +0 -1
  220. package/esm/placeholder/Placeholder.css.js +0 -4
  221. package/esm/placeholder/Placeholder.css.js.map +0 -1
  222. package/esm/placeholder/Placeholder.js +0 -32
  223. package/esm/placeholder/Placeholder.js.map +0 -1
  224. package/esm/responsive/useResizeObserver.js +0 -112
  225. package/esm/responsive/useResizeObserver.js.map +0 -1
  226. package/esm/responsive/utils.js +0 -31
  227. package/esm/responsive/utils.js.map +0 -1
  228. package/esm/stack/Stack.css.js +0 -4
  229. package/esm/stack/Stack.css.js.map +0 -1
  230. package/esm/stack/Stack.js +0 -148
  231. package/esm/stack/Stack.js.map +0 -1
  232. package/esm/stack/StackLayout.js +0 -116
  233. package/esm/stack/StackLayout.js.map +0 -1
  234. package/esm/use-persistent-state.js +0 -107
  235. package/esm/use-persistent-state.js.map +0 -1
  236. package/esm/utils/pathUtils.js +0 -280
  237. package/esm/utils/pathUtils.js.map +0 -1
  238. package/esm/utils/propUtils.js +0 -23
  239. package/esm/utils/propUtils.js.map +0 -1
  240. package/esm/utils/refUtils.js +0 -10
  241. package/esm/utils/refUtils.js.map +0 -1
  242. package/esm/utils/styleUtils.js +0 -13
  243. package/esm/utils/styleUtils.js.map +0 -1
  244. package/esm/utils/typeOf.js +0 -23
  245. package/esm/utils/typeOf.js.map +0 -1
@@ -1,237 +0,0 @@
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
- var replaceLayoutElement = require('./replace-layout-element.js');
11
-
12
- function removeChild(layoutRoot, { path }) {
13
- const target = pathUtils.followPath(layoutRoot, path);
14
- let targetParent = pathUtils.followPathToParent(layoutRoot, path);
15
- if (targetParent === null) {
16
- return layoutRoot;
17
- }
18
- const { children } = propUtils.getProps(targetParent);
19
- if (
20
- // this is very specific to explicitly sized components
21
- children.length > 1 && typeOf.typeOf(targetParent) !== "Stack" && allOtherChildrenArePlaceholders(children, path)
22
- ) {
23
- const {
24
- style: { flexBasis, display, flexDirection, ...style }
25
- } = propUtils.getProps(targetParent);
26
- let containerPath = propUtils.getProp(targetParent, "path");
27
- let newLayout = replaceLayoutElement.swapChild(
28
- layoutRoot,
29
- targetParent,
30
- flexUtils.createPlaceHolder(containerPath, flexBasis, style)
31
- );
32
- while (targetParent = pathUtils.followPathToParent(newLayout, containerPath)) {
33
- if (propUtils.getProp(targetParent, "path") === "0") {
34
- break;
35
- }
36
- const { children: children2 } = propUtils.getProps(targetParent);
37
- if (allOtherChildrenArePlaceholders(children2)) {
38
- containerPath = propUtils.getProp(targetParent, "path");
39
- const {
40
- style: { flexBasis: flexBasis2, display: display2, flexDirection: flexDirection2, ...style2 }
41
- } = propUtils.getProps(targetParent);
42
- newLayout = replaceLayoutElement.swapChild(
43
- layoutRoot,
44
- targetParent,
45
- flexUtils.createPlaceHolder(containerPath, flexBasis2, style2)
46
- );
47
- } else if (hasAdjacentPlaceholders(children2)) {
48
- newLayout = collapsePlaceholders(
49
- layoutRoot,
50
- targetParent
51
- );
52
- } else {
53
- break;
54
- }
55
- }
56
- return newLayout;
57
- }
58
- return _removeChild(layoutRoot, target);
59
- }
60
- function _removeChild(container, child) {
61
- const props = propUtils.getProps(container);
62
- const { children: componentChildren, path, preserve } = props;
63
- let { active, id: containerId } = props;
64
- const { idx, finalStep } = pathUtils.nextStep(path, propUtils.getProp(child, "path"));
65
- const type = typeOf.typeOf(container);
66
- let children = componentChildren.slice();
67
- if (finalStep) {
68
- children.splice(idx, 1);
69
- if (active !== void 0 && active >= idx) {
70
- active = Math.max(0, active - 1);
71
- }
72
- if (children.length === 0 && preserve && type === "Stack") {
73
- const {
74
- path: path2,
75
- style: { flexBasis }
76
- } = propUtils.getProps(child);
77
- const placeHolder = containerId === vuuUtils.VuuShellLocation.Workspace ? layoutUtils.layoutFromJson(
78
- {
79
- props: {
80
- style: { flexGrow: 1, flexShrink: 1, flexBasis },
81
- title: "Tab 1"
82
- },
83
- type: "Placeholder"
84
- },
85
- path2
86
- ) : flexUtils.createPlaceHolder(path2, flexBasis);
87
- children.push(placeHolder);
88
- } else if (children.length === 1 && !preserve && path !== "0" && type.match(/Flexbox|Stack/)) {
89
- return unwrap(container, children[0]);
90
- }
91
- if (!children.some(isFlexible) && children.some(canBeMadeFlexible)) {
92
- children = makeFlexible(children);
93
- }
94
- } else {
95
- children[idx] = _removeChild(children[idx], child);
96
- }
97
- children = children.map((child2, i) => pathUtils.resetPath(child2, `${path}.${i}`));
98
- return React.cloneElement(container, { active }, children);
99
- }
100
- function unwrap(container, child) {
101
- const type = typeOf.typeOf(container);
102
- const {
103
- path,
104
- style: { flexBasis, flexGrow, flexShrink, width, height }
105
- } = propUtils.getProps(container);
106
- let unwrappedChild = pathUtils.resetPath(child, path);
107
- if (path === "0") {
108
- unwrappedChild = React.cloneElement(unwrappedChild, {
109
- style: {
110
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
111
- ...child.props.style,
112
- width,
113
- height
114
- }
115
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
116
- });
117
- } else if (type === "Flexbox") {
118
- const dim = (
119
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
120
- container.props.style.flexDirection === "column" ? "height" : "width"
121
- );
122
- const {
123
- style: { [dim]: size, ...style }
124
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
125
- } = unwrappedChild.props;
126
- unwrappedChild = React.cloneElement(unwrappedChild, {
127
- flexFill: void 0,
128
- style: {
129
- ...style,
130
- flexGrow,
131
- flexShrink,
132
- flexBasis,
133
- width,
134
- height
135
- }
136
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
137
- });
138
- }
139
- return unwrappedChild;
140
- }
141
- const isFlexible = (element) => {
142
- return element.props.style?.flexGrow > 0;
143
- };
144
- const canBeMadeFlexible = (element) => {
145
- if (element.props.style) {
146
- const { width, height, flexGrow } = element.props.style;
147
- return flexGrow === 0 && typeof width !== "number" && typeof height !== "number";
148
- } else {
149
- return false;
150
- }
151
- };
152
- const makeFlexible = (children) => {
153
- return children.map(
154
- (child) => canBeMadeFlexible(child) ? React.cloneElement(child, {
155
- style: {
156
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
157
- ...child.props.style,
158
- flexGrow: 1
159
- }
160
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
161
- }) : child
162
- );
163
- };
164
- const hasAdjacentPlaceholders = (children) => {
165
- if (children && children.length > 0) {
166
- let wasPlaceholder = propUtils.getProp(children[0], "placeholder");
167
- let isPlaceholder = false;
168
- for (let i = 1; i < children.length; i++) {
169
- isPlaceholder = propUtils.getProp(children[i], "placeholder");
170
- if (wasPlaceholder && isPlaceholder) {
171
- return true;
172
- }
173
- wasPlaceholder = isPlaceholder;
174
- }
175
- }
176
- };
177
- const collapsePlaceholders = (container, target) => {
178
- const { children: componentChildren, path } = propUtils.getProps(container);
179
- const { idx, finalStep } = pathUtils.nextStep(path, propUtils.getProp(target, "path"));
180
- let children = componentChildren.slice();
181
- if (finalStep) {
182
- children[idx] = _collapsePlaceHolders(target);
183
- } else {
184
- children[idx] = collapsePlaceholders(children[idx], target);
185
- }
186
- children = children.map((child, i) => pathUtils.resetPath(child, `${path}.${i}`));
187
- return React.cloneElement(container, void 0, children);
188
- };
189
- const _collapsePlaceHolders = (container) => {
190
- const { children } = propUtils.getProps(container);
191
- const newChildren = [];
192
- const placeholders = [];
193
- for (let i = 0; i < children.length; i++) {
194
- if (propUtils.getProp(children[i], "placeholder")) {
195
- placeholders.push(children[i]);
196
- } else {
197
- if (placeholders.length === 1) {
198
- newChildren.push(placeholders.pop());
199
- } else if (placeholders.length > 0) {
200
- newChildren.push(mergePlaceholders(placeholders));
201
- placeholders.length = 0;
202
- }
203
- newChildren.push(children[i]);
204
- }
205
- }
206
- if (placeholders.length === 1) {
207
- newChildren.push(placeholders.pop());
208
- } else if (placeholders.length > 0) {
209
- newChildren.push(mergePlaceholders(placeholders));
210
- }
211
- const containerPath = propUtils.getProp(container, "path");
212
- return React.cloneElement(
213
- container,
214
- void 0,
215
- newChildren.map((child, i) => pathUtils.resetPath(child, `${containerPath}.${i}`))
216
- );
217
- };
218
- const mergePlaceholders = ([placeholder, ...placeholders]) => {
219
- const targetStyle = propUtils.getProp(placeholder, "style");
220
- let { flexBasis, flexGrow, flexShrink } = targetStyle;
221
- for (const placeholder2 of placeholders) {
222
- const { style } = placeholder2.props;
223
- flexBasis += style.flexBasis;
224
- flexGrow = Math.max(flexGrow, style.flexGrow);
225
- flexShrink = Math.max(flexShrink, style.flexShrink);
226
- }
227
- return React.cloneElement(placeholder, {
228
- style: { ...targetStyle, flexBasis, flexGrow, flexShrink }
229
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
230
- });
231
- };
232
- const allOtherChildrenArePlaceholders = (children, path) => children.every(
233
- (child) => propUtils.getProp(child, "placeholder") || path && propUtils.getProp(child, "path") === path
234
- );
235
-
236
- exports.removeChild = removeChild;
237
- //# sourceMappingURL=remove-layout-element.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"remove-layout-element.js","sources":["../../src/layout-reducer/remove-layout-element.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-non-null-assertion */\nimport { VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport React, { ReactElement } from \"react\";\nimport {\n followPath,\n followPathToParent,\n getProp,\n getProps,\n nextStep,\n resetPath,\n typeOf,\n} from \"../utils\";\nimport { createPlaceHolder } from \"./flexUtils\";\nimport { RemoveAction } from \"./layoutTypes\";\nimport { layoutFromJson } from \"./layoutUtils\";\nimport { swapChild } from \"./replace-layout-element\";\n\nexport function removeChild(layoutRoot: ReactElement, { path }: RemoveAction) {\n const target = followPath(layoutRoot, path!) as ReactElement;\n let targetParent = followPathToParent(layoutRoot, path!);\n if (targetParent === null) {\n return layoutRoot;\n }\n const { children } = getProps(targetParent);\n if (\n // this is very specific to explicitly sized components\n children.length > 1 &&\n typeOf(targetParent) !== \"Stack\" &&\n allOtherChildrenArePlaceholders(children, path)\n ) {\n const {\n style: { flexBasis, display, flexDirection, ...style },\n } = getProps(targetParent);\n let containerPath = getProp(targetParent, \"path\");\n let newLayout = swapChild(\n layoutRoot,\n targetParent,\n createPlaceHolder(containerPath, flexBasis, style),\n );\n while ((targetParent = followPathToParent(newLayout, containerPath))) {\n if (getProp(targetParent, \"path\") === \"0\") {\n break;\n }\n const { children } = getProps(targetParent);\n if (allOtherChildrenArePlaceholders(children)) {\n containerPath = getProp(targetParent, \"path\");\n const {\n style: { flexBasis, display, flexDirection, ...style },\n } = getProps(targetParent);\n newLayout = swapChild(\n layoutRoot,\n targetParent,\n createPlaceHolder(containerPath, flexBasis, style),\n );\n } else if (hasAdjacentPlaceholders(children)) {\n newLayout = collapsePlaceholders(\n layoutRoot,\n targetParent as ReactElement,\n );\n } else {\n break;\n }\n }\n return newLayout;\n }\n return _removeChild(layoutRoot, target);\n}\n\nfunction _removeChild(\n container: ReactElement,\n child: ReactElement,\n): ReactElement {\n const props = getProps(container);\n const { children: componentChildren, path, preserve } = props;\n let { active, id: containerId } = props;\n const { idx, finalStep } = nextStep(path, getProp(child, \"path\"));\n const type = typeOf(container) as string;\n let children = componentChildren.slice() as ReactElement[];\n\n if (finalStep) {\n children.splice(idx, 1);\n\n if (active !== undefined && active >= idx) {\n active = Math.max(0, active - 1);\n }\n\n if (children.length === 0 && preserve && type === \"Stack\") {\n const {\n path,\n style: { flexBasis },\n } = getProps(child);\n const placeHolder =\n containerId === VuuShellLocation.Workspace\n ? layoutFromJson(\n {\n props: {\n style: { flexGrow: 1, flexShrink: 1, flexBasis },\n title: \"Tab 1\",\n },\n type: \"Placeholder\",\n },\n path,\n )\n : createPlaceHolder(path, flexBasis);\n children.push(placeHolder);\n } else if (\n children.length === 1 &&\n !preserve &&\n path !== \"0\" &&\n type.match(/Flexbox|Stack/)\n ) {\n return unwrap(container, children[0]);\n }\n\n if (!children.some(isFlexible) && children.some(canBeMadeFlexible)) {\n children = makeFlexible(children);\n }\n } else {\n children[idx] = _removeChild(children[idx], child) as ReactElement;\n }\n\n children = children.map((child, i) => resetPath(child, `${path}.${i}`));\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return React.cloneElement(container, { active } as any, children);\n}\n\nfunction unwrap(container: ReactElement, child: ReactElement) {\n const type = typeOf(container);\n const {\n path,\n style: { flexBasis, flexGrow, flexShrink, width, height },\n } = getProps(container);\n\n let unwrappedChild = resetPath(child, path);\n if (path === \"0\") {\n unwrappedChild = React.cloneElement(unwrappedChild, {\n style: {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ...(child.props as any).style,\n width,\n height,\n },\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } as any);\n } else if (type === \"Flexbox\") {\n const dim =\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (container.props as any).style.flexDirection === \"column\"\n ? \"height\"\n : \"width\";\n const {\n style: { [dim]: size, ...style },\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } = unwrappedChild.props as any;\n unwrappedChild = React.cloneElement(unwrappedChild, {\n flexFill: undefined,\n style: {\n ...style,\n flexGrow,\n flexShrink,\n flexBasis,\n width,\n height,\n },\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } as any);\n }\n return unwrappedChild;\n}\n\nconst isFlexible = (element: ReactElement) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return (element.props as any).style?.flexGrow > 0;\n};\n\nconst canBeMadeFlexible = (element: ReactElement) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if ((element.props as any).style) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { width, height, flexGrow } = (element.props as any).style;\n return (\n flexGrow === 0 && typeof width !== \"number\" && typeof height !== \"number\"\n );\n } else {\n return false;\n }\n};\n\nconst makeFlexible = (children: ReactElement[]) => {\n return children.map((child) =>\n canBeMadeFlexible(child)\n ? React.cloneElement(child, {\n style: {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ...(child.props as any).style,\n flexGrow: 1,\n },\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } as any)\n : child,\n );\n};\n\nconst hasAdjacentPlaceholders = (children: ReactElement[]) => {\n if (children && children.length > 0) {\n let wasPlaceholder = getProp(children[0], \"placeholder\");\n let isPlaceholder = false;\n for (let i = 1; i < children.length; i++) {\n isPlaceholder = getProp(children[i], \"placeholder\");\n if (wasPlaceholder && isPlaceholder) {\n return true;\n }\n wasPlaceholder = isPlaceholder;\n }\n }\n};\n\nconst collapsePlaceholders = (\n container: ReactElement,\n target: ReactElement,\n) => {\n const { children: componentChildren, path } = getProps(container);\n const { idx, finalStep } = nextStep(path, getProp(target, \"path\"));\n let children = componentChildren.slice() as ReactElement[];\n if (finalStep) {\n children[idx] = _collapsePlaceHolders(target);\n } else {\n children[idx] = collapsePlaceholders(children[idx], target) as ReactElement;\n }\n\n children = children.map((child, i) => resetPath(child, `${path}.${i}`));\n return React.cloneElement(container, undefined, children);\n};\n\nconst _collapsePlaceHolders = (container: ReactElement) => {\n const { children } = getProps(container);\n const newChildren = [];\n const placeholders: ReactElement[] = [];\n\n for (let i = 0; i < children.length; i++) {\n if (getProp(children[i], \"placeholder\")) {\n placeholders.push(children[i]);\n } else {\n if (placeholders.length === 1) {\n newChildren.push(placeholders.pop());\n } else if (placeholders.length > 0) {\n newChildren.push(mergePlaceholders(placeholders));\n placeholders.length = 0;\n }\n newChildren.push(children[i]);\n }\n }\n\n if (placeholders.length === 1) {\n newChildren.push(placeholders.pop());\n } else if (placeholders.length > 0) {\n newChildren.push(mergePlaceholders(placeholders));\n }\n\n const containerPath = getProp(container, \"path\");\n return React.cloneElement(\n container,\n undefined,\n newChildren.map((child, i) => resetPath(child, `${containerPath}.${i}`)),\n );\n};\n\nconst mergePlaceholders = ([placeholder, ...placeholders]: ReactElement[]) => {\n const targetStyle = getProp(placeholder, \"style\");\n let { flexBasis, flexGrow, flexShrink } = targetStyle;\n for (const placeholder of placeholders) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { style } = placeholder.props as any;\n flexBasis += style.flexBasis;\n flexGrow = Math.max(flexGrow, style.flexGrow);\n flexShrink = Math.max(flexShrink, style.flexShrink);\n }\n return React.cloneElement(placeholder, {\n style: { ...targetStyle, flexBasis, flexGrow, flexShrink },\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } as any);\n};\n\nconst allOtherChildrenArePlaceholders = (\n children: ReactElement[],\n path?: string,\n) =>\n children.every(\n (child) =>\n getProp(child, \"placeholder\") ||\n (path && getProp(child, \"path\") === path),\n );\n"],"names":["followPath","followPathToParent","getProps","typeOf","getProp","swapChild","createPlaceHolder","children","flexBasis","display","flexDirection","style","nextStep","path","VuuShellLocation","layoutFromJson","child","resetPath","placeholder"],"mappings":"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"}
@@ -1,96 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var pathUtils = require('../utils/pathUtils.js');
5
- var propUtils = require('../utils/propUtils.js');
6
- var layoutUtils = require('./layoutUtils.js');
7
-
8
- function replaceChild(model, { target, replacement }) {
9
- return _replaceChild(model, target, replacement);
10
- }
11
- function _replaceChild(model, child, replacement) {
12
- const path = propUtils.getProp(child, "path");
13
- const resizeable = propUtils.getProp(child, "resizeable");
14
- const { style } = propUtils.getProps(child);
15
- const newChild = layoutUtils.applyLayoutProps(
16
- React.cloneElement(replacement, {
17
- resizeable,
18
- style: {
19
- ...style,
20
- ...replacement.props.style
21
- }
22
- }),
23
- path
24
- );
25
- return swapChild(model, child, newChild);
26
- }
27
- function swapChild(model, child, replacement, op) {
28
- if (model === child) {
29
- return replacement;
30
- }
31
- const { idx, finalStep } = pathUtils.nextStep(
32
- propUtils.getProp(model, "path"),
33
- propUtils.getProp(child, "path")
34
- );
35
- const modelChildren = model.props.children;
36
- const children = modelChildren.slice();
37
- if (finalStep) {
38
- if (!op) {
39
- children[idx] = replacement;
40
- } else if (op === "collapse") {
41
- children[idx] = collapse(model, children[idx]);
42
- } else if (op === "expand") {
43
- children[idx] = expand(children[idx]);
44
- }
45
- } else {
46
- children[idx] = swapChild(children[idx], child, replacement, op);
47
- }
48
- return React.cloneElement(model, void 0, children);
49
- }
50
- function collapse(parent, child) {
51
- const { style: parentStyle } = propUtils.getProps(parent);
52
- const { style: childStyle } = propUtils.getProps(child);
53
- const { width, height, flexBasis, flexShrink, flexGrow, ...rest } = childStyle;
54
- const restoreStyle = {
55
- width,
56
- height,
57
- flexBasis,
58
- flexShrink,
59
- flexGrow
60
- };
61
- const style = {
62
- ...rest,
63
- flexBasis: 0,
64
- flexGrow: 0,
65
- flexShrink: 0
66
- };
67
- const collapsed = parentStyle.flexDirection === "row" ? "vertical" : parentStyle.flexDirection === "column" ? "horizontal" : false;
68
- if (collapsed) {
69
- return React.cloneElement(child, {
70
- collapsed,
71
- restoreStyle,
72
- style
73
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
74
- });
75
- }
76
- return child;
77
- }
78
- function expand(child) {
79
- const { style: childStyle, restoreStyle } = propUtils.getProps(child);
80
- const { flexBasis, flexShrink, flexGrow, ...rest } = childStyle;
81
- const style = {
82
- ...rest,
83
- ...restoreStyle
84
- };
85
- return React.cloneElement(child, {
86
- collapsed: false,
87
- style,
88
- restoreStyle: void 0
89
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
90
- });
91
- }
92
-
93
- exports._replaceChild = _replaceChild;
94
- exports.replaceChild = replaceChild;
95
- exports.swapChild = swapChild;
96
- //# sourceMappingURL=replace-layout-element.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"replace-layout-element.js","sources":["../../src/layout-reducer/replace-layout-element.ts"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { getProp, getProps, nextStep } from \"../utils\";\nimport { ReplaceAction } from \"./layoutTypes\";\nimport { applyLayoutProps, LayoutProps } from \"./layoutUtils\";\n\nexport function replaceChild(\n model: ReactElement,\n { target, replacement }: ReplaceAction,\n) {\n return _replaceChild(model, target, replacement);\n}\n\nexport function _replaceChild(\n model: ReactElement,\n child: ReactElement,\n replacement: ReactElement<LayoutProps>,\n) {\n const path = getProp(child, \"path\");\n const resizeable = getProp(child, \"resizeable\");\n const { style } = getProps(child);\n const newChild = applyLayoutProps(\n React.cloneElement(replacement, {\n resizeable,\n style: {\n ...style,\n ...replacement.props.style,\n },\n }),\n path,\n );\n\n return swapChild(model, child, newChild);\n}\n\nexport function swapChild(\n model: ReactElement,\n child: ReactElement,\n replacement: ReactElement,\n op?: \"collapse\" | \"expand\",\n): ReactElement {\n if (model === child) {\n return replacement;\n }\n\n const { idx, finalStep } = nextStep(\n getProp(model, \"path\"),\n getProp(child, \"path\"),\n );\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const modelChildren = (model.props as any).children as ReactElement[];\n const children = modelChildren.slice();\n\n if (finalStep) {\n if (!op) {\n children[idx] = replacement;\n } else if (op === \"collapse\") {\n children[idx] = collapse(model, children[idx]);\n } else if (op === \"expand\") {\n children[idx] = expand(children[idx]);\n }\n } else {\n children[idx] = swapChild(children[idx], child, replacement, op);\n }\n return React.cloneElement(model, undefined, children);\n}\n\nfunction collapse(parent: ReactElement, child: ReactElement) {\n const { style: parentStyle } = getProps(parent);\n const { style: childStyle } = getProps(child);\n\n const { width, height, flexBasis, flexShrink, flexGrow, ...rest } =\n childStyle;\n\n const restoreStyle = {\n width,\n height,\n flexBasis,\n flexShrink,\n flexGrow,\n };\n\n const style = {\n ...rest,\n flexBasis: 0,\n flexGrow: 0,\n flexShrink: 0,\n };\n const collapsed =\n parentStyle.flexDirection === \"row\"\n ? \"vertical\"\n : parentStyle.flexDirection === \"column\"\n ? \"horizontal\"\n : false;\n\n if (collapsed) {\n return React.cloneElement(child, {\n collapsed,\n restoreStyle,\n style,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } as any);\n }\n return child;\n}\n\nfunction expand(child: ReactElement) {\n const { style: childStyle, restoreStyle } = getProps(child);\n\n const { flexBasis, flexShrink, flexGrow, ...rest } = childStyle;\n\n const style = {\n ...rest,\n ...restoreStyle,\n };\n\n return React.cloneElement(child, {\n collapsed: false,\n style,\n restoreStyle: undefined,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } as any);\n}\n"],"names":["getProp","getProps","applyLayoutProps","nextStep"],"mappings":"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"}
@@ -1,62 +0,0 @@
1
- 'use strict';
2
-
3
- var React = require('react');
4
- var pathUtils = require('../utils/pathUtils.js');
5
- var propUtils = require('../utils/propUtils.js');
6
- var replaceLayoutElement = require('./replace-layout-element.js');
7
-
8
- function resizeFlexChild(layoutRoot, { path, size }) {
9
- const target = pathUtils.followPath(layoutRoot, path, true);
10
- const { style } = propUtils.getProps(target);
11
- const newStyle = {
12
- ...style,
13
- width: size
14
- };
15
- const replacement = React.cloneElement(target, { style: newStyle });
16
- return replaceLayoutElement.swapChild(layoutRoot, target, replacement);
17
- }
18
- function resizeFlexChildren(layoutRoot, { path, sizes }) {
19
- const target = pathUtils.followPath(layoutRoot, path, true);
20
- const { children, style } = propUtils.getProps(target);
21
- const dimension2 = style.flexDirection === "column" ? "height" : "width";
22
- const replacementChildren = applySizesToChildren(children, sizes, dimension2);
23
- const replacement = React.cloneElement(
24
- target,
25
- void 0,
26
- replacementChildren
27
- );
28
- return replaceLayoutElement.swapChild(layoutRoot, target, replacement);
29
- }
30
- function applySizesToChildren(children, sizes, dimension2) {
31
- return children.map((child, i) => {
32
- const {
33
- style: { [dimension2]: size, flexBasis: actualFlexBasis }
34
- } = propUtils.getProps(child);
35
- const meta = sizes[i];
36
- const { currentSize, flexBasis } = meta;
37
- const hasCurrentSize = currentSize !== void 0;
38
- const newSize = hasCurrentSize ? meta.currentSize : flexBasis;
39
- if (newSize === void 0 || size === newSize || actualFlexBasis === newSize) {
40
- return child;
41
- }
42
- return React.cloneElement(child, {
43
- style: applySizeToChild(child.props.style, dimension2, newSize)
44
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
45
- });
46
- });
47
- }
48
- function applySizeToChild(style, dimension2, newSize) {
49
- const hasSize = typeof style[dimension2] === "number";
50
- const { flexShrink = 1, flexGrow = 1 } = style;
51
- return {
52
- ...style,
53
- [dimension2]: hasSize ? newSize : "auto",
54
- flexBasis: hasSize ? "auto" : newSize,
55
- flexShrink,
56
- flexGrow
57
- };
58
- }
59
-
60
- exports.resizeFlexChild = resizeFlexChild;
61
- exports.resizeFlexChildren = resizeFlexChildren;
62
- //# sourceMappingURL=resize-flex-children.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"resize-flex-children.js","sources":["../../src/layout-reducer/resize-flex-children.ts"],"sourcesContent":["import { dimension } from \"@vuu-ui/vuu-utils\";\nimport React, { CSSProperties, ReactElement } from \"react\";\nimport { followPath, getProps } from \"../utils\";\nimport { LayoutResizeAction, SplitterResizeAction } from \"./layoutTypes\";\nimport { swapChild } from \"./replace-layout-element\";\n\nexport function resizeFlexChild(\n layoutRoot: ReactElement,\n { path, size }: LayoutResizeAction,\n) {\n const target = followPath(layoutRoot, path, true);\n\n const { style } = getProps(target);\n\n const newStyle = {\n ...style,\n width: size,\n };\n\n // const dimension = style.flexDirection === \"column\" ? \"height\" : \"width\";\n // const replacementChildren = applySizesToChildren(children, sizes, dimension);\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const replacement = React.cloneElement(target, { style: newStyle } as any);\n\n return swapChild(layoutRoot, target, replacement);\n}\n\nexport function resizeFlexChildren(\n layoutRoot: ReactElement,\n { path, sizes }: SplitterResizeAction,\n) {\n const target = followPath(layoutRoot, path, true);\n const { children, style } = getProps(target);\n\n const dimension = style.flexDirection === \"column\" ? \"height\" : \"width\";\n const replacementChildren = applySizesToChildren(children, sizes, dimension);\n\n const replacement = React.cloneElement(\n target,\n undefined,\n replacementChildren,\n );\n\n return swapChild(layoutRoot, target, replacement);\n}\n\nfunction applySizesToChildren(\n children: ReactElement[],\n sizes: { currentSize: number; flexBasis: number }[],\n dimension: dimension,\n) {\n return children.map((child, i) => {\n const {\n style: { [dimension]: size, flexBasis: actualFlexBasis },\n } = getProps(child);\n const meta = sizes[i];\n const { currentSize, flexBasis } = meta;\n const hasCurrentSize = currentSize !== undefined;\n const newSize = hasCurrentSize ? meta.currentSize : flexBasis;\n\n if (\n newSize === undefined ||\n size === newSize ||\n actualFlexBasis === newSize\n ) {\n return child;\n }\n return React.cloneElement(child, {\n style: applySizeToChild((child.props as any).style, dimension, newSize),\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } as any);\n });\n}\n\nfunction applySizeToChild(\n style: CSSProperties,\n dimension: dimension,\n newSize: number,\n) {\n const hasSize = typeof style[dimension] === \"number\";\n const { flexShrink = 1, flexGrow = 1 } = style;\n return {\n ...style,\n [dimension]: hasSize ? newSize : \"auto\",\n flexBasis: hasSize ? \"auto\" : newSize,\n flexShrink,\n flexGrow,\n };\n}\n"],"names":["followPath","getProps","swapChild","dimension"],"mappings":";;;;;;;AAMO,SAAS,eACd,CAAA,UAAA,EACA,EAAE,IAAA,EAAM,MACR,EAAA;AACA,EAAA,MAAM,MAAS,GAAAA,oBAAA,CAAW,UAAY,EAAA,IAAA,EAAM,IAAI,CAAA;AAEhD,EAAA,MAAM,EAAE,KAAA,EAAU,GAAAC,kBAAA,CAAS,MAAM,CAAA;AAEjC,EAAA,MAAM,QAAW,GAAA;AAAA,IACf,GAAG,KAAA;AAAA,IACH,KAAO,EAAA;AAAA,GACT;AAMA,EAAA,MAAM,cAAc,KAAM,CAAA,YAAA,CAAa,QAAQ,EAAE,KAAA,EAAO,UAAiB,CAAA;AAEzE,EAAO,OAAAC,8BAAA,CAAU,UAAY,EAAA,MAAA,EAAQ,WAAW,CAAA;AAClD;AAEO,SAAS,kBACd,CAAA,UAAA,EACA,EAAE,IAAA,EAAM,OACR,EAAA;AACA,EAAA,MAAM,MAAS,GAAAF,oBAAA,CAAW,UAAY,EAAA,IAAA,EAAM,IAAI,CAAA;AAChD,EAAA,MAAM,EAAE,QAAA,EAAU,KAAM,EAAA,GAAIC,mBAAS,MAAM,CAAA;AAE3C,EAAA,MAAME,UAAY,GAAA,KAAA,CAAM,aAAkB,KAAA,QAAA,GAAW,QAAW,GAAA,OAAA;AAChE,EAAA,MAAM,mBAAsB,GAAA,oBAAA,CAAqB,QAAU,EAAA,KAAA,EAAOA,UAAS,CAAA;AAE3E,EAAA,MAAM,cAAc,KAAM,CAAA,YAAA;AAAA,IACxB,MAAA;AAAA,IACA,KAAA,CAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAO,OAAAD,8BAAA,CAAU,UAAY,EAAA,MAAA,EAAQ,WAAW,CAAA;AAClD;AAEA,SAAS,oBAAA,CACP,QACA,EAAA,KAAA,EACAC,UACA,EAAA;AACA,EAAA,OAAO,QAAS,CAAA,GAAA,CAAI,CAAC,KAAA,EAAO,CAAM,KAAA;AAChC,IAAM,MAAA;AAAA,MACJ,OAAO,EAAE,CAACA,UAAS,GAAG,IAAA,EAAM,WAAW,eAAgB;AAAA,KACzD,GAAIF,mBAAS,KAAK,CAAA;AAClB,IAAM,MAAA,IAAA,GAAO,MAAM,CAAC,CAAA;AACpB,IAAM,MAAA,EAAE,WAAa,EAAA,SAAA,EAAc,GAAA,IAAA;AACnC,IAAA,MAAM,iBAAiB,WAAgB,KAAA,KAAA,CAAA;AACvC,IAAM,MAAA,OAAA,GAAU,cAAiB,GAAA,IAAA,CAAK,WAAc,GAAA,SAAA;AAEpD,IAAA,IACE,OAAY,KAAA,KAAA,CAAA,IACZ,IAAS,KAAA,OAAA,IACT,oBAAoB,OACpB,EAAA;AACA,MAAO,OAAA,KAAA;AAAA;AAET,IAAO,OAAA,KAAA,CAAM,aAAa,KAAO,EAAA;AAAA,MAC/B,OAAO,gBAAkB,CAAA,KAAA,CAAM,KAAc,CAAA,KAAA,EAAOE,YAAW,OAAO;AAAA;AAAA,KAEhE,CAAA;AAAA,GACT,CAAA;AACH;AAEA,SAAS,gBAAA,CACP,KACAA,EAAAA,UAAAA,EACA,OACA,EAAA;AACA,EAAA,MAAM,OAAU,GAAA,OAAO,KAAMA,CAAAA,UAAS,CAAM,KAAA,QAAA;AAC5C,EAAA,MAAM,EAAE,UAAA,GAAa,CAAG,EAAA,QAAA,GAAW,GAAM,GAAA,KAAA;AACzC,EAAO,OAAA;AAAA,IACL,GAAG,KAAA;AAAA,IACH,CAACA,UAAS,GAAG,OAAA,GAAU,OAAU,GAAA,MAAA;AAAA,IACjC,SAAA,EAAW,UAAU,MAAS,GAAA,OAAA;AAAA,IAC9B,UAAA;AAAA,IACA;AAAA,GACF;AACF;;;;;"}
@@ -1,211 +0,0 @@
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
- const isHtmlElement = (component) => {
12
- const [firstLetter] = typeOf.typeOf(component);
13
- return firstLetter === firstLetter.toLowerCase();
14
- };
15
- function wrap(container, existingComponent, newComponent, pos, clientRect, dropRect) {
16
- const { children: containerChildren, path: containerPath } = propUtils.getProps(container);
17
- const existingComponentPath = propUtils.getProp(existingComponent, "path");
18
- const { idx, finalStep } = pathUtils.nextStep(containerPath, existingComponentPath);
19
- const children = finalStep ? updateChildren(
20
- container,
21
- containerChildren,
22
- existingComponent,
23
- newComponent,
24
- pos,
25
- clientRect,
26
- dropRect
27
- ) : containerChildren.map(
28
- (child, index) => index === idx ? wrap(
29
- child,
30
- existingComponent,
31
- newComponent,
32
- pos,
33
- clientRect,
34
- dropRect
35
- ) : child
36
- );
37
- return React.cloneElement(container, void 0, children);
38
- }
39
- function updateChildren(container, containerChildren, existingComponent, newComponent, pos, clientRect, dropRect) {
40
- const intrinsicSize = flexUtils.getIntrinsicSize(newComponent);
41
- if (intrinsicSize?.width && intrinsicSize?.height) {
42
- if (clientRect === void 0 || dropRect === void 0) {
43
- throw Error(
44
- "wrap-layout-element, updateChildren clientRect and dropRect must both be available"
45
- );
46
- }
47
- return wrapIntrinsicSizedComponent(
48
- containerChildren,
49
- existingComponent,
50
- newComponent,
51
- pos,
52
- clientRect,
53
- dropRect
54
- );
55
- }
56
- return wrapFlexComponent(
57
- container,
58
- containerChildren,
59
- existingComponent,
60
- newComponent,
61
- pos
62
- );
63
- }
64
- function wrapFlexComponent(container, containerChildren, existingComponent, newComponent, pos) {
65
- const { version = 0 } = propUtils.getProps(newComponent);
66
- const { path: existingComponentPath, title } = propUtils.getProps(existingComponent);
67
- const {
68
- type,
69
- flexDirection: flexDirection2,
70
- showTabs: showTabsProp
71
- } = getLayoutSpecForWrapper(pos);
72
- const [style, existingComponentStyle, newComponentStyle] = getWrappedFlexStyles(
73
- type,
74
- existingComponent,
75
- newComponent,
76
- flexDirection2,
77
- pos
78
- );
79
- const targetFirst = isTargetFirst(pos);
80
- const active = targetFirst ? 1 : 0;
81
- const newComponentProps = {
82
- resizeable: true,
83
- style: newComponentStyle,
84
- version: version + 1
85
- };
86
- const resizeProp = isHtmlElement(existingComponent) ? "data-resizeable" : "resizeable";
87
- const existingComponentProps = {
88
- [resizeProp]: true,
89
- style: existingComponentStyle
90
- };
91
- const showTabs = type === "Stack" ? { showTabs: showTabsProp } : void 0;
92
- const splitterSize = type === "Flexbox" ? {
93
- splitterSize: (typeOf.typeOf(container) === "Flexbox" && container.props.splitterSize) ?? void 0
94
- } : void 0;
95
- const id = vuuUtils.uuid();
96
- const wrapper = React.createElement(
97
- vuuUtils.getLayoutComponent(type),
98
- {
99
- active,
100
- id,
101
- key: id,
102
- path: propUtils.getProp(existingComponent, "path"),
103
- flexFill: propUtils.getProp(existingComponent, "flexFill"),
104
- ...splitterSize,
105
- ...showTabs,
106
- style,
107
- title,
108
- resizeable: propUtils.getProp(existingComponent, "resizeable")
109
- },
110
- targetFirst ? [
111
- pathUtils.resetPath(
112
- existingComponent,
113
- `${existingComponentPath}.0`,
114
- existingComponentProps
115
- ),
116
- layoutUtils.applyLayoutProps(
117
- React.cloneElement(newComponent, newComponentProps),
118
- `${existingComponentPath}.1`
119
- )
120
- ] : [
121
- layoutUtils.applyLayoutProps(
122
- React.cloneElement(newComponent, newComponentProps),
123
- `${existingComponentPath}.0`
124
- ),
125
- pathUtils.resetPath(
126
- existingComponent,
127
- `${existingComponentPath}.1`,
128
- existingComponentProps
129
- )
130
- ]
131
- );
132
- return containerChildren.map(
133
- (child) => child === existingComponent ? wrapper : child
134
- );
135
- }
136
- function wrapIntrinsicSizedComponent(containerChildren, existingComponent, newComponent, pos, clientRect, dropRect) {
137
- const { flexDirection: flexDirection2 } = getLayoutSpecForWrapper(pos);
138
- const contraDirection = flexDirection2 === "column" ? "row" : "column";
139
- const targetFirst = isTargetFirst(pos);
140
- const [dropLeft, dropTop, dropRight, dropBottom] = dropRect;
141
- const [startPlaceholder, endPlaceholder] = flexDirection2 === "column" ? [dropTop - clientRect.top, clientRect.bottom - dropBottom] : [dropLeft - clientRect.left, clientRect.right - dropRight];
142
- const pathRoot = propUtils.getProp(existingComponent, "path");
143
- let pathIndex = 0;
144
- const resizeProp = isHtmlElement(existingComponent) ? "data-resizeable" : "resizeable";
145
- const wrappedChildren = [];
146
- if (startPlaceholder) {
147
- wrappedChildren.push(
148
- targetFirst ? pathUtils.resetPath(existingComponent, `${pathRoot}.${pathIndex++}`, {
149
- [resizeProp]: true,
150
- style: { flexBasis: startPlaceholder, flexGrow: 1, flexShrink: 1 }
151
- }) : flexUtils.createPlaceHolder(`${pathRoot}.${pathIndex++}`, startPlaceholder, {
152
- flexGrow: 0,
153
- flexShrink: 0
154
- })
155
- );
156
- }
157
- wrappedChildren.push(
158
- flexUtils.wrapIntrinsicSizeComponentWithFlexbox(
159
- newComponent,
160
- contraDirection,
161
- `${pathRoot}.${pathIndex++}`,
162
- clientRect,
163
- dropRect
164
- )
165
- );
166
- if (endPlaceholder) {
167
- wrappedChildren.push(
168
- targetFirst ? flexUtils.createPlaceHolder(`${pathRoot}.${pathIndex++}`, 0) : pathUtils.resetPath(existingComponent, `${pathRoot}.${pathIndex++}`, {
169
- [resizeProp]: true,
170
- style: { flexBasis: 0, flexGrow: 1, flexShrink: 1 }
171
- })
172
- );
173
- }
174
- const wrapper = flexUtils.createFlexbox(
175
- flexDirection2,
176
- existingComponent.props,
177
- wrappedChildren,
178
- pathRoot
179
- );
180
- return containerChildren.map(
181
- (child) => child === existingComponent ? wrapper : child
182
- );
183
- }
184
- function getWrappedFlexStyles(type, existingComponent, newComponent, flexDirection2, pos) {
185
- const style = {
186
- ...existingComponent.props.style,
187
- flexDirection: flexDirection2
188
- };
189
- const dimension = type === "Flexbox" && flexDirection2 === "column" ? "height" : "width";
190
- const newComponentStyle = flexUtils.getFlexStyle(newComponent, dimension, pos);
191
- const existingComponentStyle = flexUtils.getFlexStyle(existingComponent, dimension);
192
- return [style, existingComponentStyle, newComponentStyle];
193
- }
194
- const isTargetFirst = (pos) => pos.position.SouthOrEast ? true : pos?.tab?.positionRelativeToTab === "before" ? false : pos.position.Header ? true : false;
195
- function getLayoutSpecForWrapper(pos) {
196
- if (pos.position.Header) {
197
- return {
198
- type: "Stack",
199
- flexDirection: "column",
200
- showTabs: true
201
- };
202
- } else {
203
- return {
204
- type: "Flexbox",
205
- flexDirection: pos.position.EastOrWest ? "row" : "column"
206
- };
207
- }
208
- }
209
-
210
- exports.wrap = wrap;
211
- //# sourceMappingURL=wrap-layout-element.js.map