@vuu-ui/vuu-layout 0.0.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +201 -0
- package/README.md +1 -0
- package/cjs/Component.js +14 -0
- package/cjs/Component.js.map +1 -0
- package/cjs/DraggableLayout.css.js +6 -0
- package/cjs/DraggableLayout.css.js.map +1 -0
- package/cjs/DraggableLayout.js +33 -0
- package/cjs/DraggableLayout.js.map +1 -0
- package/cjs/dock-layout/DockLayout.css.js +6 -0
- package/cjs/dock-layout/DockLayout.css.js.map +1 -0
- package/cjs/dock-layout/DockLayout.js +36 -0
- package/cjs/dock-layout/DockLayout.js.map +1 -0
- package/cjs/dock-layout/Drawer.css.js +6 -0
- package/cjs/dock-layout/Drawer.css.js.map +1 -0
- package/cjs/dock-layout/Drawer.js +96 -0
- package/cjs/dock-layout/Drawer.js.map +1 -0
- package/cjs/drag-drop/BoxModel.js +422 -0
- package/cjs/drag-drop/BoxModel.js.map +1 -0
- package/cjs/drag-drop/DragState.js +154 -0
- package/cjs/drag-drop/DragState.js.map +1 -0
- package/cjs/drag-drop/Draggable.js +192 -0
- package/cjs/drag-drop/Draggable.js.map +1 -0
- package/cjs/drag-drop/DropMenu.css.js +6 -0
- package/cjs/drag-drop/DropMenu.css.js.map +1 -0
- package/cjs/drag-drop/DropMenu.js +55 -0
- package/cjs/drag-drop/DropMenu.js.map +1 -0
- package/cjs/drag-drop/DropTarget.js +244 -0
- package/cjs/drag-drop/DropTarget.js.map +1 -0
- package/cjs/drag-drop/DropTargetRenderer.js +244 -0
- package/cjs/drag-drop/DropTargetRenderer.js.map +1 -0
- package/cjs/flexbox/Flexbox.css.js +6 -0
- package/cjs/flexbox/Flexbox.css.js.map +1 -0
- package/cjs/flexbox/Flexbox.js +70 -0
- package/cjs/flexbox/Flexbox.js.map +1 -0
- package/cjs/flexbox/FlexboxLayout.js +30 -0
- package/cjs/flexbox/FlexboxLayout.js.map +1 -0
- package/cjs/flexbox/FluidGrid.css.js +6 -0
- package/cjs/flexbox/FluidGrid.css.js.map +1 -0
- package/cjs/flexbox/FluidGrid.js +87 -0
- package/cjs/flexbox/FluidGrid.js.map +1 -0
- package/cjs/flexbox/FluidGridLayout.js +14 -0
- package/cjs/flexbox/FluidGridLayout.js.map +1 -0
- package/cjs/flexbox/Splitter.css.js +6 -0
- package/cjs/flexbox/Splitter.css.js.map +1 -0
- package/cjs/flexbox/Splitter.js +122 -0
- package/cjs/flexbox/Splitter.js.map +1 -0
- package/cjs/flexbox/flexbox-utils.js +109 -0
- package/cjs/flexbox/flexbox-utils.js.map +1 -0
- package/cjs/flexbox/useResponsiveSizing.js +62 -0
- package/cjs/flexbox/useResponsiveSizing.js.map +1 -0
- package/cjs/flexbox/useSplitterResizing.js +209 -0
- package/cjs/flexbox/useSplitterResizing.js.map +1 -0
- package/cjs/index.js +133 -0
- package/cjs/index.js.map +1 -0
- package/cjs/layout-action.js +27 -0
- package/cjs/layout-action.js.map +1 -0
- package/cjs/layout-header/Header.css.js +6 -0
- package/cjs/layout-header/Header.css.js.map +1 -0
- package/cjs/layout-header/Header.js +131 -0
- package/cjs/layout-header/Header.js.map +1 -0
- package/cjs/layout-provider/LayoutProvider.js +178 -0
- package/cjs/layout-provider/LayoutProvider.js.map +1 -0
- package/cjs/layout-provider/LayoutProviderContext.js +14 -0
- package/cjs/layout-provider/LayoutProviderContext.js.map +1 -0
- package/cjs/layout-provider/useLayoutDragDrop.js +172 -0
- package/cjs/layout-provider/useLayoutDragDrop.js.map +1 -0
- package/cjs/layout-reducer/flexUtils.js +219 -0
- package/cjs/layout-reducer/flexUtils.js.map +1 -0
- package/cjs/layout-reducer/insert-layout-element.js +273 -0
- package/cjs/layout-reducer/insert-layout-element.js.map +1 -0
- package/cjs/layout-reducer/layout-reducer.js +198 -0
- package/cjs/layout-reducer/layout-reducer.js.map +1 -0
- package/cjs/layout-reducer/layoutTypes.js +41 -0
- package/cjs/layout-reducer/layoutTypes.js.map +1 -0
- package/cjs/layout-reducer/layoutUtils.js +226 -0
- package/cjs/layout-reducer/layoutUtils.js.map +1 -0
- package/cjs/layout-reducer/move-layout-element.js +31 -0
- package/cjs/layout-reducer/move-layout-element.js.map +1 -0
- package/cjs/layout-reducer/remove-layout-element.js +223 -0
- package/cjs/layout-reducer/remove-layout-element.js.map +1 -0
- package/cjs/layout-reducer/replace-layout-element.js +91 -0
- package/cjs/layout-reducer/replace-layout-element.js.map +1 -0
- package/cjs/layout-reducer/resize-flex-children.js +61 -0
- package/cjs/layout-reducer/resize-flex-children.js.map +1 -0
- package/cjs/layout-reducer/wrap-layout-element.js +212 -0
- package/cjs/layout-reducer/wrap-layout-element.js.map +1 -0
- package/cjs/layout-view/View.css.js +6 -0
- package/cjs/layout-view/View.css.js.map +1 -0
- package/cjs/layout-view/View.js +164 -0
- package/cjs/layout-view/View.js.map +1 -0
- package/cjs/layout-view/useView.js +92 -0
- package/cjs/layout-view/useView.js.map +1 -0
- package/cjs/layout-view/useViewResize.js +42 -0
- package/cjs/layout-view/useViewResize.js.map +1 -0
- package/cjs/layout-view-actions/ViewContext.js +16 -0
- package/cjs/layout-view-actions/ViewContext.js.map +1 -0
- package/cjs/layout-view-actions/useViewActionDispatcher.js +103 -0
- package/cjs/layout-view-actions/useViewActionDispatcher.js.map +1 -0
- package/cjs/palette/Palette.css.js +6 -0
- package/cjs/palette/Palette.css.js.map +1 -0
- package/cjs/palette/Palette.js +127 -0
- package/cjs/palette/Palette.js.map +1 -0
- package/cjs/placeholder/LayoutStartPanel.css.js +6 -0
- package/cjs/placeholder/LayoutStartPanel.css.js.map +1 -0
- package/cjs/placeholder/LayoutStartPanel.js +60 -0
- package/cjs/placeholder/LayoutStartPanel.js.map +1 -0
- package/cjs/placeholder/Placeholder.css.js +6 -0
- package/cjs/placeholder/Placeholder.css.js.map +1 -0
- package/cjs/placeholder/Placeholder.js +34 -0
- package/cjs/placeholder/Placeholder.js.map +1 -0
- package/cjs/registry/ComponentRegistry.js +27 -0
- package/cjs/registry/ComponentRegistry.js.map +1 -0
- package/cjs/responsive/breakpoints.js +36 -0
- package/cjs/responsive/breakpoints.js.map +1 -0
- package/cjs/responsive/use-breakpoints.js +76 -0
- package/cjs/responsive/use-breakpoints.js.map +1 -0
- package/cjs/responsive/useResizeObserver.js +118 -0
- package/cjs/responsive/useResizeObserver.js.map +1 -0
- package/cjs/responsive/utils.js +34 -0
- package/cjs/responsive/utils.js.map +1 -0
- package/cjs/stack/Stack.css.js +6 -0
- package/cjs/stack/Stack.css.js.map +1 -0
- package/cjs/stack/Stack.js +148 -0
- package/cjs/stack/Stack.js.map +1 -0
- package/cjs/stack/StackLayout.js +122 -0
- package/cjs/stack/StackLayout.js.map +1 -0
- package/cjs/use-persistent-state.js +109 -0
- package/cjs/use-persistent-state.js.map +1 -0
- package/cjs/utils/pathUtils.js +293 -0
- package/cjs/utils/pathUtils.js.map +1 -0
- package/cjs/utils/propUtils.js +27 -0
- package/cjs/utils/propUtils.js.map +1 -0
- package/cjs/utils/refUtils.js +12 -0
- package/cjs/utils/refUtils.js.map +1 -0
- package/cjs/utils/styleUtils.js +15 -0
- package/cjs/utils/styleUtils.js.map +1 -0
- package/cjs/utils/typeOf.js +27 -0
- package/cjs/utils/typeOf.js.map +1 -0
- package/esm/Component.js +12 -0
- package/esm/Component.js.map +1 -0
- package/esm/DraggableLayout.css.js +4 -0
- package/esm/DraggableLayout.css.js.map +1 -0
- package/esm/DraggableLayout.js +31 -0
- package/esm/DraggableLayout.js.map +1 -0
- package/esm/dock-layout/DockLayout.css.js +4 -0
- package/esm/dock-layout/DockLayout.css.js.map +1 -0
- package/esm/dock-layout/DockLayout.js +34 -0
- package/esm/dock-layout/DockLayout.js.map +1 -0
- package/esm/dock-layout/Drawer.css.js +4 -0
- package/esm/dock-layout/Drawer.css.js.map +1 -0
- package/esm/dock-layout/Drawer.js +94 -0
- package/esm/dock-layout/Drawer.js.map +1 -0
- package/esm/drag-drop/BoxModel.js +415 -0
- package/esm/drag-drop/BoxModel.js.map +1 -0
- package/esm/drag-drop/DragState.js +152 -0
- package/esm/drag-drop/DragState.js.map +1 -0
- package/esm/drag-drop/Draggable.js +190 -0
- package/esm/drag-drop/Draggable.js.map +1 -0
- package/esm/drag-drop/DropMenu.css.js +4 -0
- package/esm/drag-drop/DropMenu.css.js.map +1 -0
- package/esm/drag-drop/DropMenu.js +52 -0
- package/esm/drag-drop/DropMenu.js.map +1 -0
- package/esm/drag-drop/DropTarget.js +240 -0
- package/esm/drag-drop/DropTarget.js.map +1 -0
- package/esm/drag-drop/DropTargetRenderer.js +242 -0
- package/esm/drag-drop/DropTargetRenderer.js.map +1 -0
- package/esm/flexbox/Flexbox.css.js +4 -0
- package/esm/flexbox/Flexbox.css.js.map +1 -0
- package/esm/flexbox/Flexbox.js +68 -0
- package/esm/flexbox/Flexbox.js.map +1 -0
- package/esm/flexbox/FlexboxLayout.js +28 -0
- package/esm/flexbox/FlexboxLayout.js.map +1 -0
- package/esm/flexbox/FluidGrid.css.js +4 -0
- package/esm/flexbox/FluidGrid.css.js.map +1 -0
- package/esm/flexbox/FluidGrid.js +85 -0
- package/esm/flexbox/FluidGrid.js.map +1 -0
- package/esm/flexbox/FluidGridLayout.js +12 -0
- package/esm/flexbox/FluidGridLayout.js.map +1 -0
- package/esm/flexbox/Splitter.css.js +4 -0
- package/esm/flexbox/Splitter.css.js.map +1 -0
- package/esm/flexbox/Splitter.js +120 -0
- package/esm/flexbox/Splitter.js.map +1 -0
- package/esm/flexbox/flexbox-utils.js +103 -0
- package/esm/flexbox/flexbox-utils.js.map +1 -0
- package/esm/flexbox/useResponsiveSizing.js +60 -0
- package/esm/flexbox/useResponsiveSizing.js.map +1 -0
- package/esm/flexbox/useSplitterResizing.js +207 -0
- package/esm/flexbox/useSplitterResizing.js.map +1 -0
- package/esm/index.js +37 -0
- package/esm/index.js.map +1 -0
- package/esm/layout-action.js +25 -0
- package/esm/layout-action.js.map +1 -0
- package/esm/layout-header/Header.css.js +4 -0
- package/esm/layout-header/Header.css.js.map +1 -0
- package/esm/layout-header/Header.js +129 -0
- package/esm/layout-header/Header.js.map +1 -0
- package/esm/layout-provider/LayoutProvider.js +172 -0
- package/esm/layout-provider/LayoutProvider.js.map +1 -0
- package/esm/layout-provider/LayoutProviderContext.js +12 -0
- package/esm/layout-provider/LayoutProviderContext.js.map +1 -0
- package/esm/layout-provider/useLayoutDragDrop.js +170 -0
- package/esm/layout-provider/useLayoutDragDrop.js.map +1 -0
- package/esm/layout-reducer/flexUtils.js +210 -0
- package/esm/layout-reducer/flexUtils.js.map +1 -0
- package/esm/layout-reducer/insert-layout-element.js +269 -0
- package/esm/layout-reducer/insert-layout-element.js.map +1 -0
- package/esm/layout-reducer/layout-reducer.js +196 -0
- package/esm/layout-reducer/layout-reducer.js.map +1 -0
- package/esm/layout-reducer/layoutTypes.js +37 -0
- package/esm/layout-reducer/layoutTypes.js.map +1 -0
- package/esm/layout-reducer/layoutUtils.js +215 -0
- package/esm/layout-reducer/layoutUtils.js.map +1 -0
- package/esm/layout-reducer/move-layout-element.js +29 -0
- package/esm/layout-reducer/move-layout-element.js.map +1 -0
- package/esm/layout-reducer/remove-layout-element.js +221 -0
- package/esm/layout-reducer/remove-layout-element.js.map +1 -0
- package/esm/layout-reducer/replace-layout-element.js +87 -0
- package/esm/layout-reducer/replace-layout-element.js.map +1 -0
- package/esm/layout-reducer/resize-flex-children.js +58 -0
- package/esm/layout-reducer/resize-flex-children.js.map +1 -0
- package/esm/layout-reducer/wrap-layout-element.js +210 -0
- package/esm/layout-reducer/wrap-layout-element.js.map +1 -0
- package/esm/layout-view/View.css.js +4 -0
- package/esm/layout-view/View.css.js.map +1 -0
- package/esm/layout-view/View.js +162 -0
- package/esm/layout-view/View.js.map +1 -0
- package/esm/layout-view/useView.js +90 -0
- package/esm/layout-view/useView.js.map +1 -0
- package/esm/layout-view/useViewResize.js +40 -0
- package/esm/layout-view/useViewResize.js.map +1 -0
- package/esm/layout-view-actions/ViewContext.js +12 -0
- package/esm/layout-view-actions/ViewContext.js.map +1 -0
- package/esm/layout-view-actions/useViewActionDispatcher.js +101 -0
- package/esm/layout-view-actions/useViewActionDispatcher.js.map +1 -0
- package/esm/palette/Palette.css.js +4 -0
- package/esm/palette/Palette.css.js.map +1 -0
- package/esm/palette/Palette.js +124 -0
- package/esm/palette/Palette.js.map +1 -0
- package/esm/placeholder/LayoutStartPanel.css.js +4 -0
- package/esm/placeholder/LayoutStartPanel.css.js.map +1 -0
- package/esm/placeholder/LayoutStartPanel.js +58 -0
- package/esm/placeholder/LayoutStartPanel.js.map +1 -0
- package/esm/placeholder/Placeholder.css.js +4 -0
- package/esm/placeholder/Placeholder.css.js.map +1 -0
- package/esm/placeholder/Placeholder.js +32 -0
- package/esm/placeholder/Placeholder.js.map +1 -0
- package/esm/registry/ComponentRegistry.js +21 -0
- package/esm/registry/ComponentRegistry.js.map +1 -0
- package/esm/responsive/breakpoints.js +33 -0
- package/esm/responsive/breakpoints.js.map +1 -0
- package/esm/responsive/use-breakpoints.js +74 -0
- package/esm/responsive/use-breakpoints.js.map +1 -0
- package/esm/responsive/useResizeObserver.js +112 -0
- package/esm/responsive/useResizeObserver.js.map +1 -0
- package/esm/responsive/utils.js +31 -0
- package/esm/responsive/utils.js.map +1 -0
- package/esm/stack/Stack.css.js +4 -0
- package/esm/stack/Stack.css.js.map +1 -0
- package/esm/stack/Stack.js +146 -0
- package/esm/stack/Stack.js.map +1 -0
- package/esm/stack/StackLayout.js +120 -0
- package/esm/stack/StackLayout.js.map +1 -0
- package/esm/use-persistent-state.js +104 -0
- package/esm/use-persistent-state.js.map +1 -0
- package/esm/utils/pathUtils.js +280 -0
- package/esm/utils/pathUtils.js.map +1 -0
- package/esm/utils/propUtils.js +23 -0
- package/esm/utils/propUtils.js.map +1 -0
- package/esm/utils/refUtils.js +10 -0
- package/esm/utils/refUtils.js.map +1 -0
- package/esm/utils/styleUtils.js +13 -0
- package/esm/utils/styleUtils.js.map +1 -0
- package/esm/utils/typeOf.js +23 -0
- package/esm/utils/typeOf.js.map +1 -0
- package/package.json +43 -0
- package/types/Component.d.ts +7 -0
- package/types/DraggableLayout.d.ts +6 -0
- package/types/debug.d.ts +2 -0
- package/types/dock-layout/DockLayout.d.ts +9 -0
- package/types/dock-layout/Drawer.d.ts +17 -0
- package/types/dock-layout/index.d.ts +2 -0
- package/types/drag-drop/BoxModel.d.ts +143 -0
- package/types/drag-drop/DragState.d.ts +46 -0
- package/types/drag-drop/Draggable.d.ts +24 -0
- package/types/drag-drop/DropMenu.d.ts +9 -0
- package/types/drag-drop/DropTarget.d.ts +61 -0
- package/types/drag-drop/DropTargetRenderer.d.ts +17 -0
- package/types/drag-drop/dragDropTypes.d.ts +51 -0
- package/types/drag-drop/index.d.ts +4 -0
- package/types/flexbox/Flexbox.d.ts +4 -0
- package/types/flexbox/FlexboxLayout.d.ts +6 -0
- package/types/flexbox/FluidGrid.d.ts +6 -0
- package/types/flexbox/FluidGridLayout.d.ts +6 -0
- package/types/flexbox/Splitter.d.ts +12 -0
- package/types/flexbox/flexbox-utils.d.ts +12 -0
- package/types/flexbox/flexboxTypes.d.ts +51 -0
- package/types/flexbox/index.d.ts +4 -0
- package/types/flexbox/useResponsiveSizing.d.ts +10 -0
- package/types/flexbox/useSplitterResizing.d.ts +2 -0
- package/types/index.d.ts +18 -0
- package/types/layout-action.d.ts +22 -0
- package/types/layout-header/ActionButton.d.ts +8 -0
- package/types/layout-header/Header.d.ts +12 -0
- package/types/layout-header/index.d.ts +1 -0
- package/types/layout-provider/LayoutProvider.d.ts +15 -0
- package/types/layout-provider/LayoutProviderContext.d.ts +9 -0
- package/types/layout-provider/index.d.ts +2 -0
- package/types/layout-provider/useLayoutDragDrop.d.ts +4 -0
- package/types/layout-reducer/flexUtils.d.ts +22 -0
- package/types/layout-reducer/index.d.ts +4 -0
- package/types/layout-reducer/insert-layout-element.d.ts +8 -0
- package/types/layout-reducer/layout-reducer.d.ts +3 -0
- package/types/layout-reducer/layoutTypes.d.ts +193 -0
- package/types/layout-reducer/layoutUtils.d.ts +38 -0
- package/types/layout-reducer/move-layout-element.d.ts +3 -0
- package/types/layout-reducer/remove-layout-element.d.ts +3 -0
- package/types/layout-reducer/replace-layout-element.d.ts +6 -0
- package/types/layout-reducer/resize-flex-children.d.ts +4 -0
- package/types/layout-reducer/wrap-layout-element.d.ts +9 -0
- package/types/layout-view/View.d.ts +10 -0
- package/types/layout-view/index.d.ts +2 -0
- package/types/layout-view/useView.d.ts +21 -0
- package/types/layout-view/useViewResize.d.ts +7 -0
- package/types/layout-view/viewTypes.d.ts +21 -0
- package/types/layout-view-actions/ViewContext.d.ts +33 -0
- package/types/layout-view-actions/index.d.ts +2 -0
- package/types/layout-view-actions/useViewActionDispatcher.d.ts +9 -0
- package/types/palette/Palette.d.ts +21 -0
- package/types/palette/index.d.ts +1 -0
- package/types/placeholder/LayoutStartPanel.d.ts +5 -0
- package/types/placeholder/Placeholder.d.ts +17 -0
- package/types/placeholder/index.d.ts +1 -0
- package/types/registry/ComponentRegistry.d.ts +13 -0
- package/types/registry/index.d.ts +1 -0
- package/types/responsive/breakpoints.d.ts +4 -0
- package/types/responsive/index.d.ts +3 -0
- package/types/responsive/measureMinimumNodeSize.d.ts +1 -0
- package/types/responsive/overflowUtils.d.ts +2 -0
- package/types/responsive/use-breakpoints.d.ts +7 -0
- package/types/responsive/useResizeObserver.d.ts +13 -0
- package/types/responsive/utils.d.ts +6 -0
- package/types/stack/Stack.d.ts +3 -0
- package/types/stack/StackLayout.d.ts +6 -0
- package/types/stack/index.d.ts +3 -0
- package/types/stack/stackTypes.d.ts +22 -0
- package/types/tabs/TabPanel.d.ts +7 -0
- package/types/tabs/index.d.ts +1 -0
- package/types/tools/config-wrapper/ConfigWrapper.d.ts +2 -0
- package/types/tools/config-wrapper/index.d.ts +1 -0
- package/types/tools/devtools-box/layout-configurator.d.ts +31 -0
- package/types/tools/devtools-tree/layout-tree-viewer.d.ts +5 -0
- package/types/tools/index.d.ts +3 -0
- package/types/use-persistent-state.d.ts +11 -0
- package/types/utils/index.d.ts +5 -0
- package/types/utils/pathUtils.d.ts +31 -0
- package/types/utils/propUtils.d.ts +5 -0
- package/types/utils/refUtils.d.ts +2 -0
- package/types/utils/styleUtils.d.ts +3 -0
- package/types/utils/typeOf.d.ts +5 -0
package/cjs/index.js
ADDED
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var DockLayout = require('./dock-layout/DockLayout.js');
|
|
4
|
+
var Drawer = require('./dock-layout/Drawer.js');
|
|
5
|
+
var Component = require('./Component.js');
|
|
6
|
+
var Draggable = require('./drag-drop/Draggable.js');
|
|
7
|
+
var DropMenu = require('./drag-drop/DropMenu.js');
|
|
8
|
+
var DropTarget = require('./drag-drop/DropTarget.js');
|
|
9
|
+
var DraggableLayout = require('./DraggableLayout.js');
|
|
10
|
+
var Flexbox = require('./flexbox/Flexbox.js');
|
|
11
|
+
var FlexboxLayout = require('./flexbox/FlexboxLayout.js');
|
|
12
|
+
var FluidGrid = require('./flexbox/FluidGrid.js');
|
|
13
|
+
var FluidGridLayout = require('./flexbox/FluidGridLayout.js');
|
|
14
|
+
var layoutAction = require('./layout-action.js');
|
|
15
|
+
var Header = require('./layout-header/Header.js');
|
|
16
|
+
var LayoutProvider = require('./layout-provider/LayoutProvider.js');
|
|
17
|
+
var LayoutProviderContext = require('./layout-provider/LayoutProviderContext.js');
|
|
18
|
+
var flexUtils = require('./layout-reducer/flexUtils.js');
|
|
19
|
+
var layoutReducer = require('./layout-reducer/layout-reducer.js');
|
|
20
|
+
var layoutTypes = require('./layout-reducer/layoutTypes.js');
|
|
21
|
+
var layoutUtils = require('./layout-reducer/layoutUtils.js');
|
|
22
|
+
var View = require('./layout-view/View.js');
|
|
23
|
+
var useViewActionDispatcher = require('./layout-view-actions/useViewActionDispatcher.js');
|
|
24
|
+
var ViewContext = require('./layout-view-actions/ViewContext.js');
|
|
25
|
+
var Palette = require('./palette/Palette.js');
|
|
26
|
+
var Placeholder = require('./placeholder/Placeholder.js');
|
|
27
|
+
var ComponentRegistry = require('./registry/ComponentRegistry.js');
|
|
28
|
+
var useBreakpoints = require('./responsive/use-breakpoints.js');
|
|
29
|
+
var useResizeObserver = require('./responsive/useResizeObserver.js');
|
|
30
|
+
var utils = require('./responsive/utils.js');
|
|
31
|
+
var Stack = require('./stack/Stack.js');
|
|
32
|
+
var StackLayout = require('./stack/StackLayout.js');
|
|
33
|
+
var usePersistentState = require('./use-persistent-state.js');
|
|
34
|
+
var pathUtils = require('./utils/pathUtils.js');
|
|
35
|
+
var propUtils = require('./utils/propUtils.js');
|
|
36
|
+
var refUtils = require('./utils/refUtils.js');
|
|
37
|
+
var styleUtils = require('./utils/styleUtils.js');
|
|
38
|
+
var typeOf = require('./utils/typeOf.js');
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
exports.DockLayout = DockLayout;
|
|
43
|
+
exports.Drawer = Drawer;
|
|
44
|
+
exports.Component = Component;
|
|
45
|
+
exports.Draggable = Draggable.Draggable;
|
|
46
|
+
exports.DropMenu = DropMenu.DropMenu;
|
|
47
|
+
exports.computeMenuPosition = DropMenu.computeMenuPosition;
|
|
48
|
+
exports.DropTarget = DropTarget.DropTarget;
|
|
49
|
+
exports.identifyDropTarget = DropTarget.identifyDropTarget;
|
|
50
|
+
exports.isTabstrip = DropTarget.isTabstrip;
|
|
51
|
+
exports.DraggableLayout = DraggableLayout.DraggableLayout;
|
|
52
|
+
exports.Flexbox = Flexbox;
|
|
53
|
+
exports.FlexboxLayout = FlexboxLayout.FlexboxLayout;
|
|
54
|
+
exports.FluidGrid = FluidGrid.FluidGrid;
|
|
55
|
+
exports.FluidGridLayout = FluidGridLayout.FluidGridLayout;
|
|
56
|
+
exports.Action = layoutAction.Action;
|
|
57
|
+
exports.Header = Header.Header;
|
|
58
|
+
exports.LayoutProvider = LayoutProvider.LayoutProvider;
|
|
59
|
+
exports.LayoutProviderVersion = LayoutProvider.LayoutProviderVersion;
|
|
60
|
+
exports.useLayoutCreateNewChild = LayoutProvider.useLayoutCreateNewChild;
|
|
61
|
+
exports.useLayoutProviderDispatch = LayoutProvider.useLayoutProviderDispatch;
|
|
62
|
+
exports.useLayoutProviderVersion = LayoutProvider.useLayoutProviderVersion;
|
|
63
|
+
exports.LayoutProviderContext = LayoutProviderContext.LayoutProviderContext;
|
|
64
|
+
exports.createFlexbox = flexUtils.createFlexbox;
|
|
65
|
+
exports.createPlaceHolder = flexUtils.createPlaceHolder;
|
|
66
|
+
exports.getFlexDimensions = flexUtils.getFlexDimensions;
|
|
67
|
+
exports.getFlexOrIntrinsicStyle = flexUtils.getFlexOrIntrinsicStyle;
|
|
68
|
+
exports.getFlexStyle = flexUtils.getFlexStyle;
|
|
69
|
+
exports.getIntrinsicSize = flexUtils.getIntrinsicSize;
|
|
70
|
+
exports.hasUnboundedFlexStyle = flexUtils.hasUnboundedFlexStyle;
|
|
71
|
+
exports.wrapIntrinsicSizeComponentWithFlexbox = flexUtils.wrapIntrinsicSizeComponentWithFlexbox;
|
|
72
|
+
exports.layoutReducer = layoutReducer.layoutReducer;
|
|
73
|
+
exports.LayoutActionType = layoutTypes.LayoutActionType;
|
|
74
|
+
exports.isApplicationLevelChange = layoutTypes.isApplicationLevelChange;
|
|
75
|
+
exports.isLayoutLevelChange = layoutTypes.isLayoutLevelChange;
|
|
76
|
+
exports.applyLayout = layoutUtils.applyLayout;
|
|
77
|
+
exports.applyLayoutProps = layoutUtils.applyLayoutProps;
|
|
78
|
+
exports.componentToJson = layoutUtils.componentToJson;
|
|
79
|
+
exports.getDefaultTabLabel = layoutUtils.getDefaultTabLabel;
|
|
80
|
+
exports.getManagedDimension = layoutUtils.getManagedDimension;
|
|
81
|
+
exports.layoutFromJson = layoutUtils.layoutFromJson;
|
|
82
|
+
exports.layoutQuery = layoutUtils.layoutQuery;
|
|
83
|
+
exports.layoutToJSON = layoutUtils.layoutToJSON;
|
|
84
|
+
exports.processLayoutElement = layoutUtils.processLayoutElement;
|
|
85
|
+
exports.serializeProps = layoutUtils.serializeProps;
|
|
86
|
+
exports.View = View.View;
|
|
87
|
+
exports.useViewActionDispatcher = useViewActionDispatcher.useViewActionDispatcher;
|
|
88
|
+
exports.ViewContext = ViewContext.ViewContext;
|
|
89
|
+
exports.useViewContext = ViewContext.useViewContext;
|
|
90
|
+
exports.useViewDispatch = ViewContext.useViewDispatch;
|
|
91
|
+
exports.Palette = Palette.Palette;
|
|
92
|
+
exports.PaletteItem = Palette.PaletteItem;
|
|
93
|
+
exports.Placeholder = Placeholder.Placeholder;
|
|
94
|
+
exports.ComponentRegistry = ComponentRegistry.ComponentRegistry;
|
|
95
|
+
exports.isContainer = ComponentRegistry.isContainer;
|
|
96
|
+
exports.isLayoutComponent = ComponentRegistry.isLayoutComponent;
|
|
97
|
+
exports.isView = ComponentRegistry.isView;
|
|
98
|
+
exports.registerComponent = ComponentRegistry.registerComponent;
|
|
99
|
+
exports.useBreakpoints = useBreakpoints.useBreakpoints;
|
|
100
|
+
exports.HeightOnly = useResizeObserver.HeightOnly;
|
|
101
|
+
exports.WidthHeight = useResizeObserver.WidthHeight;
|
|
102
|
+
exports.WidthOnly = useResizeObserver.WidthOnly;
|
|
103
|
+
exports.resizeObserver = useResizeObserver.resizeObserver;
|
|
104
|
+
exports.useResizeObserver = useResizeObserver.useResizeObserver;
|
|
105
|
+
exports.extractResponsiveProps = utils.extractResponsiveProps;
|
|
106
|
+
exports.isResponsiveAttribute = utils.isResponsiveAttribute;
|
|
107
|
+
exports.Stack = Stack.Stack;
|
|
108
|
+
exports.StackLayout = StackLayout.StackLayout;
|
|
109
|
+
exports.getPersistentState = usePersistentState.getPersistentState;
|
|
110
|
+
exports.hasPersistentState = usePersistentState.hasPersistentState;
|
|
111
|
+
exports.setPersistentState = usePersistentState.setPersistentState;
|
|
112
|
+
exports.usePersistentState = usePersistentState.usePersistentState;
|
|
113
|
+
exports.containerOf = pathUtils.containerOf;
|
|
114
|
+
exports.findTarget = pathUtils.findTarget;
|
|
115
|
+
exports.followPath = pathUtils.followPath;
|
|
116
|
+
exports.followPathToComponent = pathUtils.followPathToComponent;
|
|
117
|
+
exports.followPathToParent = pathUtils.followPathToParent;
|
|
118
|
+
exports.getChild = pathUtils.getChild;
|
|
119
|
+
exports.nextLeaf = pathUtils.nextLeaf;
|
|
120
|
+
exports.nextStep = pathUtils.nextStep;
|
|
121
|
+
exports.previousLeaf = pathUtils.previousLeaf;
|
|
122
|
+
exports.resetPath = pathUtils.resetPath;
|
|
123
|
+
exports.resolveJSONPath = pathUtils.resolveJSONPath;
|
|
124
|
+
exports.resolvePath = pathUtils.resolvePath;
|
|
125
|
+
exports.getChildProp = propUtils.getChildProp;
|
|
126
|
+
exports.getProp = propUtils.getProp;
|
|
127
|
+
exports.getProps = propUtils.getProps;
|
|
128
|
+
exports.setRef = refUtils.setRef;
|
|
129
|
+
exports.expandFlex = styleUtils.expandFlex;
|
|
130
|
+
exports.isLayoutJSON = typeOf.isLayoutJSON;
|
|
131
|
+
exports.isTypeOf = typeOf.isTypeOf;
|
|
132
|
+
exports.typeOf = typeOf.typeOf;
|
|
133
|
+
//# sourceMappingURL=index.js.map
|
package/cjs/index.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
const Action = {
|
|
4
|
+
ADD: "add",
|
|
5
|
+
BLUR: "blur",
|
|
6
|
+
BLUR_SPLITTER: "blur-splitter",
|
|
7
|
+
DRAG_START: "drag-start",
|
|
8
|
+
DRAG_STARTED: "drag-started",
|
|
9
|
+
DRAG_DROP: "drag-drop",
|
|
10
|
+
FOCUS: "focus",
|
|
11
|
+
FOCUS_SPLITTER: "focus-splitter",
|
|
12
|
+
INITIALIZE: "initialize",
|
|
13
|
+
LAYOUT_RESIZE: "layout-resize",
|
|
14
|
+
MAXIMIZE: "maximize",
|
|
15
|
+
MINIMIZE: "minimize",
|
|
16
|
+
REMOVE: "remove",
|
|
17
|
+
REPLACE: "replace",
|
|
18
|
+
RESTORE: "restore",
|
|
19
|
+
SAVE: "save",
|
|
20
|
+
SET_TITLE: "set-title",
|
|
21
|
+
SPLITTER_RESIZE: "splitter-resize",
|
|
22
|
+
SWITCH_TAB: "switch-tab",
|
|
23
|
+
TEAR_OUT: "tear-out"
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
exports.Action = Action;
|
|
27
|
+
//# sourceMappingURL=layout-action.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layout-action.js","sources":["../src/layout-action.ts"],"sourcesContent":["export const Action = {\n ADD: \"add\",\n BLUR: \"blur\",\n BLUR_SPLITTER: \"blur-splitter\",\n DRAG_START: \"drag-start\",\n DRAG_STARTED: \"drag-started\",\n DRAG_DROP: \"drag-drop\",\n FOCUS: \"focus\",\n FOCUS_SPLITTER: \"focus-splitter\",\n INITIALIZE: \"initialize\",\n LAYOUT_RESIZE: \"layout-resize\",\n MAXIMIZE: \"maximize\",\n MINIMIZE: \"minimize\",\n REMOVE: \"remove\",\n REPLACE: \"replace\",\n RESTORE: \"restore\",\n SAVE: \"save\",\n SET_TITLE: \"set-title\",\n SPLITTER_RESIZE: \"splitter-resize\",\n SWITCH_TAB: \"switch-tab\",\n TEAR_OUT: \"tear-out\",\n};\n"],"names":[],"mappings":";;AAAO,MAAM,MAAS,GAAA;AAAA,EACpB,GAAK,EAAA,KAAA;AAAA,EACL,IAAM,EAAA,MAAA;AAAA,EACN,aAAe,EAAA,eAAA;AAAA,EACf,UAAY,EAAA,YAAA;AAAA,EACZ,YAAc,EAAA,cAAA;AAAA,EACd,SAAW,EAAA,WAAA;AAAA,EACX,KAAO,EAAA,OAAA;AAAA,EACP,cAAgB,EAAA,gBAAA;AAAA,EAChB,UAAY,EAAA,YAAA;AAAA,EACZ,aAAe,EAAA,eAAA;AAAA,EACf,QAAU,EAAA,UAAA;AAAA,EACV,QAAU,EAAA,UAAA;AAAA,EACV,MAAQ,EAAA,QAAA;AAAA,EACR,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AAAA,EACT,IAAM,EAAA,MAAA;AAAA,EACN,SAAW,EAAA,WAAA;AAAA,EACX,eAAiB,EAAA,iBAAA;AAAA,EACjB,UAAY,EAAA,YAAA;AAAA,EACZ,QAAU,EAAA,UAAA;AACZ;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Header.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
|
|
5
|
+
var cx = require('clsx');
|
|
6
|
+
var styles = require('@salt-ds/styles');
|
|
7
|
+
var window = require('@salt-ds/window');
|
|
8
|
+
var React = require('react');
|
|
9
|
+
require('@vuu-ui/vuu-utils');
|
|
10
|
+
require('../layout-provider/LayoutProviderContext.js');
|
|
11
|
+
require('../drag-drop/Draggable.js');
|
|
12
|
+
require('../drag-drop/BoxModel.js');
|
|
13
|
+
var ViewContext = require('../layout-view-actions/ViewContext.js');
|
|
14
|
+
var Header$1 = require('./Header.css.js');
|
|
15
|
+
|
|
16
|
+
const classBase = "vuuHeader";
|
|
17
|
+
const Header = ({
|
|
18
|
+
className: classNameProp,
|
|
19
|
+
contributions,
|
|
20
|
+
collapsed,
|
|
21
|
+
closeable,
|
|
22
|
+
onEditTitle,
|
|
23
|
+
orientation: orientationProp = "horizontal",
|
|
24
|
+
style,
|
|
25
|
+
title = "Untitled"
|
|
26
|
+
}) => {
|
|
27
|
+
const targetWindow = window.useWindow();
|
|
28
|
+
styles.useComponentCssInjection({
|
|
29
|
+
testId: "vuu-header",
|
|
30
|
+
css: Header$1,
|
|
31
|
+
window: targetWindow
|
|
32
|
+
});
|
|
33
|
+
const labelFieldRef = React.useRef(null);
|
|
34
|
+
const [value, setValue] = React.useState(title);
|
|
35
|
+
const [editing, setEditing] = React.useState(false);
|
|
36
|
+
const viewDispatch = ViewContext.useViewDispatch();
|
|
37
|
+
const handleClose = (evt) => viewDispatch?.({ type: "remove" }, evt);
|
|
38
|
+
const handleTitleMouseDown = () => {
|
|
39
|
+
labelFieldRef.current?.focus();
|
|
40
|
+
};
|
|
41
|
+
const handleButtonMouseDown = (evt) => {
|
|
42
|
+
evt.stopPropagation();
|
|
43
|
+
};
|
|
44
|
+
const orientation = collapsed || orientationProp;
|
|
45
|
+
const className = cx(classBase, classNameProp, `${classBase}-${orientation}`);
|
|
46
|
+
const handleEnterEditMode = () => {
|
|
47
|
+
setEditing(true);
|
|
48
|
+
};
|
|
49
|
+
const handleTitleKeyDown = (evt) => {
|
|
50
|
+
if (evt.key === "Enter") {
|
|
51
|
+
setEditing(true);
|
|
52
|
+
}
|
|
53
|
+
};
|
|
54
|
+
const handleExitEditMode = (originalValue = "", finalValue = "", allowDeactivation = true, editCancelled = false) => {
|
|
55
|
+
setEditing(false);
|
|
56
|
+
if (editCancelled) {
|
|
57
|
+
setValue(originalValue);
|
|
58
|
+
} else if (finalValue !== originalValue) {
|
|
59
|
+
setValue(finalValue);
|
|
60
|
+
onEditTitle?.(finalValue);
|
|
61
|
+
}
|
|
62
|
+
if (allowDeactivation === false) {
|
|
63
|
+
labelFieldRef.current?.focus();
|
|
64
|
+
}
|
|
65
|
+
};
|
|
66
|
+
const handleMouseDown = (e) => {
|
|
67
|
+
viewDispatch?.({ type: "mousedown" }, e);
|
|
68
|
+
};
|
|
69
|
+
const toolbarItems = [];
|
|
70
|
+
const postTitleContributedItems = [];
|
|
71
|
+
const actionButtons = [];
|
|
72
|
+
contributions?.forEach((contribution, i) => {
|
|
73
|
+
switch (contribution.location) {
|
|
74
|
+
case "pre-title":
|
|
75
|
+
toolbarItems.push(React.cloneElement(contribution.content, { key: i }));
|
|
76
|
+
break;
|
|
77
|
+
default:
|
|
78
|
+
postTitleContributedItems.push(
|
|
79
|
+
React.cloneElement(contribution.content, { key: i })
|
|
80
|
+
);
|
|
81
|
+
}
|
|
82
|
+
});
|
|
83
|
+
title && toolbarItems.push(
|
|
84
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
85
|
+
vuuUiControls.EditableLabel,
|
|
86
|
+
{
|
|
87
|
+
className: `${classBase}-title`,
|
|
88
|
+
editing,
|
|
89
|
+
value,
|
|
90
|
+
onChange: setValue,
|
|
91
|
+
onMouseDownCapture: handleTitleMouseDown,
|
|
92
|
+
onEnterEditMode: handleEnterEditMode,
|
|
93
|
+
onExitEditMode: handleExitEditMode,
|
|
94
|
+
onKeyDown: handleTitleKeyDown,
|
|
95
|
+
ref: labelFieldRef,
|
|
96
|
+
tabIndex: 0
|
|
97
|
+
},
|
|
98
|
+
"title"
|
|
99
|
+
)
|
|
100
|
+
);
|
|
101
|
+
closeable && actionButtons.push(
|
|
102
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
103
|
+
vuuUiControls.IconButton,
|
|
104
|
+
{
|
|
105
|
+
icon: "close",
|
|
106
|
+
onClick: handleClose,
|
|
107
|
+
onMouseDown: handleButtonMouseDown,
|
|
108
|
+
variant: "secondary"
|
|
109
|
+
},
|
|
110
|
+
"close"
|
|
111
|
+
)
|
|
112
|
+
);
|
|
113
|
+
postTitleContributedItems.length > 0 && toolbarItems.push(
|
|
114
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "vuuTooltrayProxy", "data-align": "end", children: postTitleContributedItems }, "contributions")
|
|
115
|
+
);
|
|
116
|
+
actionButtons.length > 0 && toolbarItems.push(
|
|
117
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "vuuTooltrayProxy", "data-align": "end", children: actionButtons }, "actions")
|
|
118
|
+
);
|
|
119
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
120
|
+
"div",
|
|
121
|
+
{
|
|
122
|
+
className: cx("vuuToolbarProxy", className),
|
|
123
|
+
style,
|
|
124
|
+
onMouseDown: handleMouseDown,
|
|
125
|
+
children: toolbarItems
|
|
126
|
+
}
|
|
127
|
+
);
|
|
128
|
+
};
|
|
129
|
+
|
|
130
|
+
exports.Header = Header;
|
|
131
|
+
//# sourceMappingURL=Header.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Header.js","sources":["../../src/layout-header/Header.tsx"],"sourcesContent":["import { EditableLabel, IconButton } from \"@vuu-ui/vuu-ui-controls\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n cloneElement,\n HTMLAttributes,\n KeyboardEvent,\n MouseEvent,\n ReactElement,\n useRef,\n useState,\n} from \"react\";\nimport { Contribution, useViewDispatch } from \"../layout-view-actions\";\n\nimport headerCss from \"./Header.css\";\n\nexport interface HeaderProps extends HTMLAttributes<HTMLDivElement> {\n collapsed?: boolean;\n contributions?: Contribution[];\n expanded?: boolean;\n closeable?: boolean;\n onEditTitle: (value: string) => void;\n orientation?: \"horizontal\" | \"vertical\";\n tearOut?: boolean;\n}\n\nconst classBase = \"vuuHeader\";\n\nexport const Header = ({\n className: classNameProp,\n contributions,\n collapsed,\n closeable,\n onEditTitle,\n orientation: orientationProp = \"horizontal\",\n style,\n title = \"Untitled\",\n}: HeaderProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-header\",\n css: headerCss,\n window: targetWindow,\n });\n\n const labelFieldRef = useRef<HTMLDivElement>(null);\n const [value, setValue] = useState<string>(title);\n const [editing, setEditing] = useState<boolean>(false);\n\n const viewDispatch = useViewDispatch();\n const handleClose = (evt: MouseEvent) =>\n viewDispatch?.({ type: \"remove\" }, evt);\n\n const handleTitleMouseDown = () => {\n labelFieldRef.current?.focus();\n };\n\n const handleButtonMouseDown = (evt: MouseEvent) => {\n // do not allow drag to be initiated\n evt.stopPropagation();\n };\n\n const orientation = collapsed || orientationProp;\n\n const className = cx(classBase, classNameProp, `${classBase}-${orientation}`);\n\n const handleEnterEditMode = () => {\n setEditing(true);\n };\n\n const handleTitleKeyDown = (evt: KeyboardEvent<HTMLDivElement>) => {\n if (evt.key === \"Enter\") {\n setEditing(true);\n }\n };\n\n const handleExitEditMode = (\n originalValue = \"\",\n finalValue = \"\",\n allowDeactivation = true,\n editCancelled = false\n ) => {\n setEditing(false);\n if (editCancelled) {\n setValue(originalValue);\n } else if (finalValue !== originalValue) {\n setValue(finalValue);\n onEditTitle?.(finalValue);\n }\n if (allowDeactivation === false) {\n labelFieldRef.current?.focus();\n }\n };\n\n const handleMouseDown = (e: MouseEvent) => {\n viewDispatch?.({ type: \"mousedown\" }, e);\n };\n\n const toolbarItems: ReactElement[] = [];\n const postTitleContributedItems: ReactElement[] = [];\n const actionButtons: ReactElement[] = [];\n\n contributions?.forEach((contribution, i) => {\n switch (contribution.location) {\n case \"pre-title\":\n toolbarItems.push(cloneElement(contribution.content, { key: i }));\n break;\n default:\n postTitleContributedItems.push(\n cloneElement(contribution.content, { key: i })\n );\n }\n });\n\n title &&\n toolbarItems.push(\n <EditableLabel\n className={`${classBase}-title`}\n editing={editing}\n key=\"title\"\n value={value}\n onChange={setValue}\n onMouseDownCapture={handleTitleMouseDown}\n onEnterEditMode={handleEnterEditMode}\n onExitEditMode={handleExitEditMode}\n onKeyDown={handleTitleKeyDown}\n ref={labelFieldRef}\n tabIndex={0}\n />\n );\n\n closeable &&\n actionButtons.push(\n <IconButton\n icon=\"close\"\n key=\"close\"\n onClick={handleClose}\n onMouseDown={handleButtonMouseDown}\n variant=\"secondary\"\n />\n );\n\n postTitleContributedItems.length > 0 &&\n toolbarItems.push(\n <div className=\"vuuTooltrayProxy\" data-align=\"end\" key=\"contributions\">\n {postTitleContributedItems}\n </div>\n );\n\n actionButtons.length > 0 &&\n toolbarItems.push(\n <div className=\"vuuTooltrayProxy\" data-align=\"end\" key=\"actions\">\n {actionButtons}\n </div>\n );\n\n return (\n <div\n className={cx(\"vuuToolbarProxy\", className)}\n style={style}\n onMouseDown={handleMouseDown}\n >\n {toolbarItems}\n {/* \n {collapsed === false ? (\n <ActionButton\n aria-label=\"Minimize View\"\n actionId=\"minimize\"\n iconName=\"minimize\"\n onClick={handleAction}\n onMouseDown={handleButtonMouseDown}\n />\n ) : null}\n {collapsed ? (\n <ActionButton\n aria-label=\"Restore View\"\n actionId=\"restore\"\n iconName=\"double-chevron-right\"\n onClick={handleAction}\n onMouseDown={handleButtonMouseDown}\n />\n ) : null}\n {expanded === false ? (\n <ActionButton\n aria-label=\"Maximize View\"\n actionId=\"maximize\"\n iconName=\"maximize\"\n onClick={handleAction}\n onMouseDown={handleButtonMouseDown}\n />\n ) : null}\n {expanded ? (\n <ActionButton\n aria-label=\"Restore View\"\n actionId=\"restore\"\n iconName=\"restore\"\n onClick={handleAction}\n onMouseDown={handleButtonMouseDown}\n />\n ) : null}\n {tearOut ? (\n <ActionButton\n aria-label=\"Tear out View\"\n actionId=\"tearout\"\n iconName=\"tear-out\"\n onClick={handleAction}\n onMouseDown={handleButtonMouseDown}\n />\n ) : null}\n {closeable ? (\n <Button\n aria-label=\"close\"\n data-icon\n onClick={handleClose}\n onMouseDown={handleButtonMouseDown}\n />\n ) : null} */}\n </div>\n );\n};\n"],"names":["useWindow","useComponentCssInjection","headerCss","useRef","useState","useViewDispatch","cloneElement","jsx","EditableLabel","IconButton"],"mappings":"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"}
|
|
@@ -0,0 +1,178 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
require('@vuu-ui/vuu-utils');
|
|
6
|
+
var pathUtils = require('../utils/pathUtils.js');
|
|
7
|
+
var propUtils = require('../utils/propUtils.js');
|
|
8
|
+
var typeOf = require('../utils/typeOf.js');
|
|
9
|
+
var layoutReducer = require('../layout-reducer/layout-reducer.js');
|
|
10
|
+
var layoutTypes = require('../layout-reducer/layoutTypes.js');
|
|
11
|
+
var layoutUtils = require('../layout-reducer/layoutUtils.js');
|
|
12
|
+
var LayoutProviderContext = require('./LayoutProviderContext.js');
|
|
13
|
+
var useLayoutDragDrop = require('./useLayoutDragDrop.js');
|
|
14
|
+
|
|
15
|
+
const withDropTarget = (props) => props.dropTarget;
|
|
16
|
+
const shouldSave = (action) => [
|
|
17
|
+
"drag-drop",
|
|
18
|
+
"remove",
|
|
19
|
+
"set-title",
|
|
20
|
+
"splitter-resize",
|
|
21
|
+
"switch-tab"
|
|
22
|
+
].includes(action.type);
|
|
23
|
+
const getLayoutChangeReason = (action) => {
|
|
24
|
+
switch (action.type) {
|
|
25
|
+
case "switch-tab":
|
|
26
|
+
if (action.id === "main-tabs") {
|
|
27
|
+
return "switch-active-layout";
|
|
28
|
+
} else {
|
|
29
|
+
return "switch-active-tab";
|
|
30
|
+
}
|
|
31
|
+
case "save":
|
|
32
|
+
return "save-feature-props";
|
|
33
|
+
case "drag-drop":
|
|
34
|
+
return "drag-drop-operation";
|
|
35
|
+
case "remove":
|
|
36
|
+
return "remove-component";
|
|
37
|
+
case "splitter-resize":
|
|
38
|
+
return "resize-component";
|
|
39
|
+
case "set-title":
|
|
40
|
+
return "edit-feature-title";
|
|
41
|
+
default:
|
|
42
|
+
throw Error("unknown layout action");
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
const LayoutProviderVersion = () => {
|
|
46
|
+
const version = useLayoutProviderVersion();
|
|
47
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { children: `Context: ${version} ` });
|
|
48
|
+
};
|
|
49
|
+
const LayoutProvider = (props) => {
|
|
50
|
+
const { children, createNewChild, pathToDropTarget, layout, onLayoutChange } = props;
|
|
51
|
+
const state = React.useRef(void 0);
|
|
52
|
+
const childrenRef = React.useRef(children);
|
|
53
|
+
const [, forceRefresh] = React.useState(null);
|
|
54
|
+
const serializeState = React.useCallback(
|
|
55
|
+
(source, layoutChangeReason) => {
|
|
56
|
+
if (onLayoutChange) {
|
|
57
|
+
const targetContainer = pathUtils.findTarget(source, withDropTarget) || state.current;
|
|
58
|
+
const isDraggableLayout = typeOf.typeOf(targetContainer) === "DraggableLayout";
|
|
59
|
+
const target = isDraggableLayout ? propUtils.getProps(targetContainer).children[0] : targetContainer;
|
|
60
|
+
const serializedModel = layoutUtils.layoutToJSON(target);
|
|
61
|
+
onLayoutChange(serializedModel, layoutChangeReason);
|
|
62
|
+
}
|
|
63
|
+
},
|
|
64
|
+
[onLayoutChange]
|
|
65
|
+
);
|
|
66
|
+
const dispatchLayoutAction = React.useCallback(
|
|
67
|
+
(action, suppressSave = false) => {
|
|
68
|
+
const nextState = layoutReducer.layoutReducer(state.current, action);
|
|
69
|
+
if (nextState !== state.current) {
|
|
70
|
+
state.current = nextState;
|
|
71
|
+
forceRefresh({});
|
|
72
|
+
if (!suppressSave && shouldSave(action)) {
|
|
73
|
+
serializeState(nextState, getLayoutChangeReason(action));
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
},
|
|
77
|
+
[forceRefresh, serializeState]
|
|
78
|
+
);
|
|
79
|
+
const layoutActionDispatcher = React.useCallback(
|
|
80
|
+
(action) => {
|
|
81
|
+
switch (action.type) {
|
|
82
|
+
case "drag-start": {
|
|
83
|
+
prepareToDragLayout(action);
|
|
84
|
+
break;
|
|
85
|
+
}
|
|
86
|
+
case "save": {
|
|
87
|
+
serializeState(state.current, getLayoutChangeReason(action));
|
|
88
|
+
break;
|
|
89
|
+
}
|
|
90
|
+
case "query":
|
|
91
|
+
if (action.query === "PARENT_CONTAINER") {
|
|
92
|
+
return layoutUtils.layoutQuery(action.query, action.path, state.current);
|
|
93
|
+
}
|
|
94
|
+
break;
|
|
95
|
+
default: {
|
|
96
|
+
dispatchLayoutAction(action);
|
|
97
|
+
break;
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
},
|
|
101
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
102
|
+
[dispatchLayoutAction, serializeState]
|
|
103
|
+
);
|
|
104
|
+
const prepareToDragLayout = useLayoutDragDrop.useLayoutDragDrop(
|
|
105
|
+
state,
|
|
106
|
+
layoutActionDispatcher,
|
|
107
|
+
pathToDropTarget
|
|
108
|
+
);
|
|
109
|
+
React.useEffect(() => {
|
|
110
|
+
if (layout) {
|
|
111
|
+
const targetContainer = pathUtils.findTarget(
|
|
112
|
+
state.current,
|
|
113
|
+
withDropTarget
|
|
114
|
+
);
|
|
115
|
+
if (targetContainer) {
|
|
116
|
+
const target = propUtils.getChildProp(targetContainer);
|
|
117
|
+
const newLayout = layoutUtils.layoutFromJson(
|
|
118
|
+
layout,
|
|
119
|
+
`${targetContainer.props.path}.0`
|
|
120
|
+
);
|
|
121
|
+
const action = target ? {
|
|
122
|
+
type: layoutTypes.LayoutActionType.REPLACE,
|
|
123
|
+
target,
|
|
124
|
+
replacement: newLayout
|
|
125
|
+
} : {
|
|
126
|
+
type: layoutTypes.LayoutActionType.ADD,
|
|
127
|
+
path: targetContainer.props.path,
|
|
128
|
+
component: newLayout
|
|
129
|
+
};
|
|
130
|
+
dispatchLayoutAction(action, true);
|
|
131
|
+
} else if (layout.id === propUtils.getProp(state.current, "id")) {
|
|
132
|
+
const newLayout = layoutUtils.layoutFromJson(layout, "0");
|
|
133
|
+
const action = {
|
|
134
|
+
type: layoutTypes.LayoutActionType.REPLACE,
|
|
135
|
+
target: state.current,
|
|
136
|
+
replacement: newLayout
|
|
137
|
+
};
|
|
138
|
+
dispatchLayoutAction(action, true);
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
}, [dispatchLayoutAction, layout]);
|
|
142
|
+
if (state.current === void 0) {
|
|
143
|
+
state.current = layoutUtils.processLayoutElement(children);
|
|
144
|
+
} else if (children !== childrenRef.current) {
|
|
145
|
+
state.current = layoutUtils.processLayoutElement(children, state.current);
|
|
146
|
+
childrenRef.current = children;
|
|
147
|
+
}
|
|
148
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
149
|
+
LayoutProviderContext.LayoutProviderContext.Provider,
|
|
150
|
+
{
|
|
151
|
+
value: {
|
|
152
|
+
createNewChild,
|
|
153
|
+
dispatchLayoutProvider: layoutActionDispatcher,
|
|
154
|
+
version: 0
|
|
155
|
+
},
|
|
156
|
+
children: state.current
|
|
157
|
+
}
|
|
158
|
+
);
|
|
159
|
+
};
|
|
160
|
+
const useLayoutProviderDispatch = () => {
|
|
161
|
+
const { dispatchLayoutProvider } = React.useContext(LayoutProviderContext.LayoutProviderContext);
|
|
162
|
+
return dispatchLayoutProvider;
|
|
163
|
+
};
|
|
164
|
+
const useLayoutCreateNewChild = () => {
|
|
165
|
+
const { createNewChild } = React.useContext(LayoutProviderContext.LayoutProviderContext);
|
|
166
|
+
return createNewChild;
|
|
167
|
+
};
|
|
168
|
+
const useLayoutProviderVersion = () => {
|
|
169
|
+
const { version } = React.useContext(LayoutProviderContext.LayoutProviderContext);
|
|
170
|
+
return version;
|
|
171
|
+
};
|
|
172
|
+
|
|
173
|
+
exports.LayoutProvider = LayoutProvider;
|
|
174
|
+
exports.LayoutProviderVersion = LayoutProviderVersion;
|
|
175
|
+
exports.useLayoutCreateNewChild = useLayoutCreateNewChild;
|
|
176
|
+
exports.useLayoutProviderDispatch = useLayoutProviderDispatch;
|
|
177
|
+
exports.useLayoutProviderVersion = useLayoutProviderVersion;
|
|
178
|
+
//# sourceMappingURL=LayoutProvider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LayoutProvider.js","sources":["../../src/layout-provider/LayoutProvider.tsx"],"sourcesContent":["import {\n MutableRefObject,\n ReactElement,\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n LayoutActionType,\n LayoutChangeHandler,\n LayoutChangeReason,\n layoutFromJson,\n LayoutJSON,\n layoutQuery,\n layoutReducer,\n LayoutReducerAction,\n layoutToJSON,\n processLayoutElement,\n SaveAction,\n} from \"../layout-reducer\";\nimport { findTarget, getChildProp, getProp, getProps, typeOf } from \"../utils\";\nimport {\n LayoutProviderContext,\n LayoutProviderDispatch,\n} from \"./LayoutProviderContext\";\nimport { useLayoutDragDrop } from \"./useLayoutDragDrop\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst withDropTarget = (props: any) => props.dropTarget;\nconst shouldSave = (action: LayoutReducerAction) =>\n [\n \"drag-drop\",\n \"remove\",\n \"set-title\",\n \"splitter-resize\",\n \"switch-tab\",\n ].includes(action.type);\n\nconst getLayoutChangeReason = (\n action: LayoutReducerAction | SaveAction\n): LayoutChangeReason => {\n switch (action.type) {\n case \"switch-tab\":\n // TODO how can we make this more robust, shouldn't rely on 'main-tabs'\n if (action.id === \"main-tabs\") {\n return \"switch-active-layout\";\n } else {\n return \"switch-active-tab\";\n }\n case \"save\":\n return \"save-feature-props\";\n case \"drag-drop\":\n return \"drag-drop-operation\";\n case \"remove\":\n return \"remove-component\";\n case \"splitter-resize\":\n return \"resize-component\";\n case \"set-title\":\n return \"edit-feature-title\";\n default:\n throw Error(\"unknown layout action\");\n }\n};\n\nexport interface LayoutProviderProps {\n children: ReactElement;\n createNewChild?: (index?: number) => ReactElement;\n pathToDropTarget?: string;\n layout?: LayoutJSON;\n onLayoutChange?: LayoutChangeHandler;\n}\n\nexport const LayoutProviderVersion = () => {\n const version = useLayoutProviderVersion();\n return <div>{`Context: ${version} `}</div>;\n};\n\nexport const LayoutProvider = (props: LayoutProviderProps): ReactElement => {\n const { children, createNewChild, pathToDropTarget, layout, onLayoutChange } =\n props;\n const state = useRef<ReactElement | undefined>(undefined);\n const childrenRef = useRef<ReactElement>(children);\n\n const [, forceRefresh] = useState<unknown>(null);\n\n const serializeState = useCallback(\n (source, layoutChangeReason: LayoutChangeReason) => {\n if (onLayoutChange) {\n const targetContainer =\n findTarget(source, withDropTarget) || state.current;\n const isDraggableLayout = typeOf(targetContainer) === \"DraggableLayout\";\n const target = isDraggableLayout\n ? getProps(targetContainer).children[0]\n : targetContainer;\n const serializedModel = layoutToJSON(target);\n onLayoutChange(serializedModel, layoutChangeReason);\n }\n },\n [onLayoutChange]\n );\n\n const dispatchLayoutAction = useCallback(\n (action: LayoutReducerAction, suppressSave = false) => {\n const nextState = layoutReducer(state.current as ReactElement, action);\n if (nextState !== state.current) {\n state.current = nextState;\n forceRefresh({});\n if (!suppressSave && shouldSave(action)) {\n serializeState(nextState, getLayoutChangeReason(action));\n }\n }\n },\n [forceRefresh, serializeState]\n );\n\n const layoutActionDispatcher = useCallback<LayoutProviderDispatch>(\n (action) => {\n switch (action.type) {\n case \"drag-start\": {\n prepareToDragLayout(action);\n break;\n }\n case \"save\": {\n serializeState(state.current, getLayoutChangeReason(action));\n break;\n }\n case \"query\":\n if (action.query === \"PARENT_CONTAINER\") {\n return layoutQuery(action.query, action.path, state.current);\n }\n break;\n\n default: {\n dispatchLayoutAction(action);\n break;\n }\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [dispatchLayoutAction, serializeState]\n );\n\n const prepareToDragLayout = useLayoutDragDrop(\n state as MutableRefObject<ReactElement>,\n layoutActionDispatcher,\n pathToDropTarget\n );\n\n useEffect(() => {\n if (layout) {\n const targetContainer = findTarget(\n state.current as never,\n withDropTarget\n ) as ReactElement;\n if (targetContainer) {\n const target = getChildProp(targetContainer);\n const newLayout = layoutFromJson(\n layout,\n `${targetContainer.props.path}.0`\n );\n const action = target\n ? {\n type: LayoutActionType.REPLACE,\n target,\n replacement: newLayout,\n }\n : {\n type: LayoutActionType.ADD,\n path: targetContainer.props.path,\n component: newLayout,\n };\n dispatchLayoutAction(action, true);\n } else if (layout.id === getProp(state.current, \"id\")) {\n const newLayout = layoutFromJson(layout, \"0\");\n const action = {\n type: LayoutActionType.REPLACE,\n target: state.current,\n replacement: newLayout,\n };\n dispatchLayoutAction(action, true);\n }\n }\n }, [dispatchLayoutAction, layout]);\n\n if (state.current === undefined) {\n state.current = processLayoutElement(children);\n } else if (children !== childrenRef.current) {\n state.current = processLayoutElement(children, state.current);\n childrenRef.current = children;\n }\n\n return (\n <LayoutProviderContext.Provider\n value={{\n createNewChild,\n dispatchLayoutProvider: layoutActionDispatcher,\n version: 0,\n }}\n >\n {state.current}\n </LayoutProviderContext.Provider>\n );\n};\n\nexport const useLayoutProviderDispatch = () => {\n const { dispatchLayoutProvider } = useContext(LayoutProviderContext);\n return dispatchLayoutProvider;\n};\n\nexport const useLayoutCreateNewChild = () => {\n const { createNewChild } = useContext(LayoutProviderContext);\n return createNewChild;\n};\n\nexport const useLayoutProviderVersion = () => {\n const { version } = useContext(LayoutProviderContext);\n return version;\n};\n"],"names":["jsx","useRef","useState","useCallback","findTarget","typeOf","getProps","layoutToJSON","layoutReducer","layoutQuery","useLayoutDragDrop","useEffect","getChildProp","layoutFromJson","LayoutActionType","getProp","processLayoutElement","LayoutProviderContext","useContext"],"mappings":"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"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
|
|
5
|
+
const unconfiguredLayoutProviderDispatch = (action) => console.log(
|
|
6
|
+
`dispatch ${action.type}, have you forgotten to provide a LayoutProvider ?`
|
|
7
|
+
);
|
|
8
|
+
const LayoutProviderContext = React.createContext({
|
|
9
|
+
dispatchLayoutProvider: unconfiguredLayoutProviderDispatch,
|
|
10
|
+
version: -1
|
|
11
|
+
});
|
|
12
|
+
|
|
13
|
+
exports.LayoutProviderContext = LayoutProviderContext;
|
|
14
|
+
//# sourceMappingURL=LayoutProviderContext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LayoutProviderContext.js","sources":["../../src/layout-provider/LayoutProviderContext.ts"],"sourcesContent":["import { createContext, Dispatch, ReactElement } from \"react\";\nimport {\n DragStartAction,\n LayoutReducerAction,\n QueryAction,\n SaveAction,\n} from \"../layout-reducer\";\n\nconst unconfiguredLayoutProviderDispatch: LayoutProviderDispatch = (action) =>\n console.log(\n `dispatch ${action.type}, have you forgotten to provide a LayoutProvider ?`\n );\n\nexport type LayoutProviderDispatch = Dispatch<\n LayoutReducerAction | SaveAction | DragStartAction | QueryAction\n>;\n\nexport interface LayoutProviderContextProps {\n createNewChild?: (index?: number) => ReactElement;\n dispatchLayoutProvider: LayoutProviderDispatch;\n version: number;\n}\n\nexport const LayoutProviderContext = createContext<LayoutProviderContextProps>({\n dispatchLayoutProvider: unconfiguredLayoutProviderDispatch,\n version: -1,\n});\n"],"names":["createContext"],"mappings":";;;;AAQA,MAAM,kCAAA,GAA6D,CAAC,MAAA,KAClE,OAAQ,CAAA,GAAA;AAAA,EACN,CAAA,SAAA,EAAY,OAAO,IAAI,CAAA,kDAAA,CAAA;AACzB,CAAA,CAAA;AAYK,MAAM,wBAAwBA,mBAA0C,CAAA;AAAA,EAC7E,sBAAwB,EAAA,kCAAA;AAAA,EACxB,OAAS,EAAA,CAAA,CAAA;AACX,CAAC;;;;"}
|