@vuu-ui/vuu-shell 4.0.0-alpha.9 → 4.0.0-beta.1

package/src/shell-layout-templates/inlay-left-panel/useInlayLeftPanel.js

@@ -1,58 +1,68 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { GridLayout, GridLayoutItem } from "@vuu-ui/grid-layout";
-import { SidePanel } from "../side-panel/index.js";
-import { ApplicationSettingsContextPanel } from "../context-panel/index.js";
-const useInlayLeftPanel = ({ SidePanelProps, appHeader, htmlAttributes, workspaceHost })=>{
-    const { onChange: _onChange, ...gridAttributes } = htmlAttributes ?? {};
-    return /*#__PURE__*/ jsxs(GridLayout, {
-        ...gridAttributes,
-        className: `${htmlAttributes?.className ?? ""} vuuShell-staticGrid`,
-        colsAndRows: {
-            cols: [
-                `${SidePanelProps?.sizeOpen ?? 200}px`,
-                "1fr",
-                "0px"
-            ],
-            rows: [
-                "40px",
-                "1fr"
-            ]
-        },
-        id: "vuu-shell-grid",
-        children: [
-            /*#__PURE__*/ jsx(GridLayoutItem, {
-                id: "vuu-shell-header",
-                style: {
-                    gridArea: "1/1/2/3"
-                },
-                children: appHeader
-            }),
-            /*#__PURE__*/ jsx(GridLayoutItem, {
-                id: "vuu-shell-left-nav",
-                style: {
-                    gridArea: "2/1/3/2"
-                },
-                children: /*#__PURE__*/ jsx(SidePanel, {
-                    ...SidePanelProps,
-                    id: "vuu-side-panel"
+import { DockLayout, Drawer, Flexbox, LayoutContainer, View } from "@vuu-ui/vuu-layout";
+import { VuuShellLocation } from "@vuu-ui/vuu-utils";
+import { useCallback, useMemo, useRef, useState } from "react";
+const useInlayLeftPanel = ({ SidePanelProps: LeftSidePanelProps, appHeader, htmlAttributes })=>{
+    const paletteView = useRef(null);
+    const [open, setOpen] = useState(true);
+    const handleDrawerClick = useCallback((e)=>{
+        const target = e.target;
+        if (!paletteView.current?.contains(target)) setOpen(!open);
+    }, [
+        open
+    ]);
+    return useMemo(()=>{
+        const getDrawers = (leftSidePanel)=>{
+            const drawers = [];
+            drawers.push(/*#__PURE__*/ jsx(Drawer, {
+                onClick: handleDrawerClick,
+                open: open,
+                position: "left",
+                inline: true,
+                peekaboo: true,
+                sizeOpen: 200,
+                toggleButton: "end",
+                children: /*#__PURE__*/ jsx(View, {
+                    className: "vuuShell-palette",
+                    id: "vw-app-palette",
+                    ref: paletteView,
+                    style: {
+                        height: "100%"
+                    },
+                    children: leftSidePanel
+                }, "app-palette")
+            }, "left-panel"));
+            return drawers;
+        };
+        return /*#__PURE__*/ jsxs(Flexbox, {
+            ...htmlAttributes,
+            style: {
+                ...htmlAttributes?.style,
+                flexDirection: "column"
+            },
+            children: [
+                appHeader,
+                /*#__PURE__*/ jsx(DockLayout, {
+                    style: {
+                        flex: 1
+                    },
+                    children: getDrawers(LeftSidePanelProps?.children).concat(/*#__PURE__*/ jsx(LayoutContainer, {
+                        dropTarget: true,
+                        id: VuuShellLocation.WorkspaceContainer,
+                        style: {
+                            width: "100%",
+                            height: "100%"
+                        }
+                    }, "main-content"))
                 })
-            }),
-            /*#__PURE__*/ jsx(GridLayoutItem, {
-                className: "vuuShell-content",
-                id: "vuu-shell-workspace-host",
-                style: {
-                    gridArea: "2/2/3/3"
-                },
-                children: workspaceHost
-            }),
-            /*#__PURE__*/ jsx(GridLayoutItem, {
-                id: "vuu-shell-context",
-                style: {
-                    gridArea: "1/3/3/4"
-                },
-                children: /*#__PURE__*/ jsx(ApplicationSettingsContextPanel, {})
-            })
-        ]
-    });
+            ]
+        });
+    }, [
+        LeftSidePanelProps,
+        appHeader,
+        handleDrawerClick,
+        htmlAttributes,
+        open
+    ]);
 };
 export { useInlayLeftPanel };

package/src/shell-layout-templates/left-main-tabs/useLeftMainTabs.js

@@ -1,53 +1,32 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { GridLayout, GridLayoutItem } from "@vuu-ui/grid-layout";
-import { ApplicationSettingsContextPanel } from "../context-panel/index.js";
-const useLeftMainTabs = ({ appHeader, htmlAttributes, ToolbarProps, workspaceHost })=>{
-    const { onChange: _onChange, ...gridAttributes } = htmlAttributes ?? {};
-    return /*#__PURE__*/ jsxs(GridLayout, {
-        ...gridAttributes,
-        className: `${htmlAttributes?.className ?? ""} vuuShell-staticGrid`,
-        colsAndRows: {
-            cols: [
-                `${ToolbarProps?.width ?? 48}px`,
-                "1fr",
-                "0px"
-            ],
-            rows: [
-                "40px",
-                "1fr"
+import { Flexbox, StackLayout } from "@vuu-ui/vuu-layout";
+import { VuuShellLocation } from "@vuu-ui/vuu-utils";
+import { useMemo } from "react";
+const useLeftMainTabs = ({ appHeader, htmlAttributes, ToolbarProps })=>{
+    if (void 0 === ToolbarProps) throw Error("LeftMainTabs layout requires ToolbarProps");
+    return useMemo(()=>/*#__PURE__*/ jsxs(Flexbox, {
+            ...htmlAttributes,
+            style: {
+                ...htmlAttributes?.style,
+                flexDirection: "column"
+            },
+            children: [
+                appHeader,
+                /*#__PURE__*/ jsx(StackLayout, {
+                    TabstripProps: {
+                        className: `${VuuShellLocation.MultiWorkspaceContainer}-tabs`
+                    },
+                    active: 0,
+                    showTabs: "left",
+                    style: {
+                        flex: 1
+                    },
+                    id: VuuShellLocation.MultiWorkspaceContainer
+                })
             ]
-        },
-        id: "vuu-shell-grid",
-        children: [
-            /*#__PURE__*/ jsx(GridLayoutItem, {
-                id: "vuu-shell-header",
-                style: {
-                    gridArea: "1/1/2/3"
-                },
-                children: appHeader
-            }),
-            /*#__PURE__*/ jsx(GridLayoutItem, {
-                id: "vuu-shell-toolbar",
-                style: {
-                    gridArea: "2/1/3/2"
-                },
-                children: ToolbarProps?.children
-            }),
-            /*#__PURE__*/ jsx(GridLayoutItem, {
-                id: "vuu-shell-workspace-host",
-                style: {
-                    gridArea: "2/2/3/3"
-                },
-                children: workspaceHost
-            }),
-            /*#__PURE__*/ jsx(GridLayoutItem, {
-                id: "vuu-shell-context",
-                style: {
-                    gridArea: "1/3/3/4"
-                },
-                children: /*#__PURE__*/ jsx(ApplicationSettingsContextPanel, {})
-            })
-        ]
-    });
+        }), [
+        appHeader,
+        htmlAttributes
+    ]);
 };
 export { useLeftMainTabs };

package/src/shell-layout-templates/side-panel/SidePanel.css.js

@@ -1,8 +1,6 @@
 const css = `
 .vuuShellSidePanel {
-  height: 100%;
-  min-width: var(--shell-left-nav-size);
-  width: auto;
+  width: var(--shell-left-nav-size);
   transition: width .2s ease-out;
 }
 

package/src/shell-layout-templates/simple-content-pane/useSimpleContentPane.js

@@ -1,46 +1,38 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { GridLayout, GridLayoutItem } from "@vuu-ui/grid-layout";
-import { ApplicationSettingsContextPanel } from "../context-panel/index.js";
-const useSimpleContentPane = ({ appHeader, htmlAttributes, workspaceHost })=>{
-    const { onChange: _onChange, ...gridAttributes } = htmlAttributes ?? {};
-    return /*#__PURE__*/ jsxs(GridLayout, {
-        ...gridAttributes,
-        className: `${htmlAttributes?.className ?? ""} vuuShell-staticGrid`,
-        colsAndRows: {
-            cols: [
-                "1fr",
-                "0px"
-            ],
-            rows: [
-                "40px",
-                "1fr"
+import { Flexbox, LayoutContainer } from "@vuu-ui/vuu-layout";
+import { VuuShellLocation } from "@vuu-ui/vuu-utils";
+import { ContextPanel } from "../context-panel/index.js";
+import { useMemo } from "react";
+const useSimpleContentPane = ({ appHeader, htmlAttributes })=>useMemo(()=>/*#__PURE__*/ jsxs(Flexbox, {
+            ...htmlAttributes,
+            style: {
+                ...htmlAttributes?.style,
+                flexDirection: "row"
+            },
+            children: [
+                /*#__PURE__*/ jsxs(Flexbox, {
+                    className: "vuuShell-content",
+                    style: {
+                        flex: 1,
+                        flexDirection: "column"
+                    },
+                    children: [
+                        appHeader,
+                        /*#__PURE__*/ jsx(LayoutContainer, {
+                            id: VuuShellLocation.WorkspaceContainer,
+                            style: {
+                                flex: 1
+                            }
+                        }, "main-content")
+                    ]
+                }),
+                /*#__PURE__*/ jsx(ContextPanel, {
+                    id: VuuShellLocation.ContextPanel,
+                    overlay: true
+                })
             ]
-        },
-        id: "vuu-shell-grid",
-        children: [
-            /*#__PURE__*/ jsx(GridLayoutItem, {
-                id: "vuu-shell-header",
-                style: {
-                    gridArea: "1/1/2/2"
-                },
-                children: appHeader
-            }),
-            /*#__PURE__*/ jsx(GridLayoutItem, {
-                className: "vuuShell-content",
-                id: "vuu-shell-workspace-host",
-                style: {
-                    gridArea: "2/1/3/2"
-                },
-                children: workspaceHost
-            }),
-            /*#__PURE__*/ jsx(GridLayoutItem, {
-                id: "vuu-shell-context",
-                style: {
-                    gridArea: "1/2/3/3"
-                },
-                children: /*#__PURE__*/ jsx(ApplicationSettingsContextPanel, {})
-            })
-        ]
-    });
-};
+        }), [
+        appHeader,
+        htmlAttributes
+    ]);
 export { useSimpleContentPane };

package/src/shell.css.js

@@ -1,9 +1,8 @@
 const css = `
-.vuuShell.vuuGridLayout {
+.vuuShell {
   background-color: var(--vuuShell-background, var(--salt-container-primary-background));
   height: var(--vuuShell-height, 100vh);
   width: var(--vuuShell-width, 100vw);
-  padding: 0;
 
   & .left-main-tabs {
     --vuuOverflowContainer-width: 48px;
@@ -20,7 +19,7 @@ const css = `
 }
 
 .vuuShell-warningPlaceholder {
-  background-color: var(--salt-container-background-high);
+  background-color: var(--salt-container-tertiary-background);
   height: 100%;
 }
 
@@ -52,89 +51,7 @@ const css = `
 }
 
 .vuuShell-content {
-  padding: var(--vuuShell-content-padding, 8px 0 0 0);
-  margin: 0 8px 8px 0;
-}
-
-.vuuShell-staticGrid, .vuuWorkspaceHost, .vuuWorkspaceHost-content, .vuuWorkspaceHost-workspace {
-  width: 100%;
-  min-width: 0;
-  height: 100%;
-  min-height: 0;
-}
-
-.vuuShell-staticGrid {
-  --vuu-grid-gap: 0px;
-  overflow: hidden;
-}
-
-.vuuShell-staticGrid > .vuuGridLayoutItem {
-  border: 0;
-  min-width: 0;
-  min-height: 0;
-}
-
-.vuuShell-staticGrid > #vuu-shell-workspace-host {
-  overflow: hidden;
-}
-
-.vuuLeftNav > .vuuGridLayout {
-  --vuu-grid-gap: 0px;
-  width: max-content;
-  height: 100%;
-}
-
-.vuuLeftNav > .vuuGridLayout > .vuuGridLayoutItem {
-  border: 0;
-  min-width: 0;
-  min-height: 0;
-}
-
-.vuuWorkspaceHost {
-  flex-direction: column;
-  display: flex;
-}
-
-.vuuWorkspaceHost-content {
-  flex: auto;
-  min-height: 0;
-}
-
-.vuuWorkspaceHost-workspace[hidden] {
-  display: none;
-}
-
-.vuuWorkspaceHost-workspace {
-  position: relative;
-}
-
-.vuuWorkspaceHost-workspace > .vuuGridLayout {
-  width: 100%;
-  min-width: 0;
-  height: 100%;
-  min-height: 0;
-}
-
-.vuuWorkspaceHost-state {
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-  display: flex;
-}
-
-.vuuWorkspaceHost-empty {
-  width: 100%;
-  min-width: 0;
-  height: 100%;
-  min-height: 0;
-  position: relative;
-}
-
-.vuuWorkspaceHost-emptyGrid {
-  width: 100%;
-  min-width: 0;
-  height: 100%;
-  min-height: 0;
+  padding: var(--vuuShell-content-padding, 8px);
 }
 
 

package/src/shell.js

@@ -1,186 +1,108 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { GridLayout, GridLayoutItem, GridLayoutProvider } from "@vuu-ui/grid-layout";
 import { useComponentCssInjection } from "@salt-ds/styles";
 import { useWindow } from "@salt-ds/window";
-import { useAuthenticatedUser } from "@vuu-ui/core";
 import { ContextMenuProvider } from "@vuu-ui/vuu-context-menu";
-import { useLostConnection } from "@vuu-ui/vuu-data-react";
+import { LayoutProvider, StackLayout } from "@vuu-ui/vuu-layout";
 import { NotificationsProvider } from "@vuu-ui/vuu-notifications";
-import { ContextPanelProvider, ModalProvider } from "@vuu-ui/vuu-ui-controls";
-import { VuuShellLocation } from "@vuu-ui/vuu-utils";
-import clsx from "clsx";
-import { createContext, isValidElement, useCallback, useContext, useMemo, useRef, useState } from "react";
+import { ModalProvider } from "@vuu-ui/vuu-ui-controls";
+import { logger, registerComponent } from "@vuu-ui/vuu-utils";
+import { useCallback, useMemo } from "react";
 import { AppHeader } from "./app-header/index.js";
 import { ApplicationProvider } from "./application-provider/index.js";
-import { LeftNav } from "./left-nav/index.js";
-import { ContextPanel, SidePanel } from "./shell-layout-templates/index.js";
-import { WorkspaceHost, WorkspaceProvider, createWorkspaceComponentRegistries, shellWorkspaceComponentRegistrations, useWorkspace, useWorkspaceContextMenuItems } from "./workspace-management/index.js";
+import { LocalPersistenceManager, PersistenceProvider, usePersistenceManager } from "./persistence-manager/index.js";
+import { useShellLayout } from "./shell-layout-templates/index.js";
+import { UserSettingsPanel } from "./user-settings/index.js";
+import { WorkspaceProvider, useWorkspace, useWorkspaceContextMenuItems } from "./workspace-management/index.js";
+import { loadingJSON } from "./workspace-management/defaultWorkspaceJSON.js";
+import { useLostConnection } from "@vuu-ui/vuu-data-react";
 import shell from "./shell.css";
+registerComponent("ApplicationSettings", UserSettingsPanel, "view");
+if ("production" === process.env.NODE_ENV) {
+    if ("function" != typeof StackLayout) console.warn("StackLayout module not loaded, will be unable to deserialize from layout JSON");
+}
+const { error: error } = logger("Shell");
 const defaultAppHeader = /*#__PURE__*/ jsx(AppHeader, {});
-const defaultRegistries = createWorkspaceComponentRegistries(shellWorkspaceComponentRegistrations);
-const ShellContextPanelStateContext = /*#__PURE__*/ createContext(void 0);
-const StaticContextPanel = ()=>{
-    const contextPanel = useContext(ShellContextPanelStateContext);
-    return /*#__PURE__*/ jsx(ContextPanel, {
-        content: contextPanel?.content,
-        expanded: void 0 !== contextPanel,
-        id: VuuShellLocation.ContextPanel,
-        overlay: true,
-        title: contextPanel?.title
-    });
+const getAppHeader = (shellLayoutProps)=>shellLayoutProps?.appHeader ?? defaultAppHeader;
+const defaultHTMLAttributes = {
+    className: "vuuShell"
 };
-const StaticShellLayout = ({ appHeader = defaultAppHeader, className, leftNavWidth: initialLeftNavWidth = 200, style, workspaceHost = /*#__PURE__*/ jsx(WorkspaceHost, {}), ...htmlAttributes })=>{
-    const { setApplicationSetting } = useWorkspace();
-    const [leftNavWidth, setLeftNavWidth] = useState(initialLeftNavWidth);
-    const [contextPanel, setContextPanel] = useState();
-    const contextPanelTrigger = useRef(null);
-    const handleLeftNavWidthChange = useCallback((width)=>{
-        setLeftNavWidth(width);
-    }, []);
-    const showContextPanel = useCallback((content, title)=>{
-        if (!/*#__PURE__*/ isValidElement(content)) throw new Error(`Context panel component "${content}" must be provided as a React element`);
-        contextPanelTrigger.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;
-        setContextPanel({
-            content,
-            title
-        });
-    }, []);
-    const hideContextPanel = useCallback(()=>{
-        setContextPanel(void 0);
-        setApplicationSetting("applicationSettings.panelOpen", false).catch(()=>void 0);
-        requestAnimationFrame(()=>contextPanelTrigger.current?.focus());
-    }, [
-        setApplicationSetting
-    ]);
-    return /*#__PURE__*/ jsx(ContextPanelProvider, {
-        hideContextPanel: hideContextPanel,
-        showContextPanel: showContextPanel,
-        children: /*#__PURE__*/ jsx(ShellContextPanelStateContext.Provider, {
-            value: contextPanel,
-            children: /*#__PURE__*/ jsxs(GridLayout, {
-                ...htmlAttributes,
-                className: clsx("vuuShell", "vuuShell-staticGrid", className),
-                colsAndRows: {
-                    cols: [
-                        `${initialLeftNavWidth}px`,
-                        "1fr",
-                        "0px"
-                    ],
-                    rows: [
-                        "48px",
-                        "1fr"
-                    ]
-                },
-                "full-page": true,
-                id: "vuu-shell-grid",
-                style: {
-                    ...style,
-                    gridTemplateColumns: `${leftNavWidth}px minmax(0, 1fr) 0px`
-                },
-                children: [
-                    /*#__PURE__*/ jsx(GridLayoutItem, {
-                        id: "vuu-shell-left-nav",
-                        style: {
-                            gridArea: "1/1/3/2"
-                        },
-                        children: /*#__PURE__*/ jsx(SidePanel, {
-                            id: "vuu-side-panel",
-                            sizeOpen: initialLeftNavWidth,
-                            children: /*#__PURE__*/ jsx(LeftNav, {
-                                onWidthChange: handleLeftNavWidthChange,
-                                sizeExpanded: initialLeftNavWidth
-                            })
-                        })
-                    }),
-                    /*#__PURE__*/ jsx(GridLayoutItem, {
-                        id: "vuu-shell-header",
-                        style: {
-                            gridArea: "1/2/2/3"
-                        },
-                        children: appHeader
-                    }),
-                    /*#__PURE__*/ jsx(GridLayoutItem, {
-                        className: "vuuShell-content",
-                        id: "vuu-shell-workspace-host",
-                        style: {
-                            gridArea: "2/2/3/3"
-                        },
-                        children: workspaceHost
-                    }),
-                    /*#__PURE__*/ jsx(GridLayoutItem, {
-                        id: "vuu-shell-context-panel-host",
-                        style: {
-                            gridArea: "1/3/3/4",
-                            overflow: "visible",
-                            position: "relative"
-                        },
-                        children: /*#__PURE__*/ jsx(StaticContextPanel, {})
-                    })
-                ]
-            })
-        })
-    });
+const getHTMLAttributes = (props)=>{
+    if (props?.htmlAttributes) return {
+        ...defaultHTMLAttributes,
+        ...props.htmlAttributes
+    };
+    return defaultHTMLAttributes;
 };
-const VuuApplication = ({ appHeader, children, htmlAttributes, leftNavWidth })=>{
+const VuuApplication = ({ shellLayoutProps: ShellLayoutProps, children })=>{
     const targetWindow = useWindow();
     useComponentCssInjection({
         testId: "vuu-shell",
         css: shell,
         window: targetWindow
     });
+    const { workspaceJSON, saveApplicationLayout } = useWorkspace();
     const { buildMenuOptions, handleMenuAction } = useWorkspaceContextMenuItems();
+    const handleLayoutChange = useCallback((layout)=>{
+        try {
+            saveApplicationLayout(layout);
+        } catch  {
+            error?.("Failed to save layout");
+        }
+    }, [
+        saveApplicationLayout
+    ]);
+    const isLayoutLoading = workspaceJSON === loadingJSON;
+    const initialLayout = useShellLayout({
+        ...ShellLayoutProps,
+        appHeader: getAppHeader(ShellLayoutProps),
+        htmlAttributes: getHTMLAttributes(ShellLayoutProps)
+    });
     useLostConnection();
-    return /*#__PURE__*/ jsxs(ContextMenuProvider, {
+    return isLayoutLoading ? null : /*#__PURE__*/ jsxs(ContextMenuProvider, {
         menuActionHandler: handleMenuAction,
         menuBuilder: buildMenuOptions,
         children: [
-            /*#__PURE__*/ jsx(GridLayoutProvider, {
-                children: /*#__PURE__*/ jsx(StaticShellLayout, {
-                    ...htmlAttributes,
-                    appHeader: appHeader,
-                    leftNavWidth: leftNavWidth
-                })
+            /*#__PURE__*/ jsx(LayoutProvider, {
+                workspaceJSON: workspaceJSON,
+                onLayoutChange: handleLayoutChange,
+                children: initialLayout
             }),
             children
         ]
     });
 };
-const Shell = ({ appHeader, children, leftNavWidth, logout, saveUrl: _saveUrl, serverUrl: _serverUrl, shellLayoutProps, workspaceProps, ...htmlAttributes })=>{
-    const user = useAuthenticatedUser();
-    const resolvedWorkspaceProps = useMemo(()=>({
-            ...workspaceProps,
-            componentRenderers: workspaceProps?.componentRenderers ?? defaultRegistries.renderers,
-            settingsCodecs: workspaceProps?.settingsCodecs ?? defaultRegistries.settingsCodecs
-        }), [
-        workspaceProps
+const Shell = ({ logout, user, userSettingsSchema, workspaceProps, ...props })=>{
+    const persistenceManager = usePersistenceManager();
+    const localPersistenceManager = useMemo(()=>{
+        if (persistenceManager) return;
+        console.log(`No Persistence Manager, configuration data will be persisted to Local Storage, key: 'vuu/${user.username}'`);
+        return new LocalPersistenceManager(`vuu/${user.username}`);
+    }, [
+        persistenceManager,
+        user.username
     ]);
-    const resolvedHtmlAttributes = {
-        ...htmlAttributes,
-        ...shellLayoutProps?.htmlAttributes,
-        className: clsx(htmlAttributes.className, shellLayoutProps?.htmlAttributes?.className),
-        style: {
-            ...htmlAttributes.style,
-            ...shellLayoutProps?.htmlAttributes?.style
-        }
-    };
-    return /*#__PURE__*/ jsx(ApplicationProvider, {
+    const shellProviders = /*#__PURE__*/ jsx(ApplicationProvider, {
         density: "high",
         logout: logout,
         theme: "vuu-theme",
-        children: /*#__PURE__*/ jsx(ModalProvider, {
-            children: /*#__PURE__*/ jsx(NotificationsProvider, {
-                children: /*#__PURE__*/ jsx(WorkspaceProvider, {
-                    ...resolvedWorkspaceProps,
-                    userId: user.userName,
+        user: user,
+        userSettingsSchema: userSettingsSchema,
+        children: /*#__PURE__*/ jsx(WorkspaceProvider, {
+            ...workspaceProps,
+            children: /*#__PURE__*/ jsx(ModalProvider, {
+                children: /*#__PURE__*/ jsx(NotificationsProvider, {
                     children: /*#__PURE__*/ jsx(VuuApplication, {
-                        appHeader: appHeader ?? shellLayoutProps?.appHeader,
-                        htmlAttributes: resolvedHtmlAttributes,
-                        leftNavWidth: leftNavWidth ?? shellLayoutProps?.SidePanelProps?.sizeOpen,
-                        children: children
+                        ...props,
+                        user: user
                     })
                 })
             })
         })
     });
+    if (persistenceManager) return shellProviders;
+    return /*#__PURE__*/ jsx(PersistenceProvider, {
+        persistenceManager: localPersistenceManager,
+        children: shellProviders
+    });
 };
-export { Shell, StaticShellLayout };
+export { Shell };