@fluxo-dev/shell 0.0.37 → 0.0.39

package/index.esm.css

@@ -184,7 +184,7 @@
   text-transform: uppercase;
 }
 
-.custom-node-module_root__OB7SZ {
+.CustomNode-module_root__MTD8I {
   align-items: center;
   display: grid;
   grid-template-columns: auto auto 1fr auto;
@@ -194,11 +194,11 @@
   /*border-bottom: solid 1px #eee;*/
 }
 
-.custom-node-module_root__OB7SZ:hover {
+.CustomNode-module_root__MTD8I:hover {
   background: #e9ecef54;
 }
 
-.custom-node-module_expandIconWrapper__fKf-r {
+.CustomNode-module_expandIconWrapper__XgO8w {
   align-items: center;
   font-size: 0;
   cursor: pointer;
@@ -211,11 +211,11 @@
   margin-left: 8px;
 }
 
-.custom-node-module_expandIconWrapper__fKf-r.custom-node-module_isOpen__vePGR {
+.CustomNode-module_expandIconWrapper__XgO8w.CustomNode-module_isOpen__jPvPC {
   transform: rotate(90deg);
 }
 
-.custom-node-module_labelGridItem__7eEnD {
+.CustomNode-module_labelGridItem__k-wO- {
   padding-inline-start: 8px;
 }
 

package/index.esm.js

@@ -1,17 +1,17 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
-import React__default, { useState, Suspense, forwardRef, createElement as createElement$2, useEffect, useCallback, useMemo, createContext, useRef, useLayoutEffect, useReducer, useContext, useImperativeHandle, Fragment as Fragment$1, cloneElement, memo, isValidElement, lazy } from 'react';
+import React__default, { useState, Suspense, useCallback, forwardRef, createElement as createElement$2, useEffect, useMemo, createContext, useRef, useLayoutEffect, useReducer, useContext, useImperativeHandle, Fragment as Fragment$1, cloneElement, memo, isValidElement, lazy } from 'react';
 import { useSelector, Provider } from 'react-redux';
 import { useLocation, Navigate, Outlet, useNavigate, Link, useOutlet, Route, useSearchParams, createBrowserRouter, RouterProvider } from 'react-router-dom';
-import { DataCard, useFlxNavigate, NoData, ConfirmModal, CronGenerator, ShellPage, ErrorPage as ErrorPage$1, WaitData, FlxRoutes } from '@fluxo-dev/ui-components';
+import { useFlxNavigate, DataCard, NoData, ConfirmModal, CronGenerator, ShellPage, ErrorPage as ErrorPage$1, WaitData, FlxRoutes } from '@fluxo-dev/ui-components';
 import { ModuleLoader } from '@fluxo-dev/shell-mfe';
 import { Text, TextInput, ActionIcon, useMantineTheme, AppShell, Stack, Group, Burger, Badge, Drawer, NavLink, Popover, Avatar, Center, Divider, Button, Tabs, Anchor, Tooltip, Space, useMantineColorScheme, UnstyledButton, Box, ThemeIcon, Collapse, ScrollArea, rem, Loader, Grid, PasswordInput, ColorSwatch, FileButton, NumberInput, Alert, ColorInput, Checkbox, Modal, Switch, Select, Chip, LoadingOverlay, Image as Image$1, Menu as Menu$1, Table, MultiSelect, Portal, useDirection, Paper, px as px$1, parseThemeColor, rgba as rgba$1, FocusTrap, Breadcrumbs, TagsInput, Card, MantineProvider } from '@mantine/core';
+import { MinimalStateViewer, RavifyProvider, JobsViewer } from '@fluxo-dev/shell-ravify';
+import { useAppSelector, store as store$4 } from '@fluxo-dev/state';
+import { useHotkeys, useOs, useIdle, useWindowEvent, useResizeObserver, useMediaQuery, useTimeout } from '@mantine/hooks';
 import { openSpotlight, Spotlight } from '@mantine/spotlight';
-import { useOs, useHotkeys, useIdle, useWindowEvent, useResizeObserver, useMediaQuery, useTimeout } from '@mantine/hooks';
 import { AppType, AppState, FluxoStateDispatcher, FluxoClientSys, UserService, AppMenuContextType, ApiKeyService, DomainRoleService, EmailServerProviderType, RavifyInstanceProtocol, RavifyInstanceVersion } from '@fluxo-dev/api-client-base';
 import { showNotification, Notifications } from '@mantine/notifications';
-import { useAppSelector, store as store$4 } from '@fluxo-dev/state';
-import { MinimalStateViewer, RavifyProvider, JobsViewer } from '@fluxo-dev/shell-ravify';
 import { unstable_batchedUpdates, flushSync as flushSync$1, createPortal } from 'react-dom';
 import { useForm } from '@mantine/form';
 import { RestApiDocumentation } from '@fluxo-dev/shell-korebi';
@@ -3358,6 +3358,231 @@ function BlankLayout() {
   return jsx(Outlet, {});
 }
 
+// Unique ID creation requires a high quality random # generator. In the browser we therefore
+// require the crypto API and do not support built-in fallback to lower quality random number
+// generators (like Math.random()).
+let getRandomValues;
+const rnds8 = new Uint8Array(16);
+function rng() {
+  // lazy load so that environments that need to polyfill have a chance to do so
+  if (!getRandomValues) {
+    // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation.
+    getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto);
+
+    if (!getRandomValues) {
+      throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
+    }
+  }
+
+  return getRandomValues(rnds8);
+}
+
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
+ */
+
+const byteToHex = [];
+
+for (let i = 0; i < 256; ++i) {
+  byteToHex.push((i + 0x100).toString(16).slice(1));
+}
+
+function unsafeStringify(arr, offset = 0) {
+  // Note: Be careful editing this code!  It's been tuned for performance
+  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
+  return (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();
+}
+
+const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
+var native = {
+  randomUUID
+};
+
+function v4(options, buf, offset) {
+  if (native.randomUUID && !buf && !options) {
+    return native.randomUUID();
+  }
+
+  options = options || {};
+  const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+
+  rnds[6] = rnds[6] & 0x0f | 0x40;
+  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
+
+  return unsafeStringify(rnds);
+}
+
+class ShellSessionCollection {
+  constructor(sessions = [], currentSessionId) {
+    this._sessions = sessions;
+    this._currentSessionId = currentSessionId;
+  }
+  get currentSession() {
+    return this._currentSessionId ? this.getSession(this._currentSessionId) : null;
+  }
+  addSession(title, element, url) {
+    const session = new ShellSession(title, element, url);
+    this._sessions.push(session);
+    return session;
+  }
+  removeSession(id) {
+    this._sessions = this._sessions.filter(s => s.id !== id);
+  }
+  getSession(id) {
+    return this._sessions.find(s => s.id === id);
+  }
+  get sessions() {
+    return this._sessions;
+  }
+  getCurrentSessionId() {
+    return this._currentSessionId;
+  }
+  getCurrentSession() {
+    return this.getSession(this._currentSessionId);
+  }
+  setCurrentSession(id) {
+    this._currentSessionId = id;
+  }
+  updateSession(id, title, element, url) {
+    const session = this.getSession(id);
+    if (session) {
+      session.updateSession(title, element, url);
+    }
+  }
+  getPreviuosSessionId() {
+    const index = this._sessions.findIndex(s => s.id === this._currentSessionId);
+    if (index > 0) {
+      return this._sessions[index - 1].id;
+    }
+    return this._sessions[this._sessions.length - 1].id;
+  }
+  getNextSessionId() {
+    const index = this._sessions.findIndex(s => s.id === this._currentSessionId);
+    if (index < this._sessions.length - 1) {
+      return this._sessions[index + 1].id;
+    }
+    return this._sessions[0].id;
+  }
+}
+class ShellSession {
+  constructor(title, element, url) {
+    this._id = v4();
+    this._title = title;
+    this._element = element;
+    this._url = url;
+  }
+  get id() {
+    return this._id;
+  }
+  get title() {
+    return this._title;
+  }
+  get element() {
+    return this._element;
+  }
+  get url() {
+    return this._url;
+  }
+  updateSession(title, element, url) {
+    this._title = title;
+    this._element = element;
+    this._url = url;
+  }
+}
+
+const defaultState = {
+  addSession: () => '',
+  removeSession: () => {},
+  getSession: () => {},
+  sessions: () => [],
+  updateSession: () => {},
+  getCurrentSessionId: () => null,
+  getCurrentSession: () => null,
+  setCurrentSession: () => {},
+  isCurrentSessionDisableable: () => false
+};
+const ShellSessionContext = /*#__PURE__*/React__default.createContext(defaultState);
+function ShellSessionProvider(props) {
+  useHotkeys([['shift+s', () => {
+    addSession(`Dashboard`, null, '/');
+  }]]);
+  useHotkeys([['shift+x', () => {
+    removeSession(getCurrentSessionId());
+  }]], [], true);
+  useHotkeys([['shift+ArrowLeft', () => {
+    setCurrentSession(sessionCollection.getPreviuosSessionId());
+  }]], [], true);
+  useHotkeys([['shift+ArrowRight', () => {
+    setCurrentSession(sessionCollection.getNextSessionId());
+  }]], [], true);
+  const [sessionCollection, setSessionCollection] = React__default.useState(new ShellSessionCollection([], null));
+  const navigate = useFlxNavigate();
+  const addSession = useCallback((title, element, url) => {
+    const cloned = new ShellSessionCollection(sessionCollection.sessions, sessionCollection.getCurrentSessionId());
+    const s = cloned.addSession(title, element, url);
+    cloned.setCurrentSession(s.id);
+    setSessionCollection(cloned);
+    navigate(s.url, {
+      state: {
+        title: title
+      }
+    });
+    return s.id;
+  }, [sessionCollection]);
+  const removeSession = useCallback(id => {
+    if (!isCurrentSessionDisableable()) return;
+    const cloned = new ShellSessionCollection(sessionCollection.sessions, sessionCollection.getCurrentSessionId());
+    cloned.removeSession(id);
+    cloned.setCurrentSession(cloned.sessions[cloned.sessions.length - 1].id);
+    setSessionCollection(cloned);
+  }, [sessionCollection]);
+  const getSession = useCallback(id => {
+    return sessionCollection.getSession(id);
+  }, [sessionCollection]);
+  const sessions = useCallback(() => {
+    return sessionCollection.sessions;
+  }, [sessionCollection]);
+  const updateSession = useCallback((id, title, element, url) => {
+    const cloned = new ShellSessionCollection(sessionCollection.sessions, sessionCollection.getCurrentSessionId());
+    cloned.updateSession(id, title, element, url);
+    setSessionCollection(cloned);
+  }, [sessionCollection]);
+  const setCurrentSession = useCallback(id => {
+    const cloned = new ShellSessionCollection(sessionCollection.sessions, id);
+    cloned.setCurrentSession(id);
+    setSessionCollection(cloned);
+    navigate(cloned.getCurrentSession().url, {
+      state: {
+        title: cloned.getCurrentSession().title
+      }
+    });
+  }, [sessionCollection]);
+  const getCurrentSessionId = useCallback(() => {
+    return sessionCollection.getCurrentSessionId();
+  }, [sessionCollection]);
+  const getCurrentSession = useCallback(() => {
+    return sessionCollection.getCurrentSession();
+  }, [sessionCollection]);
+  const isCurrentSessionDisableable = useCallback(() => {
+    return sessionCollection.sessions.length > 1;
+  }, [sessionCollection]);
+  return jsx(ShellSessionContext.Provider, {
+    value: {
+      sessions: sessions,
+      addSession: addSession,
+      removeSession: removeSession,
+      getSession: getSession,
+      updateSession: updateSession,
+      getCurrentSessionId: getCurrentSessionId,
+      getCurrentSession: getCurrentSession,
+      setCurrentSession: setCurrentSession,
+      isCurrentSessionDisableable: isCurrentSessionDisableable
+    },
+    children: props.children
+  });
+}
+
 var propTypes = {exports: {}};
 
 var reactIs = {exports: {}};
@@ -5821,9 +6046,9 @@ function AppBar(props) {
   const location = useLocation();
   const [developmentMode, setDevelopmentMode] = React__default.useState(undefined);
   const [lastLocation, setLastLocation] = React__default.useState(undefined);
-  useHotkeys([['mod + o', () => {
+  useHotkeys(props.shellUi.navigation === ShellUINavigation.Sidebar ? [['mod + o', () => {
     if (navbarOpened) FluxoStateDispatcher.dispatchCloseNavbar();else FluxoStateDispatcher.dispatchOpenNavbar();
-  }]]);
+  }]] : []);
   useEffect(() => {
     if (!jitAppsLoaded) return;
     const splittedLocation = location.pathname.split('/');
@@ -6030,231 +6255,6 @@ function AppBar(props) {
   });
 }
 
-// Unique ID creation requires a high quality random # generator. In the browser we therefore
-// require the crypto API and do not support built-in fallback to lower quality random number
-// generators (like Math.random()).
-let getRandomValues;
-const rnds8 = new Uint8Array(16);
-function rng() {
-  // lazy load so that environments that need to polyfill have a chance to do so
-  if (!getRandomValues) {
-    // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation.
-    getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto);
-
-    if (!getRandomValues) {
-      throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
-    }
-  }
-
-  return getRandomValues(rnds8);
-}
-
-/**
- * Convert array of 16 byte values to UUID string format of the form:
- * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
- */
-
-const byteToHex = [];
-
-for (let i = 0; i < 256; ++i) {
-  byteToHex.push((i + 0x100).toString(16).slice(1));
-}
-
-function unsafeStringify(arr, offset = 0) {
-  // Note: Be careful editing this code!  It's been tuned for performance
-  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
-  return (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();
-}
-
-const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
-var native = {
-  randomUUID
-};
-
-function v4(options, buf, offset) {
-  if (native.randomUUID && !buf && !options) {
-    return native.randomUUID();
-  }
-
-  options = options || {};
-  const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
-
-  rnds[6] = rnds[6] & 0x0f | 0x40;
-  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
-
-  return unsafeStringify(rnds);
-}
-
-class ShellSessionCollection {
-  constructor(sessions = [], currentSessionId) {
-    this._sessions = sessions;
-    this._currentSessionId = currentSessionId;
-  }
-  get currentSession() {
-    return this._currentSessionId ? this.getSession(this._currentSessionId) : null;
-  }
-  addSession(title, element, url) {
-    const session = new ShellSession(title, element, url);
-    this._sessions.push(session);
-    return session;
-  }
-  removeSession(id) {
-    this._sessions = this._sessions.filter(s => s.id !== id);
-  }
-  getSession(id) {
-    return this._sessions.find(s => s.id === id);
-  }
-  get sessions() {
-    return this._sessions;
-  }
-  getCurrentSessionId() {
-    return this._currentSessionId;
-  }
-  getCurrentSession() {
-    return this.getSession(this._currentSessionId);
-  }
-  setCurrentSession(id) {
-    this._currentSessionId = id;
-  }
-  updateSession(id, title, element, url) {
-    const session = this.getSession(id);
-    if (session) {
-      session.updateSession(title, element, url);
-    }
-  }
-  getPreviuosSessionId() {
-    const index = this._sessions.findIndex(s => s.id === this._currentSessionId);
-    if (index > 0) {
-      return this._sessions[index - 1].id;
-    }
-    return this._sessions[this._sessions.length - 1].id;
-  }
-  getNextSessionId() {
-    const index = this._sessions.findIndex(s => s.id === this._currentSessionId);
-    if (index < this._sessions.length - 1) {
-      return this._sessions[index + 1].id;
-    }
-    return this._sessions[0].id;
-  }
-}
-class ShellSession {
-  constructor(title, element, url) {
-    this._id = v4();
-    this._title = title;
-    this._element = element;
-    this._url = url;
-  }
-  get id() {
-    return this._id;
-  }
-  get title() {
-    return this._title;
-  }
-  get element() {
-    return this._element;
-  }
-  get url() {
-    return this._url;
-  }
-  updateSession(title, element, url) {
-    this._title = title;
-    this._element = element;
-    this._url = url;
-  }
-}
-
-const defaultState = {
-  addSession: () => '',
-  removeSession: () => {},
-  getSession: () => {},
-  sessions: () => [],
-  updateSession: () => {},
-  getCurrentSessionId: () => null,
-  getCurrentSession: () => null,
-  setCurrentSession: () => {},
-  isCurrentSessionDisableable: () => false
-};
-const ShellSessionContext = /*#__PURE__*/React__default.createContext(defaultState);
-function ShellSessionProvider(props) {
-  useHotkeys([['shift+s', () => {
-    addSession(`Dashboard`, null, '/');
-  }]]);
-  useHotkeys([['shift+x', () => {
-    removeSession(getCurrentSessionId());
-  }]], [], true);
-  useHotkeys([['shift+ArrowLeft', () => {
-    setCurrentSession(sessionCollection.getPreviuosSessionId());
-  }]], [], true);
-  useHotkeys([['shift+ArrowRight', () => {
-    setCurrentSession(sessionCollection.getNextSessionId());
-  }]], [], true);
-  const [sessionCollection, setSessionCollection] = React__default.useState(new ShellSessionCollection([], null));
-  const navigate = useFlxNavigate();
-  const addSession = useCallback((title, element, url) => {
-    const cloned = new ShellSessionCollection(sessionCollection.sessions, sessionCollection.getCurrentSessionId());
-    const s = cloned.addSession(title, element, url);
-    cloned.setCurrentSession(s.id);
-    setSessionCollection(cloned);
-    navigate(s.url, {
-      state: {
-        title: title
-      }
-    });
-    return s.id;
-  }, [sessionCollection]);
-  const removeSession = useCallback(id => {
-    if (!isCurrentSessionDisableable()) return;
-    const cloned = new ShellSessionCollection(sessionCollection.sessions, sessionCollection.getCurrentSessionId());
-    cloned.removeSession(id);
-    cloned.setCurrentSession(cloned.sessions[cloned.sessions.length - 1].id);
-    setSessionCollection(cloned);
-  }, [sessionCollection]);
-  const getSession = useCallback(id => {
-    return sessionCollection.getSession(id);
-  }, [sessionCollection]);
-  const sessions = useCallback(() => {
-    return sessionCollection.sessions;
-  }, [sessionCollection]);
-  const updateSession = useCallback((id, title, element, url) => {
-    const cloned = new ShellSessionCollection(sessionCollection.sessions, sessionCollection.getCurrentSessionId());
-    cloned.updateSession(id, title, element, url);
-    setSessionCollection(cloned);
-  }, [sessionCollection]);
-  const setCurrentSession = useCallback(id => {
-    const cloned = new ShellSessionCollection(sessionCollection.sessions, id);
-    cloned.setCurrentSession(id);
-    setSessionCollection(cloned);
-    navigate(cloned.getCurrentSession().url, {
-      state: {
-        title: cloned.getCurrentSession().title
-      }
-    });
-  }, [sessionCollection]);
-  const getCurrentSessionId = useCallback(() => {
-    return sessionCollection.getCurrentSessionId();
-  }, [sessionCollection]);
-  const getCurrentSession = useCallback(() => {
-    return sessionCollection.getCurrentSession();
-  }, [sessionCollection]);
-  const isCurrentSessionDisableable = useCallback(() => {
-    return sessionCollection.sessions.length > 1;
-  }, [sessionCollection]);
-  return jsx(ShellSessionContext.Provider, {
-    value: {
-      sessions: sessions,
-      addSession: addSession,
-      removeSession: removeSession,
-      getSession: getSession,
-      updateSession: updateSession,
-      getCurrentSessionId: getCurrentSessionId,
-      getCurrentSession: getCurrentSession,
-      setCurrentSession: setCurrentSession,
-      isCurrentSessionDisableable: isCurrentSessionDisableable
-    },
-    children: props.children
-  });
-}
-
 function AppContent(props) {
   const sessionContext = React__default.useContext(ShellSessionContext);
   useEffect(() => {
@@ -6439,8 +6439,6 @@ function FooterBar(props) {
   });
 }
 
-var style = {"control":"navbar-item-module_control__0EMhh","controlSub":"navbar-item-module_controlSub__U-eSe","link":"navbar-item-module_link__sVkBe","chevron":"navbar-item-module_chevron__-1UpS"};
-
 function NavBarItem({
   icon: Icon,
   label,
@@ -6476,7 +6474,7 @@ function NavBarItem({
     }
     if (link.featureIdentifier === 'webclient.routing.externallink') {
       return jsx(Link, {
-        className: style['link'],
+        className: undefined,
         style: {
           color: colorScheme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.gray[7],
           borderLeft: `1px solid ${colorScheme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[3]}`
@@ -6487,7 +6485,7 @@ function NavBarItem({
       }, link.label + '_' + i);
     } else {
       return jsx(Link, {
-        className: style['link'],
+        className: undefined,
         style: {
           color: colorScheme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.gray[7],
           borderLeft: `1px solid ${colorScheme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[3]}`
@@ -6510,7 +6508,7 @@ function NavBarItem({
             }
           });
         },
-        className: level === 0 ? style['control'] : style['controlSub'],
+        className: level === 0 ? undefined : undefined,
         children: jsxs(Group, {
           justify: 'space-between',
           gap: 0,
@@ -6531,7 +6529,7 @@ function NavBarItem({
               children: label
             })]
           }), hasLinks && jsx(ChevronIcon, {
-            className: style['chevron'],
+            className: undefined,
             size: 14,
             stroke: 1.5,
             style: {
@@ -8394,61 +8392,102 @@ function ShellSpotlight() {
   });
 }
 
-function AppLayout(props) {
-  const {
-    navbarOpened
-  } = useSelector(state => state.layout);
-  const fluxoClientConfig = useSelector(state => state.client.fluxoClientConfig);
-  return jsxs(ShellSessionProvider, {
-    children: [jsx(RavifyProvider, {
+// Context per evitare props drilling
+const ShellUIContext = /*#__PURE__*/createContext(null);
+const WithShellSessionProvider = ({
+  children,
+  withMultipleSessions
+}) => {
+  if (withMultipleSessions) {
+    return jsx(ShellSessionProvider, {
+      children: children
+    });
+  }
+  return jsx(Fragment, {
+    children: children
+  });
+};
+const WithRavifyProvider = ({
+  children,
+  hasAdminAccess,
+  fluxoClientConfig
+}) => {
+  if (hasAdminAccess) {
+    return jsx(RavifyProvider, {
       fluxoClientConfig: fluxoClientConfig,
-      children: jsxs(AppShell, {
-        padding: 0,
-        styles: {
-          main: {
-            backgroundColor: '#fafbff' 
-          }
-        },
-        navbar: {
-          width: 248,
-          breakpoint: 'sm',
-          collapsed: {
-            mobile: !navbarOpened,
-            desktop: !navbarOpened
-          }
-        },
-        header: {
-          height: 48
-        },
-        footer: {
-          height: 40
-        },
-        transitionDuration: 0,
-        layout: 'default',
-        children: [jsx(AppBar, {
-          shellUi: props.ui,
-          brandName: props.brandName
-        }), jsx(Navbar, {
-          shellUi: props.ui
-        }), jsx(AppShell.Main, {
-          style: {
-            paddingTop: props.ui.navigation === ShellUINavigation.Topbar ? 88 : undefined
+      children: children
+    });
+  }
+  return jsx(Fragment, {
+    children: children
+  });
+};
+function AppLayout({
+  appVersion,
+  brandName,
+  withMultipleSessions,
+  ui
+}) {
+  const {
+    navbarOpened,
+    hasAdminAccess
+  } = useAppSelector(state => state.layout);
+  const fluxoClientConfig = useAppSelector(state => state.client.fluxoClientConfig);
+  return jsx(ShellUIContext.Provider, {
+    value: ui,
+    children: jsxs(WithShellSessionProvider, {
+      withMultipleSessions: withMultipleSessions,
+      children: [jsx(WithRavifyProvider, {
+        hasAdminAccess: hasAdminAccess,
+        fluxoClientConfig: fluxoClientConfig,
+        children: jsxs(AppShell, {
+          padding: 0,
+          styles: {
+            main: {
+              backgroundColor: '#fafbff'
+            }
+          },
+          navbar: {
+            width: 248,
+            breakpoint: 'sm',
+            collapsed: {
+              mobile: !navbarOpened,
+              desktop: !navbarOpened
+            }
           },
-          children: jsx(Suspense, {
-            fallback: jsx(Loader, {}),
-            children: jsx(AppContent, {
-              shellUi: props.ui,
-              withMultipleSessions: props.withMultipleSessions
+          header: {
+            height: 48
+          },
+          footer: {
+            height: 40
+          },
+          transitionDuration: 0,
+          layout: "default",
+          children: [jsx(AppBar, {
+            shellUi: ui,
+            brandName: brandName
+          }), jsx(Navbar, {
+            shellUi: ui
+          }), jsx(AppShell.Main, {
+            style: {
+              paddingTop: ui.navigation === ShellUINavigation.Topbar ? 88 : undefined
+            },
+            children: jsx(Suspense, {
+              fallback: jsx(Loader, {}),
+              children: jsx(AppContent, {
+                shellUi: ui,
+                withMultipleSessions: withMultipleSessions
+              })
             })
-          })
-        }), jsx(AppShell.Footer, {
-          children: jsx(FooterBar, {
-            brandName: props.brandName,
-            appVersion: props.appVersion
-          })
-        })]
-      })
-    }), jsx(ShellSpotlight, {})]
+          }), jsx(AppShell.Footer, {
+            children: jsx(FooterBar, {
+              brandName: brandName,
+              appVersion: appVersion
+            })
+          })]
+        })
+      }), jsx(ShellSpotlight, {})]
+    })
   });
 }
 
@@ -23939,8 +23978,6 @@ function TreeInner(props, ref) {
 }
 var Tree = forwardRef(TreeInner);
 
-var styles$2 = {"root":"custom-node-module_root__OB7SZ","expandIconWrapper":"custom-node-module_expandIconWrapper__fKf-r","isOpen":"custom-node-module_isOpen__vePGR","labelGridItem":"custom-node-module_labelGridItem__7eEnD"};
-
 var $$6 = _export;
 var $includes = arrayIncludes.includes;
 var fails$6 = fails$q;
@@ -24313,7 +24350,7 @@ const CustomNode = props => {
   };
   return jsxs("div", {
     id: props.node.id.toString(),
-    className: `tree-node ${styles$2["root"]}`,
+    className: `tree-node ${undefined}`,
     style: {
       marginLeft: indent,
       marginBottom: 16,
@@ -24321,14 +24358,14 @@ const CustomNode = props => {
       border: '1px solid #e9ecef'
     },
     children: [jsx("div", {
-      className: styles$2["expandIconWrapper"],
+      className: undefined,
       children: jsx(ThemeIcon, {
         variant: "light",
         size: 30,
         children: IconFactory.getIcon(props.node.data.icon)
       })
     }), jsx("div", {
-      className: styles$2["labelGridItem"],
+      className: undefined,
       onClick: handleToggle,
       children: jsx(Text, {
         variant: "text",
@@ -24340,7 +24377,7 @@ const CustomNode = props => {
       style: {
         width: isLeaf() ? 24 : 8
       },
-      className: `${styles$2["expandIconWrapper"]} ${props.isOpen ? styles$2["isOpen"] : ""}`,
+      className: `${undefined} ${props.isOpen ? undefined : ""}`,
       children: isLeaf() && jsx("div", {
         onClick: handleToggle,
         children: jsx(IconChevronRight, {
@@ -24444,19 +24481,22 @@ const CustomNode = props => {
   });
 };
 
-var styles$1 = {"root":"placeholder-module_root__3fAsg"};
-
 const Placeholder = props => {
   const left = props.depth * 24;
   return jsx("div", {
-    className: styles$1["root"],
+    className: undefined,
     style: {
       left
     }
   });
 };
 
-var styles = {"app":"menu-designer-module_app__LilwQ","treeRoot":"menu-designer-module_treeRoot__QFCU1","draggingSource":"menu-designer-module_draggingSource__Kmtr5","placeholderContainer":"menu-designer-module_placeholderContainer__Y4M-R","dropTarget":"menu-designer-module_dropTarget__9otBw"};
+var menuDesigner_module = {"app":"menu-designer-module_app__LilwQ","treeRoot":"menu-designer-module_treeRoot__QFCU1","draggingSource":"menu-designer-module_draggingSource__Kmtr5","placeholderContainer":"menu-designer-module_placeholderContainer__Y4M-R","dropTarget":"menu-designer-module_dropTarget__9otBw"};
+
+var styles = /*#__PURE__*/Object.freeze({
+	__proto__: null,
+	default: menuDesigner_module
+});
 
 var fails$5 = fails$q;
 var global$4 = global$p;
@@ -24923,6 +24963,7 @@ function MenuDesigner(props) {
     //setTreeData(result);
   }, [appMenu]);
   useEffect(() => {
+    console.log(styles);
     loadAppMenuList();
   }, []);
   const loadAppMenuList = () => {
@@ -25092,9 +25133,6 @@ function MenuDesigner(props) {
   const isModuleAttachedToFrontend = (module, frontend) => {
     // workaround momentaneo. Bisogna capire come eventualmente
     // abbinare le app dinamiche ai frontend. Per ora, tutte quelle che non sono fluxo, vengono abbinate
-    if (module.key !== 'fluxo') return true;
-    const shellFrontend = props.frontends.find(a => a.id === (currentWebMenu === null || currentWebMenu === void 0 ? void 0 : currentWebMenu.frontend));
-    if ((shellFrontend === null || shellFrontend === void 0 ? void 0 : shellFrontend.modules.filter(a => a.scope === module.key).length) === 0) return false;
     return true;
   };
   const deleteWebMenu = webMenuId => {
@@ -25278,9 +25316,9 @@ function MenuDesigner(props) {
                 return ((_a = dropTarget === null || dropTarget === void 0 ? void 0 : dropTarget.data) === null || _a === void 0 ? void 0 : _a.isGroup) || dropTarget === undefined;
               },
               classes: {
-                root: styles["treeRoot"],
-                draggingSource: styles["draggingSource"],
-                placeholder: styles["placeholderContainer"]
+                root: undefined,
+                draggingSource: undefined,
+                placeholder: undefined
               },
               placeholderRender: (node, {
                 depth
@@ -36125,6 +36163,7 @@ var ShellUINavigation;
 (function (ShellUINavigation) {
   ShellUINavigation[ShellUINavigation["Sidebar"] = 1] = "Sidebar";
   ShellUINavigation[ShellUINavigation["Topbar"] = 2] = "Topbar";
+  ShellUINavigation[ShellUINavigation["None"] = 3] = "None";
 })(ShellUINavigation || (ShellUINavigation = {}));
 function FluxoShell(props) {
   const [initialOperationsFinished, setInitialOperationsFinished] = useState(false);

package/package.json

@@ -1,16 +1,16 @@
 {
   "name": "@fluxo-dev/shell",
-  "version": "0.0.37",
+  "version": "0.0.39",
   "peerDependencies": {
-    "@fluxo-dev/shell-hub": "0.0.37",
-    "@fluxo-dev/shell-korebi": "0.0.37",
-    "@fluxo-dev/shell-mfe": "0.0.37",
-    "@fluxo-dev/shell-printing": "0.0.37",
-    "@fluxo-dev/shell-reporting": "0.0.37",
-    "@fluxo-dev/shell-workflow": "0.0.37",
-    "@fluxo-dev/state": "0.0.37",
-    "@fluxo-dev/ui-components": "0.0.37",
-    "@fluxo-dev/shell-ravify": "0.0.37"
+    "@fluxo-dev/shell-hub": "0.0.39",
+    "@fluxo-dev/shell-korebi": "0.0.39",
+    "@fluxo-dev/shell-mfe": "0.0.39",
+    "@fluxo-dev/shell-printing": "0.0.39",
+    "@fluxo-dev/shell-reporting": "0.0.39",
+    "@fluxo-dev/shell-workflow": "0.0.39",
+    "@fluxo-dev/state": "0.0.39",
+    "@fluxo-dev/ui-components": "0.0.39",
+    "@fluxo-dev/shell-ravify": "0.0.39"
   },
   "module": "./index.esm.js",
   "type": "module",

package/src/lib/app.d.ts

@@ -12,7 +12,8 @@ export type ShellFrontend = {
 };
 export declare enum ShellUINavigation {
     Sidebar = 1,
-    Topbar = 2
+    Topbar = 2,
+    None = 3
 }
 export interface ShellUI {
     navigation: ShellUINavigation;

package/src/lib/layouts/main/app-layout.d.ts

@@ -1,10 +1,11 @@
 import { ShellUI } from "../../app";
 import './horizontal-menu.css';
-export interface AppLayoutProps {
+interface AppLayoutProps {
     appVersion: string;
     brandName: string;
     withMultipleSessions: boolean;
     ui: ShellUI;
 }
-declare function AppLayout(props: AppLayoutProps): import("react/jsx-runtime").JSX.Element;
+export declare const useShellUI: () => ShellUI;
+declare function AppLayout({ appVersion, brandName, withMultipleSessions, ui }: AppLayoutProps): import("react/jsx-runtime").JSX.Element;
 export default AppLayout;