@fluxo-dev/shell 25.3.8 → 25.4.0

package/index.esm.js

@@ -1,9 +1,9 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
-import React__default, { useState, useEffect, Suspense, useRef, useCallback as useCallback$1, forwardRef, createElement as createElement$2, useMemo as useMemo$1, useContext, createContext, useLayoutEffect, memo, isValidElement, cloneElement, useImperativeHandle, lazy } from 'react';
+import React__default, { useState, useEffect, Suspense, useRef, useCallback as useCallback$1, forwardRef, createElement as createElement$2, useContext, useMemo as useMemo$1, createContext, useLayoutEffect, memo, isValidElement, cloneElement, useImperativeHandle, lazy } from 'react';
 import { useSelector, connect, Provider } from 'react-redux';
-import { Navigate, Outlet, useNavigate, useLocation, Link, useOutlet, matchPath, Route, useSearchParams, createBrowserRouter, RouterProvider } from 'react-router-dom';
-import { useFlxNavigate, DataCard, SessionIdContext, TabActiveContext, IconFactory, ShellConfigProvider, useShellLayout, ShellPage, NoData, ConfirmModal, CronGenerator, Datagrid, RichTextEditorInput, ErrorPage as ErrorPage$1, FlxRoutes, WaitData } from '@fluxo-dev/ui-components';
+import { Navigate, Outlet, useNavigate, useLocation, Link, useOutlet, matchPath, useSearchParams, createBrowserRouter, RouterProvider } from 'react-router-dom';
+import { useFlxNavigate, DataCard, SessionIdContext, TabActiveContext, IconFactory, ShellConfigProvider, useShellLayout, ShellPage, NoData, ConfirmModal, CronGenerator, Datagrid, RichTextEditorInput, ErrorPage as ErrorPage$1, WaitData } from '@fluxo-dev/ui-components';
 import { ModuleLoader } from '@fluxo-dev/shell-mfe';
 import { Text, Box, TextInput, Popover, Stack, UnstyledButton, Group, Highlight, ActionIcon, useMantineTheme, AppShell, Burger, Badge, Drawer, NavLink, Avatar, Center, Button, Divider, Modal, FocusTrap, Tabs, ScrollArea, ThemeIcon, Tooltip, Anchor, Space, useMantineColorScheme, Collapse, Menu, rem, Loader, Overlay, Grid, PasswordInput, Paper, Alert, Title, Card, ColorSwatch, FileButton, NumberInput, ColorInput, Checkbox, Switch, Select, Radio, LoadingOverlay, Chip, Image as Image$1, Table, SegmentedControl, MultiSelect, Code, Portal, useDirection, px as px$1, parseThemeColor, rgba as rgba$1, Breadcrumbs, TagsInput, Textarea, Accordion, useCombobox, Combobox, InputBase, Slider, MantineProvider } from '@mantine/core';
 import { MinimalStateViewer, RavifyProvider, JobsViewer } from '@fluxo-dev/shell-ravify';
@@ -11170,8 +11170,8 @@ const createReactComponent = (type, iconName, iconNamePascal, iconNode) => {
  */
 
 
-const __iconNode$1B = [["path", { "d": "M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0", "key": "svg-0" }], ["path", { "d": "M12 8v4", "key": "svg-1" }], ["path", { "d": "M12 16h.01", "key": "svg-2" }]];
-const IconAlertCircle = createReactComponent("outline", "alert-circle", "AlertCircle", __iconNode$1B);
+const __iconNode$1H = [["path", { "d": "M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0", "key": "svg-0" }], ["path", { "d": "M12 8v4", "key": "svg-1" }], ["path", { "d": "M12 16h.01", "key": "svg-2" }]];
+const IconAlertCircle = createReactComponent("outline", "alert-circle", "AlertCircle", __iconNode$1H);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11181,8 +11181,8 @@ const IconAlertCircle = createReactComponent("outline", "alert-circle", "AlertCi
  */
 
 
-const __iconNode$1A = [["path", { "d": "M12 9v4", "key": "svg-0" }], ["path", { "d": "M10.363 3.591l-8.106 13.534a1.914 1.914 0 0 0 1.636 2.871h16.214a1.914 1.914 0 0 0 1.636 -2.87l-8.106 -13.536a1.914 1.914 0 0 0 -3.274 0z", "key": "svg-1" }], ["path", { "d": "M12 16h.01", "key": "svg-2" }]];
-const IconAlertTriangle = createReactComponent("outline", "alert-triangle", "AlertTriangle", __iconNode$1A);
+const __iconNode$1G = [["path", { "d": "M12.802 2.165l5.575 2.389c.48 .206 .863 .589 1.07 1.07l2.388 5.574c.22 .512 .22 1.092 0 1.604l-2.389 5.575c-.206 .48 -.589 .863 -1.07 1.07l-5.574 2.388c-.512 .22 -1.092 .22 -1.604 0l-5.575 -2.389a2.036 2.036 0 0 1 -1.07 -1.07l-2.388 -5.574a2.036 2.036 0 0 1 0 -1.604l2.389 -5.575c.206 -.48 .589 -.863 1.07 -1.07l5.574 -2.388a2.036 2.036 0 0 1 1.604 0z", "key": "svg-0" }], ["path", { "d": "M12 8v4", "key": "svg-1" }], ["path", { "d": "M12 16h.01", "key": "svg-2" }]];
+const IconAlertOctagon = createReactComponent("outline", "alert-octagon", "AlertOctagon", __iconNode$1G);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11192,8 +11192,8 @@ const IconAlertTriangle = createReactComponent("outline", "alert-triangle", "Ale
  */
 
 
-const __iconNode$1z = [["path", { "d": "M4 13h5", "key": "svg-0" }], ["path", { "d": "M12 16v-8h3a2 2 0 0 1 2 2v1a2 2 0 0 1 -2 2h-3", "key": "svg-1" }], ["path", { "d": "M20 8v8", "key": "svg-2" }], ["path", { "d": "M9 16v-5.5a2.5 2.5 0 0 0 -5 0v5.5", "key": "svg-3" }]];
-const IconApi = createReactComponent("outline", "api", "Api", __iconNode$1z);
+const __iconNode$1F = [["path", { "d": "M12 9v4", "key": "svg-0" }], ["path", { "d": "M10.363 3.591l-8.106 13.534a1.914 1.914 0 0 0 1.636 2.871h16.214a1.914 1.914 0 0 0 1.636 -2.87l-8.106 -13.536a1.914 1.914 0 0 0 -3.274 0z", "key": "svg-1" }], ["path", { "d": "M12 16h.01", "key": "svg-2" }]];
+const IconAlertTriangle = createReactComponent("outline", "alert-triangle", "AlertTriangle", __iconNode$1F);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11203,8 +11203,8 @@ const IconApi = createReactComponent("outline", "api", "Api", __iconNode$1z);
  */
 
 
-const __iconNode$1y = [["path", { "d": "M4 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z", "key": "svg-0" }], ["path", { "d": "M4 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z", "key": "svg-1" }], ["path", { "d": "M14 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z", "key": "svg-2" }], ["path", { "d": "M14 7l6 0", "key": "svg-3" }], ["path", { "d": "M17 4l0 6", "key": "svg-4" }]];
-const IconApps = createReactComponent("outline", "apps", "Apps", __iconNode$1y);
+const __iconNode$1E = [["path", { "d": "M4 13h5", "key": "svg-0" }], ["path", { "d": "M12 16v-8h3a2 2 0 0 1 2 2v1a2 2 0 0 1 -2 2h-3", "key": "svg-1" }], ["path", { "d": "M20 8v8", "key": "svg-2" }], ["path", { "d": "M9 16v-5.5a2.5 2.5 0 0 0 -5 0v5.5", "key": "svg-3" }]];
+const IconApi = createReactComponent("outline", "api", "Api", __iconNode$1E);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11214,8 +11214,8 @@ const IconApps = createReactComponent("outline", "apps", "Apps", __iconNode$1y);
  */
 
 
-const __iconNode$1x = [["path", { "d": "M12 5l0 14", "key": "svg-0" }], ["path", { "d": "M18 13l-6 6", "key": "svg-1" }], ["path", { "d": "M6 13l6 6", "key": "svg-2" }]];
-const IconArrowDown = createReactComponent("outline", "arrow-down", "ArrowDown", __iconNode$1x);
+const __iconNode$1D = [["path", { "d": "M4 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z", "key": "svg-0" }], ["path", { "d": "M4 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z", "key": "svg-1" }], ["path", { "d": "M14 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z", "key": "svg-2" }], ["path", { "d": "M14 7l6 0", "key": "svg-3" }], ["path", { "d": "M17 4l0 6", "key": "svg-4" }]];
+const IconApps = createReactComponent("outline", "apps", "Apps", __iconNode$1D);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11225,8 +11225,8 @@ const IconArrowDown = createReactComponent("outline", "arrow-down", "ArrowDown",
  */
 
 
-const __iconNode$1w = [["path", { "d": "M5 12l14 0", "key": "svg-0" }], ["path", { "d": "M5 12l6 6", "key": "svg-1" }], ["path", { "d": "M5 12l6 -6", "key": "svg-2" }]];
-const IconArrowLeft = createReactComponent("outline", "arrow-left", "ArrowLeft", __iconNode$1w);
+const __iconNode$1C = [["path", { "d": "M12 5l0 14", "key": "svg-0" }], ["path", { "d": "M18 13l-6 6", "key": "svg-1" }], ["path", { "d": "M6 13l6 6", "key": "svg-2" }]];
+const IconArrowDown = createReactComponent("outline", "arrow-down", "ArrowDown", __iconNode$1C);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11236,8 +11236,8 @@ const IconArrowLeft = createReactComponent("outline", "arrow-left", "ArrowLeft",
  */
 
 
-const __iconNode$1v = [["path", { "d": "M5 12l14 0", "key": "svg-0" }], ["path", { "d": "M13 18l6 -6", "key": "svg-1" }], ["path", { "d": "M13 6l6 6", "key": "svg-2" }]];
-const IconArrowRight = createReactComponent("outline", "arrow-right", "ArrowRight", __iconNode$1v);
+const __iconNode$1B = [["path", { "d": "M5 12l14 0", "key": "svg-0" }], ["path", { "d": "M5 12l6 6", "key": "svg-1" }], ["path", { "d": "M5 12l6 -6", "key": "svg-2" }]];
+const IconArrowLeft = createReactComponent("outline", "arrow-left", "ArrowLeft", __iconNode$1B);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11247,8 +11247,8 @@ const IconArrowRight = createReactComponent("outline", "arrow-right", "ArrowRigh
  */
 
 
-const __iconNode$1u = [["path", { "d": "M12 5l0 14", "key": "svg-0" }], ["path", { "d": "M18 11l-6 -6", "key": "svg-1" }], ["path", { "d": "M6 11l6 -6", "key": "svg-2" }]];
-const IconArrowUp = createReactComponent("outline", "arrow-up", "ArrowUp", __iconNode$1u);
+const __iconNode$1A = [["path", { "d": "M5 12l14 0", "key": "svg-0" }], ["path", { "d": "M13 18l6 -6", "key": "svg-1" }], ["path", { "d": "M13 6l6 6", "key": "svg-2" }]];
+const IconArrowRight = createReactComponent("outline", "arrow-right", "ArrowRight", __iconNode$1A);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11258,8 +11258,8 @@ const IconArrowUp = createReactComponent("outline", "arrow-up", "ArrowUp", __ico
  */
 
 
-const __iconNode$1t = [["path", { "d": "M12 12m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0", "key": "svg-0" }], ["path", { "d": "M16 12v1.5a2.5 2.5 0 0 0 5 0v-1.5a9 9 0 1 0 -5.5 8.28", "key": "svg-1" }]];
-const IconAt = createReactComponent("outline", "at", "At", __iconNode$1t);
+const __iconNode$1z = [["path", { "d": "M12 5l0 14", "key": "svg-0" }], ["path", { "d": "M18 11l-6 -6", "key": "svg-1" }], ["path", { "d": "M6 11l6 -6", "key": "svg-2" }]];
+const IconArrowUp = createReactComponent("outline", "arrow-up", "ArrowUp", __iconNode$1z);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11269,8 +11269,8 @@ const IconAt = createReactComponent("outline", "at", "At", __iconNode$1t);
  */
 
 
-const __iconNode$1s = [["path", { "d": "M8 8h8v8h-8z", "key": "svg-0" }], ["path", { "d": "M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z", "key": "svg-1" }], ["path", { "d": "M16 16l3.3 3.3", "key": "svg-2" }], ["path", { "d": "M16 8l3.3 -3.3", "key": "svg-3" }], ["path", { "d": "M8 8l-3.3 -3.3", "key": "svg-4" }], ["path", { "d": "M8 16l-3.3 3.3", "key": "svg-5" }]];
-const IconBoxModel = createReactComponent("outline", "box-model", "BoxModel", __iconNode$1s);
+const __iconNode$1y = [["path", { "d": "M12 12m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0", "key": "svg-0" }], ["path", { "d": "M16 12v1.5a2.5 2.5 0 0 0 5 0v-1.5a9 9 0 1 0 -5.5 8.28", "key": "svg-1" }]];
+const IconAt = createReactComponent("outline", "at", "At", __iconNode$1y);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11280,8 +11280,8 @@ const IconBoxModel = createReactComponent("outline", "box-model", "BoxModel", __
  */
 
 
-const __iconNode$1r = [["path", { "d": "M7 3m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z", "key": "svg-0" }], ["path", { "d": "M17 17v2a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h2", "key": "svg-1" }]];
-const IconBoxMultiple = createReactComponent("outline", "box-multiple", "BoxMultiple", __iconNode$1r);
+const __iconNode$1x = [["path", { "d": "M10 5a2 2 0 1 1 4 0a7 7 0 0 1 4 6v3a4 4 0 0 0 2 3h-16a4 4 0 0 0 2 -3v-3a7 7 0 0 1 4 -6", "key": "svg-0" }], ["path", { "d": "M9 17v1a3 3 0 0 0 6 0v-1", "key": "svg-1" }]];
+const IconBell = createReactComponent("outline", "bell", "Bell", __iconNode$1x);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11291,8 +11291,8 @@ const IconBoxMultiple = createReactComponent("outline", "box-multiple", "BoxMult
  */
 
 
-const __iconNode$1q = [["path", { "d": "M15.5 13a3.5 3.5 0 0 0 -3.5 3.5v1a3.5 3.5 0 0 0 7 0v-1.8", "key": "svg-0" }], ["path", { "d": "M8.5 13a3.5 3.5 0 0 1 3.5 3.5v1a3.5 3.5 0 0 1 -7 0v-1.8", "key": "svg-1" }], ["path", { "d": "M17.5 16a3.5 3.5 0 0 0 0 -7h-.5", "key": "svg-2" }], ["path", { "d": "M19 9.3v-2.8a3.5 3.5 0 0 0 -7 0", "key": "svg-3" }], ["path", { "d": "M6.5 16a3.5 3.5 0 0 1 0 -7h.5", "key": "svg-4" }], ["path", { "d": "M5 9.3v-2.8a3.5 3.5 0 0 1 7 0v10", "key": "svg-5" }]];
-const IconBrain = createReactComponent("outline", "brain", "Brain", __iconNode$1q);
+const __iconNode$1w = [["path", { "d": "M8 8h8v8h-8z", "key": "svg-0" }], ["path", { "d": "M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z", "key": "svg-1" }], ["path", { "d": "M16 16l3.3 3.3", "key": "svg-2" }], ["path", { "d": "M16 8l3.3 -3.3", "key": "svg-3" }], ["path", { "d": "M8 8l-3.3 -3.3", "key": "svg-4" }], ["path", { "d": "M8 16l-3.3 3.3", "key": "svg-5" }]];
+const IconBoxModel = createReactComponent("outline", "box-model", "BoxModel", __iconNode$1w);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11302,8 +11302,8 @@ const IconBrain = createReactComponent("outline", "brain", "Brain", __iconNode$1
  */
 
 
-const __iconNode$1p = [["path", { "d": "M11.217 19.384a3.501 3.501 0 0 0 6.783 -1.217v-5.167l-6 -3.35", "key": "svg-0" }], ["path", { "d": "M5.214 15.014a3.501 3.501 0 0 0 4.446 5.266l4.34 -2.534v-6.946", "key": "svg-1" }], ["path", { "d": "M6 7.63c-1.391 -.236 -2.787 .395 -3.534 1.689a3.474 3.474 0 0 0 1.271 4.745l4.263 2.514l6 -3.348", "key": "svg-2" }], ["path", { "d": "M12.783 4.616a3.501 3.501 0 0 0 -6.783 1.217v5.067l6 3.45", "key": "svg-3" }], ["path", { "d": "M18.786 8.986a3.501 3.501 0 0 0 -4.446 -5.266l-4.34 2.534v6.946", "key": "svg-4" }], ["path", { "d": "M18 16.302c1.391 .236 2.787 -.395 3.534 -1.689a3.474 3.474 0 0 0 -1.271 -4.745l-4.308 -2.514l-5.955 3.42", "key": "svg-5" }]];
-const IconBrandOpenai = createReactComponent("outline", "brand-openai", "BrandOpenai", __iconNode$1p);
+const __iconNode$1v = [["path", { "d": "M7 3m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z", "key": "svg-0" }], ["path", { "d": "M17 17v2a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h2", "key": "svg-1" }]];
+const IconBoxMultiple = createReactComponent("outline", "box-multiple", "BoxMultiple", __iconNode$1v);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11313,8 +11313,8 @@ const IconBrandOpenai = createReactComponent("outline", "brand-openai", "BrandOp
  */
 
 
-const __iconNode$1o = [["path", { "d": "M9 9v-1a3 3 0 0 1 6 0v1", "key": "svg-0" }], ["path", { "d": "M8 9h8a6 6 0 0 1 1 3v3a5 5 0 0 1 -10 0v-3a6 6 0 0 1 1 -3", "key": "svg-1" }], ["path", { "d": "M3 13l4 0", "key": "svg-2" }], ["path", { "d": "M17 13l4 0", "key": "svg-3" }], ["path", { "d": "M12 20l0 -6", "key": "svg-4" }], ["path", { "d": "M4 19l3.35 -2", "key": "svg-5" }], ["path", { "d": "M20 19l-3.35 -2", "key": "svg-6" }], ["path", { "d": "M4 7l3.75 2.4", "key": "svg-7" }], ["path", { "d": "M20 7l-3.75 2.4", "key": "svg-8" }]];
-const IconBug = createReactComponent("outline", "bug", "Bug", __iconNode$1o);
+const __iconNode$1u = [["path", { "d": "M15.5 13a3.5 3.5 0 0 0 -3.5 3.5v1a3.5 3.5 0 0 0 7 0v-1.8", "key": "svg-0" }], ["path", { "d": "M8.5 13a3.5 3.5 0 0 1 3.5 3.5v1a3.5 3.5 0 0 1 -7 0v-1.8", "key": "svg-1" }], ["path", { "d": "M17.5 16a3.5 3.5 0 0 0 0 -7h-.5", "key": "svg-2" }], ["path", { "d": "M19 9.3v-2.8a3.5 3.5 0 0 0 -7 0", "key": "svg-3" }], ["path", { "d": "M6.5 16a3.5 3.5 0 0 1 0 -7h.5", "key": "svg-4" }], ["path", { "d": "M5 9.3v-2.8a3.5 3.5 0 0 1 7 0v10", "key": "svg-5" }]];
+const IconBrain = createReactComponent("outline", "brain", "Brain", __iconNode$1u);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11324,8 +11324,8 @@ const IconBug = createReactComponent("outline", "bug", "Bug", __iconNode$1o);
  */
 
 
-const __iconNode$1n = [["path", { "d": "M3 21l18 0", "key": "svg-0" }], ["path", { "d": "M9 8l1 0", "key": "svg-1" }], ["path", { "d": "M9 12l1 0", "key": "svg-2" }], ["path", { "d": "M9 16l1 0", "key": "svg-3" }], ["path", { "d": "M14 8l1 0", "key": "svg-4" }], ["path", { "d": "M14 12l1 0", "key": "svg-5" }], ["path", { "d": "M14 16l1 0", "key": "svg-6" }], ["path", { "d": "M5 21v-16a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v16", "key": "svg-7" }]];
-const IconBuilding = createReactComponent("outline", "building", "Building", __iconNode$1n);
+const __iconNode$1t = [["path", { "d": "M11.217 19.384a3.501 3.501 0 0 0 6.783 -1.217v-5.167l-6 -3.35", "key": "svg-0" }], ["path", { "d": "M5.214 15.014a3.501 3.501 0 0 0 4.446 5.266l4.34 -2.534v-6.946", "key": "svg-1" }], ["path", { "d": "M6 7.63c-1.391 -.236 -2.787 .395 -3.534 1.689a3.474 3.474 0 0 0 1.271 4.745l4.263 2.514l6 -3.348", "key": "svg-2" }], ["path", { "d": "M12.783 4.616a3.501 3.501 0 0 0 -6.783 1.217v5.067l6 3.45", "key": "svg-3" }], ["path", { "d": "M18.786 8.986a3.501 3.501 0 0 0 -4.446 -5.266l-4.34 2.534v6.946", "key": "svg-4" }], ["path", { "d": "M18 16.302c1.391 .236 2.787 -.395 3.534 -1.689a3.474 3.474 0 0 0 -1.271 -4.745l-4.308 -2.514l-5.955 3.42", "key": "svg-5" }]];
+const IconBrandOpenai = createReactComponent("outline", "brand-openai", "BrandOpenai", __iconNode$1t);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11335,8 +11335,8 @@ const IconBuilding = createReactComponent("outline", "building", "Building", __i
  */
 
 
-const __iconNode$1m = [["path", { "d": "M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12z", "key": "svg-0" }], ["path", { "d": "M16 3v4", "key": "svg-1" }], ["path", { "d": "M8 3v4", "key": "svg-2" }], ["path", { "d": "M4 11h16", "key": "svg-3" }], ["path", { "d": "M11 15h1", "key": "svg-4" }], ["path", { "d": "M12 15v3", "key": "svg-5" }]];
-const IconCalendar = createReactComponent("outline", "calendar", "Calendar", __iconNode$1m);
+const __iconNode$1s = [["path", { "d": "M18.364 19.364a9 9 0 1 0 -12.728 0", "key": "svg-0" }], ["path", { "d": "M15.536 16.536a5 5 0 1 0 -7.072 0", "key": "svg-1" }], ["path", { "d": "M12 13m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-2" }]];
+const IconBroadcast = createReactComponent("outline", "broadcast", "Broadcast", __iconNode$1s);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11346,8 +11346,8 @@ const IconCalendar = createReactComponent("outline", "calendar", "Calendar", __i
  */
 
 
-const __iconNode$1l = [["path", { "d": "M4 4h6v6h-6z", "key": "svg-0" }], ["path", { "d": "M14 4h6v6h-6z", "key": "svg-1" }], ["path", { "d": "M4 14h6v6h-6z", "key": "svg-2" }], ["path", { "d": "M17 17m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0", "key": "svg-3" }]];
-const IconCategory = createReactComponent("outline", "category", "Category", __iconNode$1l);
+const __iconNode$1r = [["path", { "d": "M9 9v-1a3 3 0 0 1 6 0v1", "key": "svg-0" }], ["path", { "d": "M8 9h8a6 6 0 0 1 1 3v3a5 5 0 0 1 -10 0v-3a6 6 0 0 1 1 -3", "key": "svg-1" }], ["path", { "d": "M3 13l4 0", "key": "svg-2" }], ["path", { "d": "M17 13l4 0", "key": "svg-3" }], ["path", { "d": "M12 20l0 -6", "key": "svg-4" }], ["path", { "d": "M4 19l3.35 -2", "key": "svg-5" }], ["path", { "d": "M20 19l-3.35 -2", "key": "svg-6" }], ["path", { "d": "M4 7l3.75 2.4", "key": "svg-7" }], ["path", { "d": "M20 7l-3.75 2.4", "key": "svg-8" }]];
+const IconBug = createReactComponent("outline", "bug", "Bug", __iconNode$1r);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11357,8 +11357,8 @@ const IconCategory = createReactComponent("outline", "category", "Category", __i
  */
 
 
-const __iconNode$1k = [["path", { "d": "M5 12l5 5l10 -10", "key": "svg-0" }]];
-const IconCheck = createReactComponent("outline", "check", "Check", __iconNode$1k);
+const __iconNode$1q = [["path", { "d": "M3 21l18 0", "key": "svg-0" }], ["path", { "d": "M9 8l1 0", "key": "svg-1" }], ["path", { "d": "M9 12l1 0", "key": "svg-2" }], ["path", { "d": "M9 16l1 0", "key": "svg-3" }], ["path", { "d": "M14 8l1 0", "key": "svg-4" }], ["path", { "d": "M14 12l1 0", "key": "svg-5" }], ["path", { "d": "M14 16l1 0", "key": "svg-6" }], ["path", { "d": "M5 21v-16a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v16", "key": "svg-7" }]];
+const IconBuilding = createReactComponent("outline", "building", "Building", __iconNode$1q);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11368,8 +11368,8 @@ const IconCheck = createReactComponent("outline", "check", "Check", __iconNode$1
  */
 
 
-const __iconNode$1j = [["path", { "d": "M7 12l5 5l10 -10", "key": "svg-0" }], ["path", { "d": "M2 12l5 5m5 -5l5 -5", "key": "svg-1" }]];
-const IconChecks = createReactComponent("outline", "checks", "Checks", __iconNode$1j);
+const __iconNode$1p = [["path", { "d": "M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12z", "key": "svg-0" }], ["path", { "d": "M16 3v4", "key": "svg-1" }], ["path", { "d": "M8 3v4", "key": "svg-2" }], ["path", { "d": "M4 11h16", "key": "svg-3" }], ["path", { "d": "M11 15h1", "key": "svg-4" }], ["path", { "d": "M12 15v3", "key": "svg-5" }]];
+const IconCalendar = createReactComponent("outline", "calendar", "Calendar", __iconNode$1p);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11379,8 +11379,8 @@ const IconChecks = createReactComponent("outline", "checks", "Checks", __iconNod
  */
 
 
-const __iconNode$1i = [["path", { "d": "M6 9l6 6l6 -6", "key": "svg-0" }]];
-const IconChevronDown = createReactComponent("outline", "chevron-down", "ChevronDown", __iconNode$1i);
+const __iconNode$1o = [["path", { "d": "M4 4h6v6h-6z", "key": "svg-0" }], ["path", { "d": "M14 4h6v6h-6z", "key": "svg-1" }], ["path", { "d": "M4 14h6v6h-6z", "key": "svg-2" }], ["path", { "d": "M17 17m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0", "key": "svg-3" }]];
+const IconCategory = createReactComponent("outline", "category", "Category", __iconNode$1o);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11390,8 +11390,8 @@ const IconChevronDown = createReactComponent("outline", "chevron-down", "Chevron
  */
 
 
-const __iconNode$1h = [["path", { "d": "M15 6l-6 6l6 6", "key": "svg-0" }]];
-const IconChevronLeft = createReactComponent("outline", "chevron-left", "ChevronLeft", __iconNode$1h);
+const __iconNode$1n = [["path", { "d": "M5 12l5 5l10 -10", "key": "svg-0" }]];
+const IconCheck = createReactComponent("outline", "check", "Check", __iconNode$1n);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11401,8 +11401,8 @@ const IconChevronLeft = createReactComponent("outline", "chevron-left", "Chevron
  */
 
 
-const __iconNode$1g = [["path", { "d": "M9 6l6 6l-6 6", "key": "svg-0" }]];
-const IconChevronRight = createReactComponent("outline", "chevron-right", "ChevronRight", __iconNode$1g);
+const __iconNode$1m = [["path", { "d": "M7 12l5 5l10 -10", "key": "svg-0" }], ["path", { "d": "M2 12l5 5m5 -5l5 -5", "key": "svg-1" }]];
+const IconChecks = createReactComponent("outline", "checks", "Checks", __iconNode$1m);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11412,8 +11412,8 @@ const IconChevronRight = createReactComponent("outline", "chevron-right", "Chevr
  */
 
 
-const __iconNode$1f = [["path", { "d": "M6 15l6 -6l6 6", "key": "svg-0" }]];
-const IconChevronUp = createReactComponent("outline", "chevron-up", "ChevronUp", __iconNode$1f);
+const __iconNode$1l = [["path", { "d": "M6 9l6 6l6 -6", "key": "svg-0" }]];
+const IconChevronDown = createReactComponent("outline", "chevron-down", "ChevronDown", __iconNode$1l);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11423,8 +11423,8 @@ const IconChevronUp = createReactComponent("outline", "chevron-up", "ChevronUp",
  */
 
 
-const __iconNode$1e = [["path", { "d": "M20.042 16.045a9 9 0 0 0 -12.087 -12.087m-2.318 1.677a9 9 0 1 0 12.725 12.73", "key": "svg-0" }], ["path", { "d": "M3 3l18 18", "key": "svg-1" }]];
-const IconCircleOff = createReactComponent("outline", "circle-off", "CircleOff", __iconNode$1e);
+const __iconNode$1k = [["path", { "d": "M15 6l-6 6l6 6", "key": "svg-0" }]];
+const IconChevronLeft = createReactComponent("outline", "chevron-left", "ChevronLeft", __iconNode$1k);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11434,8 +11434,8 @@ const IconCircleOff = createReactComponent("outline", "circle-off", "CircleOff",
  */
 
 
-const __iconNode$1d = [["path", { "d": "M8 6h12", "key": "svg-0" }], ["path", { "d": "M6 12h12", "key": "svg-1" }], ["path", { "d": "M4 18h12", "key": "svg-2" }]];
-const IconClearAll = createReactComponent("outline", "clear-all", "ClearAll", __iconNode$1d);
+const __iconNode$1j = [["path", { "d": "M9 6l6 6l-6 6", "key": "svg-0" }]];
+const IconChevronRight = createReactComponent("outline", "chevron-right", "ChevronRight", __iconNode$1j);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11445,8 +11445,8 @@ const IconClearAll = createReactComponent("outline", "clear-all", "ClearAll", __
  */
 
 
-const __iconNode$1c = [["path", { "d": "M9.58 5.548c.24 -.11 .492 -.207 .752 -.286c1.88 -.572 3.956 -.193 5.444 1c1.488 1.19 2.162 3.007 1.77 4.769h.99c1.913 0 3.464 1.56 3.464 3.486c0 .957 -.383 1.824 -1.003 2.454m-2.997 1.033h-11.343c-2.572 -.004 -4.657 -2.011 -4.657 -4.487c0 -2.475 2.085 -4.482 4.657 -4.482c.13 -.582 .37 -1.128 .7 -1.62", "key": "svg-0" }], ["path", { "d": "M3 3l18 18", "key": "svg-1" }]];
-const IconCloudOff = createReactComponent("outline", "cloud-off", "CloudOff", __iconNode$1c);
+const __iconNode$1i = [["path", { "d": "M6 15l6 -6l6 6", "key": "svg-0" }]];
+const IconChevronUp = createReactComponent("outline", "chevron-up", "ChevronUp", __iconNode$1i);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11456,8 +11456,8 @@ const IconCloudOff = createReactComponent("outline", "cloud-off", "CloudOff", __
  */
 
 
-const __iconNode$1b = [["path", { "d": "M6.657 18c-2.572 0 -4.657 -2.007 -4.657 -4.483c0 -2.475 2.085 -4.482 4.657 -4.482c.393 -1.762 1.794 -3.2 3.675 -3.773c1.88 -.572 3.956 -.193 5.444 1c1.488 1.19 2.162 3.007 1.77 4.769h.99c1.913 0 3.464 1.56 3.464 3.486c0 1.927 -1.551 3.487 -3.465 3.487h-11.878", "key": "svg-0" }]];
-const IconCloud = createReactComponent("outline", "cloud", "Cloud", __iconNode$1b);
+const __iconNode$1h = [["path", { "d": "M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0", "key": "svg-0" }], ["path", { "d": "M9 12l2 2l4 -4", "key": "svg-1" }]];
+const IconCircleCheck = createReactComponent("outline", "circle-check", "CircleCheck", __iconNode$1h);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11467,8 +11467,8 @@ const IconCloud = createReactComponent("outline", "cloud", "Cloud", __iconNode$1
  */
 
 
-const __iconNode$1a = [["path", { "d": "M7 8l-4 4l4 4", "key": "svg-0" }], ["path", { "d": "M17 8l4 4l-4 4", "key": "svg-1" }], ["path", { "d": "M14 4l-4 16", "key": "svg-2" }]];
-const IconCode = createReactComponent("outline", "code", "Code", __iconNode$1a);
+const __iconNode$1g = [["path", { "d": "M20.042 16.045a9 9 0 0 0 -12.087 -12.087m-2.318 1.677a9 9 0 1 0 12.725 12.73", "key": "svg-0" }], ["path", { "d": "M3 3l18 18", "key": "svg-1" }]];
+const IconCircleOff = createReactComponent("outline", "circle-off", "CircleOff", __iconNode$1g);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11478,8 +11478,8 @@ const IconCode = createReactComponent("outline", "code", "Code", __iconNode$1a);
  */
 
 
-const __iconNode$19 = [["path", { "d": "M7 7m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z", "key": "svg-0" }], ["path", { "d": "M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1", "key": "svg-1" }]];
-const IconCopy = createReactComponent("outline", "copy", "Copy", __iconNode$19);
+const __iconNode$1f = [["path", { "d": "M8 6h12", "key": "svg-0" }], ["path", { "d": "M6 12h12", "key": "svg-1" }], ["path", { "d": "M4 18h12", "key": "svg-2" }]];
+const IconClearAll = createReactComponent("outline", "clear-all", "ClearAll", __iconNode$1f);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11489,8 +11489,8 @@ const IconCopy = createReactComponent("outline", "copy", "Copy", __iconNode$19);
  */
 
 
-const __iconNode$18 = [["path", { "d": "M12 13m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-0" }], ["path", { "d": "M13.45 11.55l2.05 -2.05", "key": "svg-1" }], ["path", { "d": "M6.4 20a9 9 0 1 1 11.2 0z", "key": "svg-2" }]];
-const IconDashboard = createReactComponent("outline", "dashboard", "Dashboard", __iconNode$18);
+const __iconNode$1e = [["path", { "d": "M9.58 5.548c.24 -.11 .492 -.207 .752 -.286c1.88 -.572 3.956 -.193 5.444 1c1.488 1.19 2.162 3.007 1.77 4.769h.99c1.913 0 3.464 1.56 3.464 3.486c0 .957 -.383 1.824 -1.003 2.454m-2.997 1.033h-11.343c-2.572 -.004 -4.657 -2.011 -4.657 -4.487c0 -2.475 2.085 -4.482 4.657 -4.482c.13 -.582 .37 -1.128 .7 -1.62", "key": "svg-0" }], ["path", { "d": "M3 3l18 18", "key": "svg-1" }]];
+const IconCloudOff = createReactComponent("outline", "cloud-off", "CloudOff", __iconNode$1e);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11500,8 +11500,8 @@ const IconDashboard = createReactComponent("outline", "dashboard", "Dashboard",
  */
 
 
-const __iconNode$17 = [["path", { "d": "M12 6m-8 0a8 3 0 1 0 16 0a8 3 0 1 0 -16 0", "key": "svg-0" }], ["path", { "d": "M4 6v6a8 3 0 0 0 16 0v-6", "key": "svg-1" }], ["path", { "d": "M4 12v6a8 3 0 0 0 16 0v-6", "key": "svg-2" }]];
-const IconDatabase = createReactComponent("outline", "database", "Database", __iconNode$17);
+const __iconNode$1d = [["path", { "d": "M6.657 18c-2.572 0 -4.657 -2.007 -4.657 -4.483c0 -2.475 2.085 -4.482 4.657 -4.482c.393 -1.762 1.794 -3.2 3.675 -3.773c1.88 -.572 3.956 -.193 5.444 1c1.488 1.19 2.162 3.007 1.77 4.769h.99c1.913 0 3.464 1.56 3.464 3.486c0 1.927 -1.551 3.487 -3.465 3.487h-11.878", "key": "svg-0" }]];
+const IconCloud = createReactComponent("outline", "cloud", "Cloud", __iconNode$1d);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11511,8 +11511,8 @@ const IconDatabase = createReactComponent("outline", "database", "Database", __i
  */
 
 
-const __iconNode$16 = [["path", { "d": "M6 4h10l4 4v10a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2", "key": "svg-0" }], ["path", { "d": "M12 14m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-1" }], ["path", { "d": "M14 4l0 4l-6 0l0 -4", "key": "svg-2" }]];
-const IconDeviceFloppy = createReactComponent("outline", "device-floppy", "DeviceFloppy", __iconNode$16);
+const __iconNode$1c = [["path", { "d": "M7 8l-4 4l4 4", "key": "svg-0" }], ["path", { "d": "M17 8l4 4l-4 4", "key": "svg-1" }], ["path", { "d": "M14 4l-4 16", "key": "svg-2" }]];
+const IconCode = createReactComponent("outline", "code", "Code", __iconNode$1c);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11522,8 +11522,8 @@ const IconDeviceFloppy = createReactComponent("outline", "device-floppy", "Devic
  */
 
 
-const __iconNode$15 = [["path", { "d": "M3 19l18 0", "key": "svg-0" }], ["path", { "d": "M5 6m0 1a1 1 0 0 1 1 -1h12a1 1 0 0 1 1 1v8a1 1 0 0 1 -1 1h-12a1 1 0 0 1 -1 -1z", "key": "svg-1" }]];
-const IconDeviceLaptop = createReactComponent("outline", "device-laptop", "DeviceLaptop", __iconNode$15);
+const __iconNode$1b = [["path", { "d": "M7 7m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z", "key": "svg-0" }], ["path", { "d": "M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1", "key": "svg-1" }]];
+const IconCopy = createReactComponent("outline", "copy", "Copy", __iconNode$1b);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11533,8 +11533,8 @@ const IconDeviceLaptop = createReactComponent("outline", "device-laptop", "Devic
  */
 
 
-const __iconNode$14 = [["path", { "d": "M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-0" }], ["path", { "d": "M12 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-1" }], ["path", { "d": "M12 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-2" }]];
-const IconDotsVertical = createReactComponent("outline", "dots-vertical", "DotsVertical", __iconNode$14);
+const __iconNode$1a = [["path", { "d": "M12 13m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-0" }], ["path", { "d": "M13.45 11.55l2.05 -2.05", "key": "svg-1" }], ["path", { "d": "M6.4 20a9 9 0 1 1 11.2 0z", "key": "svg-2" }]];
+const IconDashboard = createReactComponent("outline", "dashboard", "Dashboard", __iconNode$1a);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11544,8 +11544,8 @@ const IconDotsVertical = createReactComponent("outline", "dots-vertical", "DotsV
  */
 
 
-const __iconNode$13 = [["path", { "d": "M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-2", "key": "svg-0" }], ["path", { "d": "M7 11l5 5l5 -5", "key": "svg-1" }], ["path", { "d": "M12 4l0 12", "key": "svg-2" }]];
-const IconDownload = createReactComponent("outline", "download", "Download", __iconNode$13);
+const __iconNode$19 = [["path", { "d": "M12 6m-8 0a8 3 0 1 0 16 0a8 3 0 1 0 -16 0", "key": "svg-0" }], ["path", { "d": "M4 6v6a8 3 0 0 0 16 0v-6", "key": "svg-1" }], ["path", { "d": "M4 12v6a8 3 0 0 0 16 0v-6", "key": "svg-2" }]];
+const IconDatabase = createReactComponent("outline", "database", "Database", __iconNode$19);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11555,8 +11555,8 @@ const IconDownload = createReactComponent("outline", "download", "Download", __i
  */
 
 
-const __iconNode$12 = [["path", { "d": "M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1", "key": "svg-0" }], ["path", { "d": "M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z", "key": "svg-1" }], ["path", { "d": "M16 5l3 3", "key": "svg-2" }]];
-const IconEdit = createReactComponent("outline", "edit", "Edit", __iconNode$12);
+const __iconNode$18 = [["path", { "d": "M6 4h10l4 4v10a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2", "key": "svg-0" }], ["path", { "d": "M12 14m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-1" }], ["path", { "d": "M14 4l0 4l-6 0l0 -4", "key": "svg-2" }]];
+const IconDeviceFloppy = createReactComponent("outline", "device-floppy", "DeviceFloppy", __iconNode$18);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11566,8 +11566,8 @@ const IconEdit = createReactComponent("outline", "edit", "Edit", __iconNode$12);
  */
 
 
-const __iconNode$11 = [["path", { "d": "M12 6h-6a2 2 0 0 0 -2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-6", "key": "svg-0" }], ["path", { "d": "M11 13l9 -9", "key": "svg-1" }], ["path", { "d": "M15 4h5v5", "key": "svg-2" }]];
-const IconExternalLink = createReactComponent("outline", "external-link", "ExternalLink", __iconNode$11);
+const __iconNode$17 = [["path", { "d": "M3 19l18 0", "key": "svg-0" }], ["path", { "d": "M5 6m0 1a1 1 0 0 1 1 -1h12a1 1 0 0 1 1 1v8a1 1 0 0 1 -1 1h-12a1 1 0 0 1 -1 -1z", "key": "svg-1" }]];
+const IconDeviceLaptop = createReactComponent("outline", "device-laptop", "DeviceLaptop", __iconNode$17);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11577,8 +11577,8 @@ const IconExternalLink = createReactComponent("outline", "external-link", "Exter
  */
 
 
-const __iconNode$10 = [["path", { "d": "M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0", "key": "svg-0" }], ["path", { "d": "M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6", "key": "svg-1" }]];
-const IconEye = createReactComponent("outline", "eye", "Eye", __iconNode$10);
+const __iconNode$16 = [["path", { "d": "M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-0" }], ["path", { "d": "M12 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-1" }], ["path", { "d": "M12 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-2" }]];
+const IconDotsVertical = createReactComponent("outline", "dots-vertical", "DotsVertical", __iconNode$16);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11588,8 +11588,8 @@ const IconEye = createReactComponent("outline", "eye", "Eye", __iconNode$10);
  */
 
 
-const __iconNode$$ = [["path", { "d": "M14 3v4a1 1 0 0 0 1 1h4", "key": "svg-0" }], ["path", { "d": "M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z", "key": "svg-1" }], ["path", { "d": "M12 11l0 6", "key": "svg-2" }], ["path", { "d": "M9 14l6 0", "key": "svg-3" }]];
-const IconFilePlus = createReactComponent("outline", "file-plus", "FilePlus", __iconNode$$);
+const __iconNode$15 = [["path", { "d": "M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-2", "key": "svg-0" }], ["path", { "d": "M7 11l5 5l5 -5", "key": "svg-1" }], ["path", { "d": "M12 4l0 12", "key": "svg-2" }]];
+const IconDownload = createReactComponent("outline", "download", "Download", __iconNode$15);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11599,8 +11599,8 @@ const IconFilePlus = createReactComponent("outline", "file-plus", "FilePlus", __
  */
 
 
-const __iconNode$_ = [["path", { "d": "M17 17m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0", "key": "svg-0" }], ["path", { "d": "M17 13v4h4", "key": "svg-1" }], ["path", { "d": "M12 3v4a1 1 0 0 0 1 1h4", "key": "svg-2" }], ["path", { "d": "M11.5 21h-6.5a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v2m0 3v4", "key": "svg-3" }]];
-const IconFileReport = createReactComponent("outline", "file-report", "FileReport", __iconNode$_);
+const __iconNode$14 = [["path", { "d": "M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1", "key": "svg-0" }], ["path", { "d": "M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z", "key": "svg-1" }], ["path", { "d": "M16 5l3 3", "key": "svg-2" }]];
+const IconEdit = createReactComponent("outline", "edit", "Edit", __iconNode$14);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11610,8 +11610,8 @@ const IconFileReport = createReactComponent("outline", "file-report", "FileRepor
  */
 
 
-const __iconNode$Z = [["path", { "d": "M14 3v4a1 1 0 0 0 1 1h4", "key": "svg-0" }], ["path", { "d": "M12 21h-5a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v4.5", "key": "svg-1" }], ["path", { "d": "M16.5 17.5m-2.5 0a2.5 2.5 0 1 0 5 0a2.5 2.5 0 1 0 -5 0", "key": "svg-2" }], ["path", { "d": "M18.5 19.5l2.5 2.5", "key": "svg-3" }]];
-const IconFileSearch = createReactComponent("outline", "file-search", "FileSearch", __iconNode$Z);
+const __iconNode$13 = [["path", { "d": "M12 6h-6a2 2 0 0 0 -2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-6", "key": "svg-0" }], ["path", { "d": "M11 13l9 -9", "key": "svg-1" }], ["path", { "d": "M15 4h5v5", "key": "svg-2" }]];
+const IconExternalLink = createReactComponent("outline", "external-link", "ExternalLink", __iconNode$13);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11621,8 +11621,8 @@ const IconFileSearch = createReactComponent("outline", "file-search", "FileSearc
  */
 
 
-const __iconNode$Y = [["path", { "d": "M14 3v4a1 1 0 0 0 1 1h4", "key": "svg-0" }], ["path", { "d": "M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z", "key": "svg-1" }]];
-const IconFile = createReactComponent("outline", "file", "File", __iconNode$Y);
+const __iconNode$12 = [["path", { "d": "M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0", "key": "svg-0" }], ["path", { "d": "M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6", "key": "svg-1" }]];
+const IconEye = createReactComponent("outline", "eye", "Eye", __iconNode$12);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11632,8 +11632,8 @@ const IconFile = createReactComponent("outline", "file", "File", __iconNode$Y);
  */
 
 
-const __iconNode$X = [["path", { "d": "M12 19h-7a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2h4l3 3h7a2 2 0 0 1 2 2v3.5", "key": "svg-0" }], ["path", { "d": "M16 19h6", "key": "svg-1" }], ["path", { "d": "M19 16v6", "key": "svg-2" }]];
-const IconFolderPlus = createReactComponent("outline", "folder-plus", "FolderPlus", __iconNode$X);
+const __iconNode$11 = [["path", { "d": "M14 3v4a1 1 0 0 0 1 1h4", "key": "svg-0" }], ["path", { "d": "M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z", "key": "svg-1" }], ["path", { "d": "M12 11l0 6", "key": "svg-2" }], ["path", { "d": "M9 14l6 0", "key": "svg-3" }]];
+const IconFilePlus = createReactComponent("outline", "file-plus", "FilePlus", __iconNode$11);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11643,8 +11643,8 @@ const IconFolderPlus = createReactComponent("outline", "folder-plus", "FolderPlu
  */
 
 
-const __iconNode$W = [["path", { "d": "M12 19h-7a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2h4l3 3h7a2 2 0 0 1 2 2v3.5", "key": "svg-0" }], ["path", { "d": "M19 22v-6", "key": "svg-1" }], ["path", { "d": "M22 19l-3 -3l-3 3", "key": "svg-2" }]];
-const IconFolderUp = createReactComponent("outline", "folder-up", "FolderUp", __iconNode$W);
+const __iconNode$10 = [["path", { "d": "M17 17m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0", "key": "svg-0" }], ["path", { "d": "M17 13v4h4", "key": "svg-1" }], ["path", { "d": "M12 3v4a1 1 0 0 0 1 1h4", "key": "svg-2" }], ["path", { "d": "M11.5 21h-6.5a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v2m0 3v4", "key": "svg-3" }]];
+const IconFileReport = createReactComponent("outline", "file-report", "FileReport", __iconNode$10);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11654,8 +11654,8 @@ const IconFolderUp = createReactComponent("outline", "folder-up", "FolderUp", __
  */
 
 
-const __iconNode$V = [["path", { "d": "M13.5 19h-8.5a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2h4l3 3h7a2 2 0 0 1 2 2v4", "key": "svg-0" }], ["path", { "d": "M22 22l-5 -5", "key": "svg-1" }], ["path", { "d": "M17 22l5 -5", "key": "svg-2" }]];
-const IconFolderX = createReactComponent("outline", "folder-x", "FolderX", __iconNode$V);
+const __iconNode$$ = [["path", { "d": "M14 3v4a1 1 0 0 0 1 1h4", "key": "svg-0" }], ["path", { "d": "M12 21h-5a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v4.5", "key": "svg-1" }], ["path", { "d": "M16.5 17.5m-2.5 0a2.5 2.5 0 1 0 5 0a2.5 2.5 0 1 0 -5 0", "key": "svg-2" }], ["path", { "d": "M18.5 19.5l2.5 2.5", "key": "svg-3" }]];
+const IconFileSearch = createReactComponent("outline", "file-search", "FileSearch", __iconNode$$);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11665,8 +11665,8 @@ const IconFolderX = createReactComponent("outline", "folder-x", "FolderX", __ico
  */
 
 
-const __iconNode$U = [["path", { "d": "M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2", "key": "svg-0" }]];
-const IconFolder = createReactComponent("outline", "folder", "Folder", __iconNode$U);
+const __iconNode$_ = [["path", { "d": "M14 3v4a1 1 0 0 0 1 1h4", "key": "svg-0" }], ["path", { "d": "M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z", "key": "svg-1" }]];
+const IconFile = createReactComponent("outline", "file", "File", __iconNode$_);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11676,8 +11676,8 @@ const IconFolder = createReactComponent("outline", "folder", "Folder", __iconNod
  */
 
 
-const __iconNode$T = [["path", { "d": "M7 18m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-0" }], ["path", { "d": "M7 6m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-1" }], ["path", { "d": "M17 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-2" }], ["path", { "d": "M7 8l0 8", "key": "svg-3" }], ["path", { "d": "M7 8a4 4 0 0 0 4 4h4", "key": "svg-4" }]];
-const IconGitMerge = createReactComponent("outline", "git-merge", "GitMerge", __iconNode$T);
+const __iconNode$Z = [["path", { "d": "M12 19h-7a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2h4l3 3h7a2 2 0 0 1 2 2v3.5", "key": "svg-0" }], ["path", { "d": "M16 19h6", "key": "svg-1" }], ["path", { "d": "M19 16v6", "key": "svg-2" }]];
+const IconFolderPlus = createReactComponent("outline", "folder-plus", "FolderPlus", __iconNode$Z);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11687,8 +11687,8 @@ const IconGitMerge = createReactComponent("outline", "git-merge", "GitMerge", __
  */
 
 
-const __iconNode$S = [["path", { "d": "M5 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-0" }], ["path", { "d": "M12 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-1" }], ["path", { "d": "M19 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-2" }], ["path", { "d": "M5 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-3" }], ["path", { "d": "M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-4" }], ["path", { "d": "M19 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-5" }], ["path", { "d": "M5 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-6" }], ["path", { "d": "M12 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-7" }], ["path", { "d": "M19 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-8" }]];
-const IconGridDots = createReactComponent("outline", "grid-dots", "GridDots", __iconNode$S);
+const __iconNode$Y = [["path", { "d": "M12 19h-7a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2h4l3 3h7a2 2 0 0 1 2 2v3.5", "key": "svg-0" }], ["path", { "d": "M19 22v-6", "key": "svg-1" }], ["path", { "d": "M22 19l-3 -3l-3 3", "key": "svg-2" }]];
+const IconFolderUp = createReactComponent("outline", "folder-up", "FolderUp", __iconNode$Y);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11698,8 +11698,8 @@ const IconGridDots = createReactComponent("outline", "grid-dots", "GridDots", __
  */
 
 
-const __iconNode$R = [["path", { "d": "M9 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-0" }], ["path", { "d": "M9 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-1" }], ["path", { "d": "M9 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-2" }], ["path", { "d": "M15 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-3" }], ["path", { "d": "M15 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-4" }], ["path", { "d": "M15 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-5" }]];
-const IconGripVertical = createReactComponent("outline", "grip-vertical", "GripVertical", __iconNode$R);
+const __iconNode$X = [["path", { "d": "M13.5 19h-8.5a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2h4l3 3h7a2 2 0 0 1 2 2v4", "key": "svg-0" }], ["path", { "d": "M22 22l-5 -5", "key": "svg-1" }], ["path", { "d": "M17 22l5 -5", "key": "svg-2" }]];
+const IconFolderX = createReactComponent("outline", "folder-x", "FolderX", __iconNode$X);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11709,8 +11709,8 @@ const IconGripVertical = createReactComponent("outline", "grip-vertical", "GripV
  */
 
 
-const __iconNode$Q = [["path", { "d": "M19 14a2 2 0 1 0 0 4a2 2 0 0 0 0 -4z", "key": "svg-0" }], ["path", { "d": "M21 12a2 2 0 1 0 -4 0v4", "key": "svg-1" }], ["path", { "d": "M4 6v12", "key": "svg-2" }], ["path", { "d": "M12 6v12", "key": "svg-3" }], ["path", { "d": "M11 18h2", "key": "svg-4" }], ["path", { "d": "M3 18h2", "key": "svg-5" }], ["path", { "d": "M4 12h8", "key": "svg-6" }], ["path", { "d": "M3 6h2", "key": "svg-7" }], ["path", { "d": "M11 6h2", "key": "svg-8" }]];
-const IconH6 = createReactComponent("outline", "h-6", "H6", __iconNode$Q);
+const __iconNode$W = [["path", { "d": "M5 4h4l3 3h7a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-11a2 2 0 0 1 2 -2", "key": "svg-0" }]];
+const IconFolder = createReactComponent("outline", "folder", "Folder", __iconNode$W);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11720,8 +11720,8 @@ const IconH6 = createReactComponent("outline", "h-6", "H6", __iconNode$Q);
  */
 
 
-const __iconNode$P = [["path", { "d": "M5 12l-2 0l9 -9l9 9l-2 0", "key": "svg-0" }], ["path", { "d": "M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-7", "key": "svg-1" }], ["path", { "d": "M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v6", "key": "svg-2" }]];
-const IconHome = createReactComponent("outline", "home", "Home", __iconNode$P);
+const __iconNode$V = [["path", { "d": "M7 18m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-0" }], ["path", { "d": "M7 6m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-1" }], ["path", { "d": "M17 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-2" }], ["path", { "d": "M7 8l0 8", "key": "svg-3" }], ["path", { "d": "M7 8a4 4 0 0 0 4 4h4", "key": "svg-4" }]];
+const IconGitMerge = createReactComponent("outline", "git-merge", "GitMerge", __iconNode$V);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11731,8 +11731,8 @@ const IconHome = createReactComponent("outline", "home", "Home", __iconNode$P);
  */
 
 
-const __iconNode$O = [["path", { "d": "M3 4m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v10a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z", "key": "svg-0" }], ["path", { "d": "M9 10m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-1" }], ["path", { "d": "M15 8l2 0", "key": "svg-2" }], ["path", { "d": "M15 12l2 0", "key": "svg-3" }], ["path", { "d": "M7 16l10 0", "key": "svg-4" }]];
-const IconId = createReactComponent("outline", "id", "Id", __iconNode$O);
+const __iconNode$U = [["path", { "d": "M5 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-0" }], ["path", { "d": "M12 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-1" }], ["path", { "d": "M19 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-2" }], ["path", { "d": "M5 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-3" }], ["path", { "d": "M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-4" }], ["path", { "d": "M19 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-5" }], ["path", { "d": "M5 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-6" }], ["path", { "d": "M12 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-7" }], ["path", { "d": "M19 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-8" }]];
+const IconGridDots = createReactComponent("outline", "grid-dots", "GridDots", __iconNode$U);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11742,8 +11742,8 @@ const IconId = createReactComponent("outline", "id", "Id", __iconNode$O);
  */
 
 
-const __iconNode$N = [["path", { "d": "M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0", "key": "svg-0" }], ["path", { "d": "M12 9h.01", "key": "svg-1" }], ["path", { "d": "M11 12h1v4h1", "key": "svg-2" }]];
-const IconInfoCircle = createReactComponent("outline", "info-circle", "InfoCircle", __iconNode$N);
+const __iconNode$T = [["path", { "d": "M9 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-0" }], ["path", { "d": "M9 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-1" }], ["path", { "d": "M9 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-2" }], ["path", { "d": "M15 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-3" }], ["path", { "d": "M15 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-4" }], ["path", { "d": "M15 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-5" }]];
+const IconGripVertical = createReactComponent("outline", "grip-vertical", "GripVertical", __iconNode$T);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11753,8 +11753,8 @@ const IconInfoCircle = createReactComponent("outline", "info-circle", "InfoCircl
  */
 
 
-const __iconNode$M = [["path", { "d": "M12 9h.01", "key": "svg-0" }], ["path", { "d": "M3 5a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-14z", "key": "svg-1" }], ["path", { "d": "M11 12h1v4h1", "key": "svg-2" }]];
-const IconInfoSquare = createReactComponent("outline", "info-square", "InfoSquare", __iconNode$M);
+const __iconNode$S = [["path", { "d": "M19 14a2 2 0 1 0 0 4a2 2 0 0 0 0 -4z", "key": "svg-0" }], ["path", { "d": "M21 12a2 2 0 1 0 -4 0v4", "key": "svg-1" }], ["path", { "d": "M4 6v12", "key": "svg-2" }], ["path", { "d": "M12 6v12", "key": "svg-3" }], ["path", { "d": "M11 18h2", "key": "svg-4" }], ["path", { "d": "M3 18h2", "key": "svg-5" }], ["path", { "d": "M4 12h8", "key": "svg-6" }], ["path", { "d": "M3 6h2", "key": "svg-7" }], ["path", { "d": "M11 6h2", "key": "svg-8" }]];
+const IconH6 = createReactComponent("outline", "h-6", "H6", __iconNode$S);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11764,8 +11764,8 @@ const IconInfoSquare = createReactComponent("outline", "info-square", "InfoSquar
  */
 
 
-const __iconNode$L = [["path", { "d": "M16.555 3.843l3.602 3.602a2.877 2.877 0 0 1 0 4.069l-2.643 2.643a2.877 2.877 0 0 1 -4.069 0l-.301 -.301l-6.558 6.558a2 2 0 0 1 -1.239 .578l-.175 .008h-1.172a1 1 0 0 1 -.993 -.883l-.007 -.117v-1.172a2 2 0 0 1 .467 -1.284l.119 -.13l.414 -.414h2v-2h2v-2l2.144 -2.144l-.301 -.301a2.877 2.877 0 0 1 0 -4.069l2.643 -2.643a2.877 2.877 0 0 1 4.069 0z", "key": "svg-0" }], ["path", { "d": "M15 9h.01", "key": "svg-1" }]];
-const IconKey = createReactComponent("outline", "key", "Key", __iconNode$L);
+const __iconNode$R = [["path", { "d": "M5 12l-2 0l9 -9l9 9l-2 0", "key": "svg-0" }], ["path", { "d": "M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-7", "key": "svg-1" }], ["path", { "d": "M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v6", "key": "svg-2" }]];
+const IconHome = createReactComponent("outline", "home", "Home", __iconNode$R);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11775,8 +11775,8 @@ const IconKey = createReactComponent("outline", "key", "Key", __iconNode$L);
  */
 
 
-const __iconNode$K = [["path", { "d": "M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v2a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z", "key": "svg-0" }], ["path", { "d": "M4 14m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v2a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z", "key": "svg-1" }]];
-const IconLayoutList = createReactComponent("outline", "layout-list", "LayoutList", __iconNode$K);
+const __iconNode$Q = [["path", { "d": "M3 4m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v10a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z", "key": "svg-0" }], ["path", { "d": "M9 10m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-1" }], ["path", { "d": "M15 8l2 0", "key": "svg-2" }], ["path", { "d": "M15 12l2 0", "key": "svg-3" }], ["path", { "d": "M7 16l10 0", "key": "svg-4" }]];
+const IconId = createReactComponent("outline", "id", "Id", __iconNode$Q);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11786,8 +11786,8 @@ const IconLayoutList = createReactComponent("outline", "layout-list", "LayoutLis
  */
 
 
-const __iconNode$J = [["path", { "d": "M9 15l6 -6", "key": "svg-0" }], ["path", { "d": "M11 6l.463 -.536a5 5 0 0 1 7.071 7.072l-.534 .464", "key": "svg-1" }], ["path", { "d": "M13 18l-.397 .534a5.068 5.068 0 0 1 -7.127 0a4.972 4.972 0 0 1 0 -7.071l.524 -.463", "key": "svg-2" }]];
-const IconLink = createReactComponent("outline", "link", "Link", __iconNode$J);
+const __iconNode$P = [["path", { "d": "M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0", "key": "svg-0" }], ["path", { "d": "M12 9h.01", "key": "svg-1" }], ["path", { "d": "M11 12h1v4h1", "key": "svg-2" }]];
+const IconInfoCircle = createReactComponent("outline", "info-circle", "InfoCircle", __iconNode$P);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11797,8 +11797,8 @@ const IconLink = createReactComponent("outline", "link", "Link", __iconNode$J);
  */
 
 
-const __iconNode$I = [["path", { "d": "M4 8v-2c0 -.554 .225 -1.055 .588 -1.417", "key": "svg-0" }], ["path", { "d": "M4 16v2a2 2 0 0 0 2 2h2", "key": "svg-1" }], ["path", { "d": "M16 4h2a2 2 0 0 1 2 2v2", "key": "svg-2" }], ["path", { "d": "M16 20h2c.55 0 1.05 -.222 1.41 -.582", "key": "svg-3" }], ["path", { "d": "M15 11a1 1 0 0 1 1 1m-.29 3.704a1 1 0 0 1 -.71 .296h-6a1 1 0 0 1 -1 -1v-3a1 1 0 0 1 1 -1h2", "key": "svg-4" }], ["path", { "d": "M10 11v-1m1.182 -2.826a2 2 0 0 1 2.818 1.826v1", "key": "svg-5" }], ["path", { "d": "M3 3l18 18", "key": "svg-6" }]];
-const IconLockAccessOff = createReactComponent("outline", "lock-access-off", "LockAccessOff", __iconNode$I);
+const __iconNode$O = [["path", { "d": "M12 9h.01", "key": "svg-0" }], ["path", { "d": "M3 5a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-14z", "key": "svg-1" }], ["path", { "d": "M11 12h1v4h1", "key": "svg-2" }]];
+const IconInfoSquare = createReactComponent("outline", "info-square", "InfoSquare", __iconNode$O);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11808,8 +11808,8 @@ const IconLockAccessOff = createReactComponent("outline", "lock-access-off", "Lo
  */
 
 
-const __iconNode$H = [["path", { "d": "M4 8v-2a2 2 0 0 1 2 -2h2", "key": "svg-0" }], ["path", { "d": "M4 16v2a2 2 0 0 0 2 2h2", "key": "svg-1" }], ["path", { "d": "M16 4h2a2 2 0 0 1 2 2v2", "key": "svg-2" }], ["path", { "d": "M16 20h2a2 2 0 0 0 2 -2v-2", "key": "svg-3" }], ["path", { "d": "M8 11m0 1a1 1 0 0 1 1 -1h6a1 1 0 0 1 1 1v3a1 1 0 0 1 -1 1h-6a1 1 0 0 1 -1 -1z", "key": "svg-4" }], ["path", { "d": "M10 11v-2a2 2 0 1 1 4 0v2", "key": "svg-5" }]];
-const IconLockAccess = createReactComponent("outline", "lock-access", "LockAccess", __iconNode$H);
+const __iconNode$N = [["path", { "d": "M16.555 3.843l3.602 3.602a2.877 2.877 0 0 1 0 4.069l-2.643 2.643a2.877 2.877 0 0 1 -4.069 0l-.301 -.301l-6.558 6.558a2 2 0 0 1 -1.239 .578l-.175 .008h-1.172a1 1 0 0 1 -.993 -.883l-.007 -.117v-1.172a2 2 0 0 1 .467 -1.284l.119 -.13l.414 -.414h2v-2h2v-2l2.144 -2.144l-.301 -.301a2.877 2.877 0 0 1 0 -4.069l2.643 -2.643a2.877 2.877 0 0 1 4.069 0z", "key": "svg-0" }], ["path", { "d": "M15 9h.01", "key": "svg-1" }]];
+const IconKey = createReactComponent("outline", "key", "Key", __iconNode$N);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11819,8 +11819,8 @@ const IconLockAccess = createReactComponent("outline", "lock-access", "LockAcces
  */
 
 
-const __iconNode$G = [["path", { "d": "M11.5 21h-4.5a2 2 0 0 1 -2 -2v-6a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v.5", "key": "svg-0" }], ["path", { "d": "M11 16a1 1 0 1 0 2 0a1 1 0 0 0 -2 0", "key": "svg-1" }], ["path", { "d": "M8 11v-4a4 4 0 1 1 8 0v4", "key": "svg-2" }], ["path", { "d": "M15 19l2 2l4 -4", "key": "svg-3" }]];
-const IconLockCheck = createReactComponent("outline", "lock-check", "LockCheck", __iconNode$G);
+const __iconNode$M = [["path", { "d": "M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z", "key": "svg-0" }], ["path", { "d": "M4 15l16 0", "key": "svg-1" }]];
+const IconLayoutBottombar = createReactComponent("outline", "layout-bottombar", "LayoutBottombar", __iconNode$M);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11830,8 +11830,8 @@ const IconLockCheck = createReactComponent("outline", "lock-check", "LockCheck",
  */
 
 
-const __iconNode$F = [["path", { "d": "M5 11m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v6a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z", "key": "svg-0" }], ["path", { "d": "M12 16m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-1" }], ["path", { "d": "M8 11v-5a4 4 0 0 1 8 0", "key": "svg-2" }]];
-const IconLockOpen = createReactComponent("outline", "lock-open", "LockOpen", __iconNode$F);
+const __iconNode$L = [["path", { "d": "M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v2a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z", "key": "svg-0" }], ["path", { "d": "M4 14m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v2a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z", "key": "svg-1" }]];
+const IconLayoutList = createReactComponent("outline", "layout-list", "LayoutList", __iconNode$L);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11841,8 +11841,8 @@ const IconLockOpen = createReactComponent("outline", "lock-open", "LockOpen", __
  */
 
 
-const __iconNode$E = [["path", { "d": "M5 13a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v6a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-6z", "key": "svg-0" }], ["path", { "d": "M11 16a1 1 0 1 0 2 0a1 1 0 0 0 -2 0", "key": "svg-1" }], ["path", { "d": "M8 11v-4a4 4 0 1 1 8 0v4", "key": "svg-2" }]];
-const IconLock = createReactComponent("outline", "lock", "Lock", __iconNode$E);
+const __iconNode$K = [["path", { "d": "M9 15l6 -6", "key": "svg-0" }], ["path", { "d": "M11 6l.463 -.536a5 5 0 0 1 7.071 7.072l-.534 .464", "key": "svg-1" }], ["path", { "d": "M13 18l-.397 .534a5.068 5.068 0 0 1 -7.127 0a4.972 4.972 0 0 1 0 -7.071l.524 -.463", "key": "svg-2" }]];
+const IconLink = createReactComponent("outline", "link", "Link", __iconNode$K);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11852,8 +11852,8 @@ const IconLock = createReactComponent("outline", "lock", "Lock", __iconNode$E);
  */
 
 
-const __iconNode$D = [["path", { "d": "M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2", "key": "svg-0" }], ["path", { "d": "M9 12h12l-3 -3", "key": "svg-1" }], ["path", { "d": "M18 15l3 -3", "key": "svg-2" }]];
-const IconLogout = createReactComponent("outline", "logout", "Logout", __iconNode$D);
+const __iconNode$J = [["path", { "d": "M4 8v-2c0 -.554 .225 -1.055 .588 -1.417", "key": "svg-0" }], ["path", { "d": "M4 16v2a2 2 0 0 0 2 2h2", "key": "svg-1" }], ["path", { "d": "M16 4h2a2 2 0 0 1 2 2v2", "key": "svg-2" }], ["path", { "d": "M16 20h2c.55 0 1.05 -.222 1.41 -.582", "key": "svg-3" }], ["path", { "d": "M15 11a1 1 0 0 1 1 1m-.29 3.704a1 1 0 0 1 -.71 .296h-6a1 1 0 0 1 -1 -1v-3a1 1 0 0 1 1 -1h2", "key": "svg-4" }], ["path", { "d": "M10 11v-1m1.182 -2.826a2 2 0 0 1 2.818 1.826v1", "key": "svg-5" }], ["path", { "d": "M3 3l18 18", "key": "svg-6" }]];
+const IconLockAccessOff = createReactComponent("outline", "lock-access-off", "LockAccessOff", __iconNode$J);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11863,8 +11863,8 @@ const IconLogout = createReactComponent("outline", "logout", "Logout", __iconNod
  */
 
 
-const __iconNode$C = [["path", { "d": "M11 19h-6a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v6", "key": "svg-0" }], ["path", { "d": "M3 7l9 6l9 -6", "key": "svg-1" }], ["path", { "d": "M20 21l2 -2l-2 -2", "key": "svg-2" }], ["path", { "d": "M17 17l-2 2l2 2", "key": "svg-3" }]];
-const IconMailCode = createReactComponent("outline", "mail-code", "MailCode", __iconNode$C);
+const __iconNode$I = [["path", { "d": "M4 8v-2a2 2 0 0 1 2 -2h2", "key": "svg-0" }], ["path", { "d": "M4 16v2a2 2 0 0 0 2 2h2", "key": "svg-1" }], ["path", { "d": "M16 4h2a2 2 0 0 1 2 2v2", "key": "svg-2" }], ["path", { "d": "M16 20h2a2 2 0 0 0 2 -2v-2", "key": "svg-3" }], ["path", { "d": "M8 11m0 1a1 1 0 0 1 1 -1h6a1 1 0 0 1 1 1v3a1 1 0 0 1 -1 1h-6a1 1 0 0 1 -1 -1z", "key": "svg-4" }], ["path", { "d": "M10 11v-2a2 2 0 1 1 4 0v2", "key": "svg-5" }]];
+const IconLockAccess = createReactComponent("outline", "lock-access", "LockAccess", __iconNode$I);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11874,8 +11874,8 @@ const IconMailCode = createReactComponent("outline", "mail-code", "MailCode", __
  */
 
 
-const __iconNode$B = [["path", { "d": "M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10z", "key": "svg-0" }], ["path", { "d": "M3 7l9 6l9 -6", "key": "svg-1" }]];
-const IconMail = createReactComponent("outline", "mail", "Mail", __iconNode$B);
+const __iconNode$H = [["path", { "d": "M11.5 21h-4.5a2 2 0 0 1 -2 -2v-6a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v.5", "key": "svg-0" }], ["path", { "d": "M11 16a1 1 0 1 0 2 0a1 1 0 0 0 -2 0", "key": "svg-1" }], ["path", { "d": "M8 11v-4a4 4 0 1 1 8 0v4", "key": "svg-2" }], ["path", { "d": "M15 19l2 2l4 -4", "key": "svg-3" }]];
+const IconLockCheck = createReactComponent("outline", "lock-check", "LockCheck", __iconNode$H);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11885,8 +11885,8 @@ const IconMail = createReactComponent("outline", "mail", "Mail", __iconNode$B);
  */
 
 
-const __iconNode$A = [["path", { "d": "M4 6l16 0", "key": "svg-0" }], ["path", { "d": "M4 12l16 0", "key": "svg-1" }], ["path", { "d": "M4 18l16 0", "key": "svg-2" }]];
-const IconMenu2 = createReactComponent("outline", "menu-2", "Menu2", __iconNode$A);
+const __iconNode$G = [["path", { "d": "M5 11m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v6a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z", "key": "svg-0" }], ["path", { "d": "M12 16m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-1" }], ["path", { "d": "M8 11v-5a4 4 0 0 1 8 0", "key": "svg-2" }]];
+const IconLockOpen = createReactComponent("outline", "lock-open", "LockOpen", __iconNode$G);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11896,8 +11896,8 @@ const IconMenu2 = createReactComponent("outline", "menu-2", "Menu2", __iconNode$
  */
 
 
-const __iconNode$z = [["path", { "d": "M4 8l16 0", "key": "svg-0" }], ["path", { "d": "M4 16l16 0", "key": "svg-1" }]];
-const IconMenu = createReactComponent("outline", "menu", "Menu", __iconNode$z);
+const __iconNode$F = [["path", { "d": "M5 13a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v6a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-6z", "key": "svg-0" }], ["path", { "d": "M11 16a1 1 0 1 0 2 0a1 1 0 0 0 -2 0", "key": "svg-1" }], ["path", { "d": "M8 11v-4a4 4 0 1 1 8 0v4", "key": "svg-2" }]];
+const IconLock = createReactComponent("outline", "lock", "Lock", __iconNode$F);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11907,8 +11907,8 @@ const IconMenu = createReactComponent("outline", "menu", "Menu", __iconNode$z);
  */
 
 
-const __iconNode$y = [["path", { "d": "M6 9a6 6 0 1 0 12 0a6 6 0 0 0 -12 0", "key": "svg-0" }], ["path", { "d": "M12 3c1.333 .333 2 2.333 2 6s-.667 5.667 -2 6", "key": "svg-1" }], ["path", { "d": "M12 3c-1.333 .333 -2 2.333 -2 6s.667 5.667 2 6", "key": "svg-2" }], ["path", { "d": "M6 9h12", "key": "svg-3" }], ["path", { "d": "M3 20h7", "key": "svg-4" }], ["path", { "d": "M14 20h7", "key": "svg-5" }], ["path", { "d": "M10 20a2 2 0 1 0 4 0a2 2 0 0 0 -4 0", "key": "svg-6" }], ["path", { "d": "M12 15v3", "key": "svg-7" }]];
-const IconNetwork = createReactComponent("outline", "network", "Network", __iconNode$y);
+const __iconNode$E = [["path", { "d": "M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2", "key": "svg-0" }], ["path", { "d": "M9 12h12l-3 -3", "key": "svg-1" }], ["path", { "d": "M18 15l3 -3", "key": "svg-2" }]];
+const IconLogout = createReactComponent("outline", "logout", "Logout", __iconNode$E);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11918,8 +11918,8 @@ const IconNetwork = createReactComponent("outline", "network", "Network", __icon
  */
 
 
-const __iconNode$x = [["path", { "d": "M12 10v4", "key": "svg-0" }], ["path", { "d": "M10 13l4 -2", "key": "svg-1" }], ["path", { "d": "M10 11l4 2", "key": "svg-2" }], ["path", { "d": "M5 10v4", "key": "svg-3" }], ["path", { "d": "M3 13l4 -2", "key": "svg-4" }], ["path", { "d": "M3 11l4 2", "key": "svg-5" }], ["path", { "d": "M19 10v4", "key": "svg-6" }], ["path", { "d": "M17 13l4 -2", "key": "svg-7" }], ["path", { "d": "M17 11l4 2", "key": "svg-8" }]];
-const IconPassword = createReactComponent("outline", "password", "Password", __iconNode$x);
+const __iconNode$D = [["path", { "d": "M11 19h-6a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v6", "key": "svg-0" }], ["path", { "d": "M3 7l9 6l9 -6", "key": "svg-1" }], ["path", { "d": "M20 21l2 -2l-2 -2", "key": "svg-2" }], ["path", { "d": "M17 17l-2 2l2 2", "key": "svg-3" }]];
+const IconMailCode = createReactComponent("outline", "mail-code", "MailCode", __iconNode$D);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11929,8 +11929,8 @@ const IconPassword = createReactComponent("outline", "password", "Password", __i
  */
 
 
-const __iconNode$w = [["path", { "d": "M6 5m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v12a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z", "key": "svg-0" }], ["path", { "d": "M14 5m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v12a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z", "key": "svg-1" }]];
-const IconPlayerPause = createReactComponent("outline", "player-pause", "PlayerPause", __iconNode$w);
+const __iconNode$C = [["path", { "d": "M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10z", "key": "svg-0" }], ["path", { "d": "M3 7l9 6l9 -6", "key": "svg-1" }]];
+const IconMail = createReactComponent("outline", "mail", "Mail", __iconNode$C);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11940,8 +11940,8 @@ const IconPlayerPause = createReactComponent("outline", "player-pause", "PlayerP
  */
 
 
-const __iconNode$v = [["path", { "d": "M7 4v16l13 -8z", "key": "svg-0" }]];
-const IconPlayerPlay = createReactComponent("outline", "player-play", "PlayerPlay", __iconNode$v);
+const __iconNode$B = [["path", { "d": "M4 6l16 0", "key": "svg-0" }], ["path", { "d": "M4 12l16 0", "key": "svg-1" }], ["path", { "d": "M4 18l16 0", "key": "svg-2" }]];
+const IconMenu2 = createReactComponent("outline", "menu-2", "Menu2", __iconNode$B);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11951,8 +11951,8 @@ const IconPlayerPlay = createReactComponent("outline", "player-play", "PlayerPla
  */
 
 
-const __iconNode$u = [["path", { "d": "M20 16l-4 4", "key": "svg-0" }], ["path", { "d": "M7 12l5 5l-1.5 1.5a3.536 3.536 0 1 1 -5 -5l1.5 -1.5z", "key": "svg-1" }], ["path", { "d": "M17 12l-5 -5l1.5 -1.5a3.536 3.536 0 1 1 5 5l-1.5 1.5z", "key": "svg-2" }], ["path", { "d": "M3 21l2.5 -2.5", "key": "svg-3" }], ["path", { "d": "M18.5 5.5l2.5 -2.5", "key": "svg-4" }], ["path", { "d": "M10 11l-2 2", "key": "svg-5" }], ["path", { "d": "M13 14l-2 2", "key": "svg-6" }], ["path", { "d": "M16 16l4 4", "key": "svg-7" }]];
-const IconPlugConnectedX = createReactComponent("outline", "plug-connected-x", "PlugConnectedX", __iconNode$u);
+const __iconNode$A = [["path", { "d": "M4 8l16 0", "key": "svg-0" }], ["path", { "d": "M4 16l16 0", "key": "svg-1" }]];
+const IconMenu = createReactComponent("outline", "menu", "Menu", __iconNode$A);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11962,8 +11962,8 @@ const IconPlugConnectedX = createReactComponent("outline", "plug-connected-x", "
  */
 
 
-const __iconNode$t = [["path", { "d": "M7 12l5 5l-1.5 1.5a3.536 3.536 0 1 1 -5 -5l1.5 -1.5z", "key": "svg-0" }], ["path", { "d": "M17 12l-5 -5l1.5 -1.5a3.536 3.536 0 1 1 5 5l-1.5 1.5z", "key": "svg-1" }], ["path", { "d": "M3 21l2.5 -2.5", "key": "svg-2" }], ["path", { "d": "M18.5 5.5l2.5 -2.5", "key": "svg-3" }], ["path", { "d": "M10 11l-2 2", "key": "svg-4" }], ["path", { "d": "M13 14l-2 2", "key": "svg-5" }]];
-const IconPlugConnected = createReactComponent("outline", "plug-connected", "PlugConnected", __iconNode$t);
+const __iconNode$z = [["path", { "d": "M8 9h8", "key": "svg-0" }], ["path", { "d": "M8 13h6", "key": "svg-1" }], ["path", { "d": "M18 4a3 3 0 0 1 3 3v8a3 3 0 0 1 -3 3h-5l-5 3v-3h-2a3 3 0 0 1 -3 -3v-8a3 3 0 0 1 3 -3h12z", "key": "svg-2" }]];
+const IconMessage = createReactComponent("outline", "message", "Message", __iconNode$z);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11973,8 +11973,8 @@ const IconPlugConnected = createReactComponent("outline", "plug-connected", "Plu
  */
 
 
-const __iconNode$s = [["path", { "d": "M12 5l0 14", "key": "svg-0" }], ["path", { "d": "M5 12l14 0", "key": "svg-1" }]];
-const IconPlus = createReactComponent("outline", "plus", "Plus", __iconNode$s);
+const __iconNode$y = [["path", { "d": "M12 10v4", "key": "svg-0" }], ["path", { "d": "M10 13l4 -2", "key": "svg-1" }], ["path", { "d": "M10 11l4 2", "key": "svg-2" }], ["path", { "d": "M5 10v4", "key": "svg-3" }], ["path", { "d": "M3 13l4 -2", "key": "svg-4" }], ["path", { "d": "M3 11l4 2", "key": "svg-5" }], ["path", { "d": "M19 10v4", "key": "svg-6" }], ["path", { "d": "M17 13l4 -2", "key": "svg-7" }], ["path", { "d": "M17 11l4 2", "key": "svg-8" }]];
+const IconPassword = createReactComponent("outline", "password", "Password", __iconNode$y);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11984,8 +11984,8 @@ const IconPlus = createReactComponent("outline", "plus", "Plus", __iconNode$s);
  */
 
 
-const __iconNode$r = [["path", { "d": "M17 17h2a2 2 0 0 0 2 -2v-4a2 2 0 0 0 -2 -2h-14a2 2 0 0 0 -2 2v4a2 2 0 0 0 2 2h2", "key": "svg-0" }], ["path", { "d": "M17 9v-4a2 2 0 0 0 -2 -2h-6a2 2 0 0 0 -2 2v4", "key": "svg-1" }], ["path", { "d": "M7 13m0 2a2 2 0 0 1 2 -2h6a2 2 0 0 1 2 2v4a2 2 0 0 1 -2 2h-6a2 2 0 0 1 -2 -2z", "key": "svg-2" }]];
-const IconPrinter = createReactComponent("outline", "printer", "Printer", __iconNode$r);
+const __iconNode$x = [["path", { "d": "M6 5m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v12a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z", "key": "svg-0" }], ["path", { "d": "M14 5m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v12a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z", "key": "svg-1" }]];
+const IconPlayerPause = createReactComponent("outline", "player-pause", "PlayerPause", __iconNode$x);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -11995,8 +11995,8 @@ const IconPrinter = createReactComponent("outline", "printer", "Printer", __icon
  */
 
 
-const __iconNode$q = [["path", { "d": "M20 11a8.1 8.1 0 0 0 -15.5 -2m-.5 -4v4h4", "key": "svg-0" }], ["path", { "d": "M4 13a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4", "key": "svg-1" }]];
-const IconRefresh = createReactComponent("outline", "refresh", "Refresh", __iconNode$q);
+const __iconNode$w = [["path", { "d": "M7 4v16l13 -8z", "key": "svg-0" }]];
+const IconPlayerPlay = createReactComponent("outline", "player-play", "PlayerPlay", __iconNode$w);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12006,8 +12006,8 @@ const IconRefresh = createReactComponent("outline", "refresh", "Refresh", __icon
  */
 
 
-const __iconNode$p = [["path", { "d": "M6 4m0 2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v4a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z", "key": "svg-0" }], ["path", { "d": "M12 2v2", "key": "svg-1" }], ["path", { "d": "M9 12v9", "key": "svg-2" }], ["path", { "d": "M15 12v9", "key": "svg-3" }], ["path", { "d": "M5 16l4 -2", "key": "svg-4" }], ["path", { "d": "M15 14l4 2", "key": "svg-5" }], ["path", { "d": "M9 18h6", "key": "svg-6" }], ["path", { "d": "M10 8v.01", "key": "svg-7" }], ["path", { "d": "M14 8v.01", "key": "svg-8" }]];
-const IconRobot = createReactComponent("outline", "robot", "Robot", __iconNode$p);
+const __iconNode$v = [["path", { "d": "M20 16l-4 4", "key": "svg-0" }], ["path", { "d": "M7 12l5 5l-1.5 1.5a3.536 3.536 0 1 1 -5 -5l1.5 -1.5z", "key": "svg-1" }], ["path", { "d": "M17 12l-5 -5l1.5 -1.5a3.536 3.536 0 1 1 5 5l-1.5 1.5z", "key": "svg-2" }], ["path", { "d": "M3 21l2.5 -2.5", "key": "svg-3" }], ["path", { "d": "M18.5 5.5l2.5 -2.5", "key": "svg-4" }], ["path", { "d": "M10 11l-2 2", "key": "svg-5" }], ["path", { "d": "M13 14l-2 2", "key": "svg-6" }], ["path", { "d": "M16 16l4 4", "key": "svg-7" }]];
+const IconPlugConnectedX = createReactComponent("outline", "plug-connected-x", "PlugConnectedX", __iconNode$v);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12017,8 +12017,8 @@ const IconRobot = createReactComponent("outline", "robot", "Robot", __iconNode$p
  */
 
 
-const __iconNode$o = [["path", { "d": "M10 10m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0", "key": "svg-0" }], ["path", { "d": "M21 21l-6 -6", "key": "svg-1" }]];
-const IconSearch = createReactComponent("outline", "search", "Search", __iconNode$o);
+const __iconNode$u = [["path", { "d": "M7 12l5 5l-1.5 1.5a3.536 3.536 0 1 1 -5 -5l1.5 -1.5z", "key": "svg-0" }], ["path", { "d": "M17 12l-5 -5l1.5 -1.5a3.536 3.536 0 1 1 5 5l-1.5 1.5z", "key": "svg-1" }], ["path", { "d": "M3 21l2.5 -2.5", "key": "svg-2" }], ["path", { "d": "M18.5 5.5l2.5 -2.5", "key": "svg-3" }], ["path", { "d": "M10 11l-2 2", "key": "svg-4" }], ["path", { "d": "M13 14l-2 2", "key": "svg-5" }]];
+const IconPlugConnected = createReactComponent("outline", "plug-connected", "PlugConnected", __iconNode$u);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12028,8 +12028,8 @@ const IconSearch = createReactComponent("outline", "search", "Search", __iconNod
  */
 
 
-const __iconNode$n = [["path", { "d": "M10 14l11 -11", "key": "svg-0" }], ["path", { "d": "M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5", "key": "svg-1" }]];
-const IconSend = createReactComponent("outline", "send", "Send", __iconNode$n);
+const __iconNode$t = [["path", { "d": "M12 5l0 14", "key": "svg-0" }], ["path", { "d": "M5 12l14 0", "key": "svg-1" }]];
+const IconPlus = createReactComponent("outline", "plus", "Plus", __iconNode$t);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12039,8 +12039,8 @@ const IconSend = createReactComponent("outline", "send", "Send", __iconNode$n);
  */
 
 
-const __iconNode$m = [["path", { "d": "M3 4m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v2a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z", "key": "svg-0" }], ["path", { "d": "M3 12m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v2a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z", "key": "svg-1" }], ["path", { "d": "M7 8l0 .01", "key": "svg-2" }], ["path", { "d": "M7 16l0 .01", "key": "svg-3" }]];
-const IconServer = createReactComponent("outline", "server", "Server", __iconNode$m);
+const __iconNode$s = [["path", { "d": "M17 17h2a2 2 0 0 0 2 -2v-4a2 2 0 0 0 -2 -2h-14a2 2 0 0 0 -2 2v4a2 2 0 0 0 2 2h2", "key": "svg-0" }], ["path", { "d": "M17 9v-4a2 2 0 0 0 -2 -2h-6a2 2 0 0 0 -2 2v4", "key": "svg-1" }], ["path", { "d": "M7 13m0 2a2 2 0 0 1 2 -2h6a2 2 0 0 1 2 2v4a2 2 0 0 1 -2 2h-6a2 2 0 0 1 -2 -2z", "key": "svg-2" }]];
+const IconPrinter = createReactComponent("outline", "printer", "Printer", __iconNode$s);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12050,8 +12050,8 @@ const IconServer = createReactComponent("outline", "server", "Server", __iconNod
  */
 
 
-const __iconNode$l = [["path", { "d": "M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z", "key": "svg-0" }], ["path", { "d": "M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0", "key": "svg-1" }]];
-const IconSettings = createReactComponent("outline", "settings", "Settings", __iconNode$l);
+const __iconNode$r = [["path", { "d": "M20 11a8.1 8.1 0 0 0 -15.5 -2m-.5 -4v4h4", "key": "svg-0" }], ["path", { "d": "M4 13a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4", "key": "svg-1" }]];
+const IconRefresh = createReactComponent("outline", "refresh", "Refresh", __iconNode$r);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12061,8 +12061,8 @@ const IconSettings = createReactComponent("outline", "settings", "Settings", __i
  */
 
 
-const __iconNode$k = [["path", { "d": "M11.46 20.846a12 12 0 0 1 -7.96 -14.846a12 12 0 0 0 8.5 -3a12 12 0 0 0 8.5 3a12 12 0 0 1 -.09 7.06", "key": "svg-0" }], ["path", { "d": "M15 19l2 2l4 -4", "key": "svg-1" }]];
-const IconShieldCheck = createReactComponent("outline", "shield-check", "ShieldCheck", __iconNode$k);
+const __iconNode$q = [["path", { "d": "M6 4m0 2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v4a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z", "key": "svg-0" }], ["path", { "d": "M12 2v2", "key": "svg-1" }], ["path", { "d": "M9 12v9", "key": "svg-2" }], ["path", { "d": "M15 12v9", "key": "svg-3" }], ["path", { "d": "M5 16l4 -2", "key": "svg-4" }], ["path", { "d": "M15 14l4 2", "key": "svg-5" }], ["path", { "d": "M9 18h6", "key": "svg-6" }], ["path", { "d": "M10 8v.01", "key": "svg-7" }], ["path", { "d": "M14 8v.01", "key": "svg-8" }]];
+const IconRobot = createReactComponent("outline", "robot", "Robot", __iconNode$q);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12072,8 +12072,8 @@ const IconShieldCheck = createReactComponent("outline", "shield-check", "ShieldC
  */
 
 
-const __iconNode$j = [["path", { "d": "M12 3a12 12 0 0 0 8.5 3a12 12 0 0 1 -8.5 15a12 12 0 0 1 -8.5 -15a12 12 0 0 0 8.5 -3", "key": "svg-0" }], ["path", { "d": "M12 11m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-1" }], ["path", { "d": "M12 12l0 2.5", "key": "svg-2" }]];
-const IconShieldLock = createReactComponent("outline", "shield-lock", "ShieldLock", __iconNode$j);
+const __iconNode$p = [["path", { "d": "M10 10m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0", "key": "svg-0" }], ["path", { "d": "M21 21l-6 -6", "key": "svg-1" }]];
+const IconSearch = createReactComponent("outline", "search", "Search", __iconNode$p);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12083,8 +12083,8 @@ const IconShieldLock = createReactComponent("outline", "shield-lock", "ShieldLoc
  */
 
 
-const __iconNode$i = [["path", { "d": "M17.67 17.667a12 12 0 0 1 -5.67 3.333a12 12 0 0 1 -8.5 -15c.794 .036 1.583 -.006 2.357 -.124m3.128 -.926a11.997 11.997 0 0 0 3.015 -1.95a12 12 0 0 0 8.5 3a12 12 0 0 1 -1.116 9.376", "key": "svg-0" }], ["path", { "d": "M3 3l18 18", "key": "svg-1" }]];
-const IconShieldOff = createReactComponent("outline", "shield-off", "ShieldOff", __iconNode$i);
+const __iconNode$o = [["path", { "d": "M10 14l11 -11", "key": "svg-0" }], ["path", { "d": "M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5", "key": "svg-1" }]];
+const IconSend = createReactComponent("outline", "send", "Send", __iconNode$o);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12094,8 +12094,8 @@ const IconShieldOff = createReactComponent("outline", "shield-off", "ShieldOff",
  */
 
 
-const __iconNode$h = [["path", { "d": "M12 3a12 12 0 0 0 8.5 3a12 12 0 0 1 -8.5 15a12 12 0 0 1 -8.5 -15a12 12 0 0 0 8.5 -3", "key": "svg-0" }]];
-const IconShield = createReactComponent("outline", "shield", "Shield", __iconNode$h);
+const __iconNode$n = [["path", { "d": "M3 4m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v2a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z", "key": "svg-0" }], ["path", { "d": "M3 12m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v2a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z", "key": "svg-1" }], ["path", { "d": "M7 8l0 .01", "key": "svg-2" }], ["path", { "d": "M7 16l0 .01", "key": "svg-3" }]];
+const IconServer = createReactComponent("outline", "server", "Server", __iconNode$n);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12105,8 +12105,8 @@ const IconShield = createReactComponent("outline", "shield", "Shield", __iconNod
  */
 
 
-const __iconNode$g = [["path", { "d": "M16 18a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2zm0 -12a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2zm-7 12a6 6 0 0 1 6 -6a6 6 0 0 1 -6 -6a6 6 0 0 1 -6 6a6 6 0 0 1 6 6z", "key": "svg-0" }]];
-const IconSparkles = createReactComponent("outline", "sparkles", "Sparkles", __iconNode$g);
+const __iconNode$m = [["path", { "d": "M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z", "key": "svg-0" }], ["path", { "d": "M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0", "key": "svg-1" }]];
+const IconSettings = createReactComponent("outline", "settings", "Settings", __iconNode$m);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12116,8 +12116,8 @@ const IconSparkles = createReactComponent("outline", "sparkles", "Sparkles", __i
  */
 
 
-const __iconNode$f = [["path", { "d": "M4 4m0 1a1 1 0 0 1 1 -1h14a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-14a1 1 0 0 1 -1 -1z", "key": "svg-0" }], ["path", { "d": "M4 12m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v6a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z", "key": "svg-1" }], ["path", { "d": "M14 12l6 0", "key": "svg-2" }], ["path", { "d": "M14 16l6 0", "key": "svg-3" }], ["path", { "d": "M14 20l6 0", "key": "svg-4" }]];
-const IconTemplate = createReactComponent("outline", "template", "Template", __iconNode$f);
+const __iconNode$l = [["path", { "d": "M11.46 20.846a12 12 0 0 1 -7.96 -14.846a12 12 0 0 0 8.5 -3a12 12 0 0 0 8.5 3a12 12 0 0 1 -.09 7.06", "key": "svg-0" }], ["path", { "d": "M15 19l2 2l4 -4", "key": "svg-1" }]];
+const IconShieldCheck = createReactComponent("outline", "shield-check", "ShieldCheck", __iconNode$l);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12127,8 +12127,8 @@ const IconTemplate = createReactComponent("outline", "template", "Template", __i
  */
 
 
-const __iconNode$e = [["path", { "d": "M5 7l5 5l-5 5", "key": "svg-0" }], ["path", { "d": "M12 19l7 0", "key": "svg-1" }]];
-const IconTerminal = createReactComponent("outline", "terminal", "Terminal", __iconNode$e);
+const __iconNode$k = [["path", { "d": "M12 3a12 12 0 0 0 8.5 3a12 12 0 0 1 -8.5 15a12 12 0 0 1 -8.5 -15a12 12 0 0 0 8.5 -3", "key": "svg-0" }], ["path", { "d": "M12 11m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-1" }], ["path", { "d": "M12 12l0 2.5", "key": "svg-2" }]];
+const IconShieldLock = createReactComponent("outline", "shield-lock", "ShieldLock", __iconNode$k);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12138,8 +12138,8 @@ const IconTerminal = createReactComponent("outline", "terminal", "Terminal", __i
  */
 
 
-const __iconNode$d = [["path", { "d": "M4 15h16", "key": "svg-0" }], ["path", { "d": "M4 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z", "key": "svg-1" }], ["path", { "d": "M4 20h12", "key": "svg-2" }]];
-const IconTextCaption = createReactComponent("outline", "text-caption", "TextCaption", __iconNode$d);
+const __iconNode$j = [["path", { "d": "M17.67 17.667a12 12 0 0 1 -5.67 3.333a12 12 0 0 1 -8.5 -15c.794 .036 1.583 -.006 2.357 -.124m3.128 -.926a11.997 11.997 0 0 0 3.015 -1.95a12 12 0 0 0 8.5 3a12 12 0 0 1 -1.116 9.376", "key": "svg-0" }], ["path", { "d": "M3 3l18 18", "key": "svg-1" }]];
+const IconShieldOff = createReactComponent("outline", "shield-off", "ShieldOff", __iconNode$j);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12149,8 +12149,8 @@ const IconTextCaption = createReactComponent("outline", "text-caption", "TextCap
  */
 
 
-const __iconNode$c = [["path", { "d": "M4 7l16 0", "key": "svg-0" }], ["path", { "d": "M10 11l0 6", "key": "svg-1" }], ["path", { "d": "M14 11l0 6", "key": "svg-2" }], ["path", { "d": "M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12", "key": "svg-3" }], ["path", { "d": "M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3", "key": "svg-4" }]];
-const IconTrash = createReactComponent("outline", "trash", "Trash", __iconNode$c);
+const __iconNode$i = [["path", { "d": "M12 3a12 12 0 0 0 8.5 3a12 12 0 0 1 -8.5 15a12 12 0 0 1 -8.5 -15a12 12 0 0 0 8.5 -3", "key": "svg-0" }]];
+const IconShield = createReactComponent("outline", "shield", "Shield", __iconNode$i);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12160,8 +12160,8 @@ const IconTrash = createReactComponent("outline", "trash", "Trash", __iconNode$c
  */
 
 
-const __iconNode$b = [["path", { "d": "M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-2", "key": "svg-0" }], ["path", { "d": "M7 9l5 -5l5 5", "key": "svg-1" }], ["path", { "d": "M12 4l0 12", "key": "svg-2" }]];
-const IconUpload = createReactComponent("outline", "upload", "Upload", __iconNode$b);
+const __iconNode$h = [["path", { "d": "M16 18a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2zm0 -12a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2zm-7 12a6 6 0 0 1 6 -6a6 6 0 0 1 -6 -6a6 6 0 0 1 -6 6a6 6 0 0 1 6 6z", "key": "svg-0" }]];
+const IconSparkles = createReactComponent("outline", "sparkles", "Sparkles", __iconNode$h);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12171,8 +12171,8 @@ const IconUpload = createReactComponent("outline", "upload", "Upload", __iconNod
  */
 
 
-const __iconNode$a = [["path", { "d": "M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0", "key": "svg-0" }], ["path", { "d": "M6 21v-2a4 4 0 0 1 4 -4h4", "key": "svg-1" }], ["path", { "d": "M15 19l2 2l4 -4", "key": "svg-2" }]];
-const IconUserCheck = createReactComponent("outline", "user-check", "UserCheck", __iconNode$a);
+const __iconNode$g = [["path", { "d": "M4 4m0 1a1 1 0 0 1 1 -1h14a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-14a1 1 0 0 1 -1 -1z", "key": "svg-0" }], ["path", { "d": "M4 12m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v6a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z", "key": "svg-1" }], ["path", { "d": "M14 12l6 0", "key": "svg-2" }], ["path", { "d": "M14 16l6 0", "key": "svg-3" }], ["path", { "d": "M14 20l6 0", "key": "svg-4" }]];
+const IconTemplate = createReactComponent("outline", "template", "Template", __iconNode$g);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12182,8 +12182,8 @@ const IconUserCheck = createReactComponent("outline", "user-check", "UserCheck",
  */
 
 
-const __iconNode$9 = [["path", { "d": "M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0", "key": "svg-0" }], ["path", { "d": "M12 10m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0", "key": "svg-1" }], ["path", { "d": "M6.168 18.849a4 4 0 0 1 3.832 -2.849h4a4 4 0 0 1 3.834 2.855", "key": "svg-2" }]];
-const IconUserCircle = createReactComponent("outline", "user-circle", "UserCircle", __iconNode$9);
+const __iconNode$f = [["path", { "d": "M5 7l5 5l-5 5", "key": "svg-0" }], ["path", { "d": "M12 19l7 0", "key": "svg-1" }]];
+const IconTerminal = createReactComponent("outline", "terminal", "Terminal", __iconNode$f);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12193,8 +12193,8 @@ const IconUserCircle = createReactComponent("outline", "user-circle", "UserCircl
  */
 
 
-const __iconNode$8 = [["path", { "d": "M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0", "key": "svg-0" }], ["path", { "d": "M16 19h6", "key": "svg-1" }], ["path", { "d": "M19 16v6", "key": "svg-2" }], ["path", { "d": "M6 21v-2a4 4 0 0 1 4 -4h4", "key": "svg-3" }]];
-const IconUserPlus = createReactComponent("outline", "user-plus", "UserPlus", __iconNode$8);
+const __iconNode$e = [["path", { "d": "M4 15h16", "key": "svg-0" }], ["path", { "d": "M4 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z", "key": "svg-1" }], ["path", { "d": "M4 20h12", "key": "svg-2" }]];
+const IconTextCaption = createReactComponent("outline", "text-caption", "TextCaption", __iconNode$e);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12204,8 +12204,8 @@ const IconUserPlus = createReactComponent("outline", "user-plus", "UserPlus", __
  */
 
 
-const __iconNode$7 = [["path", { "d": "M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0", "key": "svg-0" }], ["path", { "d": "M6 21v-2a4 4 0 0 1 4 -4h.5", "key": "svg-1" }], ["path", { "d": "M17.8 20.817l-2.172 1.138a.392 .392 0 0 1 -.568 -.41l.415 -2.411l-1.757 -1.707a.389 .389 0 0 1 .217 -.665l2.428 -.352l1.086 -2.193a.392 .392 0 0 1 .702 0l1.086 2.193l2.428 .352a.39 .39 0 0 1 .217 .665l-1.757 1.707l.414 2.41a.39 .39 0 0 1 -.567 .411l-2.172 -1.138z", "key": "svg-2" }]];
-const IconUserStar = createReactComponent("outline", "user-star", "UserStar", __iconNode$7);
+const __iconNode$d = [["path", { "d": "M4 7l16 0", "key": "svg-0" }], ["path", { "d": "M10 11l0 6", "key": "svg-1" }], ["path", { "d": "M14 11l0 6", "key": "svg-2" }], ["path", { "d": "M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12", "key": "svg-3" }], ["path", { "d": "M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3", "key": "svg-4" }]];
+const IconTrash = createReactComponent("outline", "trash", "Trash", __iconNode$d);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12215,8 +12215,8 @@ const IconUserStar = createReactComponent("outline", "user-star", "UserStar", __
  */
 
 
-const __iconNode$6 = [["path", { "d": "M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0", "key": "svg-0" }], ["path", { "d": "M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2", "key": "svg-1" }]];
-const IconUser = createReactComponent("outline", "user", "User", __iconNode$6);
+const __iconNode$c = [["path", { "d": "M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-2", "key": "svg-0" }], ["path", { "d": "M7 9l5 -5l5 5", "key": "svg-1" }], ["path", { "d": "M12 4l0 12", "key": "svg-2" }]];
+const IconUpload = createReactComponent("outline", "upload", "Upload", __iconNode$c);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12226,8 +12226,8 @@ const IconUser = createReactComponent("outline", "user", "User", __iconNode$6);
  */
 
 
-const __iconNode$5 = [["path", { "d": "M10 13a2 2 0 1 0 4 0a2 2 0 0 0 -4 0", "key": "svg-0" }], ["path", { "d": "M8 21v-1a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v1", "key": "svg-1" }], ["path", { "d": "M15 5a2 2 0 1 0 4 0a2 2 0 0 0 -4 0", "key": "svg-2" }], ["path", { "d": "M17 10h2a2 2 0 0 1 2 2v1", "key": "svg-3" }], ["path", { "d": "M5 5a2 2 0 1 0 4 0a2 2 0 0 0 -4 0", "key": "svg-4" }], ["path", { "d": "M3 13v-1a2 2 0 0 1 2 -2h2", "key": "svg-5" }]];
-const IconUsersGroup = createReactComponent("outline", "users-group", "UsersGroup", __iconNode$5);
+const __iconNode$b = [["path", { "d": "M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0", "key": "svg-0" }], ["path", { "d": "M6 21v-2a4 4 0 0 1 4 -4h4", "key": "svg-1" }], ["path", { "d": "M15 19l2 2l4 -4", "key": "svg-2" }]];
+const IconUserCheck = createReactComponent("outline", "user-check", "UserCheck", __iconNode$b);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12237,8 +12237,8 @@ const IconUsersGroup = createReactComponent("outline", "users-group", "UsersGrou
  */
 
 
-const __iconNode$4 = [["path", { "d": "M9 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0", "key": "svg-0" }], ["path", { "d": "M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2", "key": "svg-1" }], ["path", { "d": "M16 3.13a4 4 0 0 1 0 7.75", "key": "svg-2" }], ["path", { "d": "M21 21v-2a4 4 0 0 0 -3 -3.85", "key": "svg-3" }]];
-const IconUsers = createReactComponent("outline", "users", "Users", __iconNode$4);
+const __iconNode$a = [["path", { "d": "M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0", "key": "svg-0" }], ["path", { "d": "M12 10m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0", "key": "svg-1" }], ["path", { "d": "M6.168 18.849a4 4 0 0 1 3.832 -2.849h4a4 4 0 0 1 3.834 2.855", "key": "svg-2" }]];
+const IconUserCircle = createReactComponent("outline", "user-circle", "UserCircle", __iconNode$a);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12248,8 +12248,74 @@ const IconUsers = createReactComponent("outline", "users", "Users", __iconNode$4
  */
 
 
-const __iconNode$3 = [["path", { "d": "M5 4c-2.5 5 -2.5 10 0 16m14 -16c2.5 5 2.5 10 0 16m-10 -11h1c1 0 1 1 2.016 3.527c.984 2.473 .984 3.473 1.984 3.473h1", "key": "svg-0" }], ["path", { "d": "M8 16c1.5 0 3 -2 4 -3.5s2.5 -3.5 4 -3.5", "key": "svg-1" }]];
-const IconVariable = createReactComponent("outline", "variable", "Variable", __iconNode$3);
+const __iconNode$9 = [["path", { "d": "M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0", "key": "svg-0" }], ["path", { "d": "M16 19h6", "key": "svg-1" }], ["path", { "d": "M19 16v6", "key": "svg-2" }], ["path", { "d": "M6 21v-2a4 4 0 0 1 4 -4h4", "key": "svg-3" }]];
+const IconUserPlus = createReactComponent("outline", "user-plus", "UserPlus", __iconNode$9);
+
+/**
+ * @license @tabler/icons-react v3.36.0 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$8 = [["path", { "d": "M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0", "key": "svg-0" }], ["path", { "d": "M6 21v-2a4 4 0 0 1 4 -4h.5", "key": "svg-1" }], ["path", { "d": "M17.8 20.817l-2.172 1.138a.392 .392 0 0 1 -.568 -.41l.415 -2.411l-1.757 -1.707a.389 .389 0 0 1 .217 -.665l2.428 -.352l1.086 -2.193a.392 .392 0 0 1 .702 0l1.086 2.193l2.428 .352a.39 .39 0 0 1 .217 .665l-1.757 1.707l.414 2.41a.39 .39 0 0 1 -.567 .411l-2.172 -1.138z", "key": "svg-2" }]];
+const IconUserStar = createReactComponent("outline", "user-star", "UserStar", __iconNode$8);
+
+/**
+ * @license @tabler/icons-react v3.36.0 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$7 = [["path", { "d": "M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0", "key": "svg-0" }], ["path", { "d": "M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2", "key": "svg-1" }]];
+const IconUser = createReactComponent("outline", "user", "User", __iconNode$7);
+
+/**
+ * @license @tabler/icons-react v3.36.0 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$6 = [["path", { "d": "M10 13a2 2 0 1 0 4 0a2 2 0 0 0 -4 0", "key": "svg-0" }], ["path", { "d": "M8 21v-1a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v1", "key": "svg-1" }], ["path", { "d": "M15 5a2 2 0 1 0 4 0a2 2 0 0 0 -4 0", "key": "svg-2" }], ["path", { "d": "M17 10h2a2 2 0 0 1 2 2v1", "key": "svg-3" }], ["path", { "d": "M5 5a2 2 0 1 0 4 0a2 2 0 0 0 -4 0", "key": "svg-4" }], ["path", { "d": "M3 13v-1a2 2 0 0 1 2 -2h2", "key": "svg-5" }]];
+const IconUsersGroup = createReactComponent("outline", "users-group", "UsersGroup", __iconNode$6);
+
+/**
+ * @license @tabler/icons-react v3.36.0 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$5 = [["path", { "d": "M9 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0", "key": "svg-0" }], ["path", { "d": "M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2", "key": "svg-1" }], ["path", { "d": "M16 3.13a4 4 0 0 1 0 7.75", "key": "svg-2" }], ["path", { "d": "M21 21v-2a4 4 0 0 0 -3 -3.85", "key": "svg-3" }]];
+const IconUsers = createReactComponent("outline", "users", "Users", __iconNode$5);
+
+/**
+ * @license @tabler/icons-react v3.36.0 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$4 = [["path", { "d": "M5 4c-2.5 5 -2.5 10 0 16m14 -16c2.5 5 2.5 10 0 16m-10 -11h1c1 0 1 1 2.016 3.527c.984 2.473 .984 3.473 1.984 3.473h1", "key": "svg-0" }], ["path", { "d": "M8 16c1.5 0 3 -2 4 -3.5s2.5 -3.5 4 -3.5", "key": "svg-1" }]];
+const IconVariable = createReactComponent("outline", "variable", "Variable", __iconNode$4);
+
+/**
+ * @license @tabler/icons-react v3.36.0 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$3 = [["path", { "d": "M12 3c-3.866 0 -7 3.272 -7 7v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1 -1v-10c0 -3.728 -3.134 -7 -7 -7z", "key": "svg-0" }], ["path", { "d": "M5 13l14 0", "key": "svg-1" }], ["path", { "d": "M12 3l0 18", "key": "svg-2" }]];
+const IconWindow = createReactComponent("outline", "window", "Window", __iconNode$3);
 
 /**
  * @license @tabler/icons-react v3.36.0 - MIT
@@ -12334,7 +12400,6 @@ function SearchBar(props) {
   const searchPosition = (_d = (_c = props.shellUi.search) === null || _c === void 0 ? void 0 : _c.searchPosition) !== null && _d !== void 0 ? _d : ShellUISearchPosition.Left;
   const isCenterPosition = searchPosition === ShellUISearchPosition.Center;
   // Dimensioni diverse in base alla posizione
-  const searchWidth = isCenterPosition ? 800 : 280;
   const searchSize = isCenterPosition ? 'sm' : 'sm';
   const iconSize = isCenterPosition ? 18 : 18;
   // Carica le actions dal menu come fa lo Spotlight, mantenendo i gruppi
@@ -12455,6 +12520,10 @@ function SearchBar(props) {
   if (searchType === ShellUISearchType.Spotlight) {
     return jsx(Box, {
       visibleFrom: 'sm',
+      style: isCenterPosition ? {
+        width: '100%',
+        maxWidth: '800px'
+      } : undefined,
       children: jsx(TextInput, {
         disabled: props.disabled,
         size: searchSize,
@@ -12464,7 +12533,7 @@ function SearchBar(props) {
           size: iconSize
         }),
         rightSectionWidth: isCenterPosition ? 0 : 90,
-        w: searchWidth,
+        w: isCenterPosition ? '100%' : 280,
         rightSection: rightSection,
         styles: {
           input: {
@@ -12495,6 +12564,10 @@ function SearchBar(props) {
   // Dropdown Type (nuovo)
   return jsx(Box, {
     visibleFrom: 'sm',
+    style: isCenterPosition ? {
+      width: '100%',
+      maxWidth: '800px'
+    } : undefined,
     children: jsxs(Popover, {
       opened: dropdownOpened,
       onChange: setDropdownOpened,
@@ -12520,7 +12593,7 @@ function SearchBar(props) {
             size: iconSize
           }),
           rightSectionWidth: isCenterPosition ? 0 : 90,
-          w: searchWidth,
+          w: isCenterPosition ? '100%' : 280,
           rightSection: rightSection,
           styles: {
             input: {
@@ -12747,7 +12820,7 @@ function FrontendSwitch(props) {
 }
 
 function AppBar(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
   const {
     userInfo
   } = useSelector(state => state.user);
@@ -12836,14 +12909,19 @@ function AppBar(props) {
     children: jsx(Stack, {
       gap: 0,
       children: jsxs(Group, {
-        px: 16,
-        justify: 'space-between',
+        px: 'md',
         wrap: "nowrap",
+        gap: "md",
         style: {
           height: '48px',
-          backgroundColor: (_b = (_a = props.previewMode) === null || _a === void 0 ? void 0 : _a.headerColor) !== null && _b !== void 0 ? _b : fluxoTheme.colors['brand'][7]
+          backgroundColor: (_b = (_a = props.previewMode) === null || _a === void 0 ? void 0 : _a.headerColor) !== null && _b !== void 0 ? _b : fluxoTheme.colors['brand'][7],
+          display: 'flex',
+          justifyContent: ((_d = (_c = props.shellUi.search) === null || _c === void 0 ? void 0 : _c.searchPosition) !== null && _d !== void 0 ? _d : ShellUISearchPosition.Left) === ShellUISearchPosition.Center ? 'flex-start' : 'space-between'
         },
         children: [jsxs(Group, {
+          style: {
+            flexShrink: 0
+          },
           children: [(props.shellUi.navigation === ShellUINavigation.Sidebar || props.shellUi.navigation === ShellUINavigation.SidebarMinimal || isMobile) && jsx(Burger, {
             tabIndex: -1,
             disabled: props.previewMode !== undefined,
@@ -12857,20 +12935,23 @@ function AppBar(props) {
             tabIndex: -1,
             to: props.previewMode ? '' : '/',
             style: {
-              maxHeight: (_d = (_c = props.previewMode) === null || _c === void 0 ? void 0 : _c.logoHeight) !== null && _d !== void 0 ? _d : configuration.logoHeight
+              maxHeight: (_f = (_e = props.previewMode) === null || _e === void 0 ? void 0 : _e.logoHeight) !== null && _f !== void 0 ? _f : configuration.logoHeight
             },
             children: jsx("img", {
-              src: ((_e = props.previewMode) === null || _e === void 0 ? void 0 : _e.logo) ? props.previewMode.logo : configuration.logo,
+              src: ((_g = props.previewMode) === null || _g === void 0 ? void 0 : _g.logo) ? props.previewMode.logo : configuration.logo,
               style: {
-                maxHeight: (_g = (_f = props.previewMode) === null || _f === void 0 ? void 0 : _f.logoHeight) !== null && _g !== void 0 ? _g : configuration.logoHeight
+                maxHeight: (_j = (_h = props.previewMode) === null || _h === void 0 ? void 0 : _h.logoHeight) !== null && _j !== void 0 ? _j : configuration.logoHeight
               }
             })
           })]
-        }), ((_j = (_h = props.shellUi.search) === null || _h === void 0 ? void 0 : _h.searchPosition) !== null && _j !== void 0 ? _j : ShellUISearchPosition.Left) === ShellUISearchPosition.Center && jsx(Box, {
+        }), ((_l = (_k = props.shellUi.search) === null || _k === void 0 ? void 0 : _k.searchPosition) !== null && _l !== void 0 ? _l : ShellUISearchPosition.Left) === ShellUISearchPosition.Center && jsx(Box, {
           style: {
-            position: 'absolute',
-            left: '50%',
-            transform: 'translateX(-50%)'
+            flex: '1 1 auto',
+            display: 'flex',
+            justifyContent: 'center',
+            minWidth: 0,
+            maxWidth: '800px',
+            margin: '0 auto'
           },
           children: jsx(SearchBar, {
             disabled: props.previewMode !== undefined,
@@ -12878,6 +12959,9 @@ function AppBar(props) {
           })
         }), jsxs(Group, {
           wrap: "nowrap",
+          style: {
+            flexShrink: 0
+          },
           children: [developmentMode && jsx(Badge, {
             tabIndex: -1,
             color: 'red',
@@ -12940,7 +13024,7 @@ function AppBar(props) {
                 })
               })
             })]
-          }), (((_l = (_k = props.shellUi.search) === null || _k === void 0 ? void 0 : _k.searchPosition) !== null && _l !== void 0 ? _l : ShellUISearchPosition.Left) === ShellUISearchPosition.Left || ((_o = (_m = props.shellUi.search) === null || _m === void 0 ? void 0 : _m.searchPosition) !== null && _o !== void 0 ? _o : ShellUISearchPosition.Left) === ShellUISearchPosition.Right) && jsx(SearchBar, {
+          }), (((_o = (_m = props.shellUi.search) === null || _m === void 0 ? void 0 : _m.searchPosition) !== null && _o !== void 0 ? _o : ShellUISearchPosition.Left) === ShellUISearchPosition.Left || ((_q = (_p = props.shellUi.search) === null || _p === void 0 ? void 0 : _p.searchPosition) !== null && _q !== void 0 ? _q : ShellUISearchPosition.Left) === ShellUISearchPosition.Right) && jsx(SearchBar, {
             disabled: props.previewMode !== undefined,
             shellUi: props.shellUi
           }), jsxs(Popover, {
@@ -12957,7 +13041,7 @@ function AppBar(props) {
                 color: "cyan",
                 radius: "xl",
                 size: 32,
-                children: [(_p = userInfo === null || userInfo === void 0 ? void 0 : userInfo.FirstName) === null || _p === void 0 ? void 0 : _p.substr(0, 1), (_q = userInfo === null || userInfo === void 0 ? void 0 : userInfo.LastName) === null || _q === void 0 ? void 0 : _q.substr(0, 1)]
+                children: [(_r = userInfo === null || userInfo === void 0 ? void 0 : userInfo.FirstName) === null || _r === void 0 ? void 0 : _r.substr(0, 1), (_s = userInfo === null || userInfo === void 0 ? void 0 : userInfo.LastName) === null || _s === void 0 ? void 0 : _s.substr(0, 1)]
               })
             }), jsx(Popover.Dropdown, {
               w: 300,
@@ -12971,7 +13055,7 @@ function AppBar(props) {
                       color: "cyan",
                       radius: "xl",
                       size: 64,
-                      children: [(_r = userInfo === null || userInfo === void 0 ? void 0 : userInfo.FirstName) === null || _r === void 0 ? void 0 : _r.substr(0, 1), (_s = userInfo === null || userInfo === void 0 ? void 0 : userInfo.LastName) === null || _s === void 0 ? void 0 : _s.substr(0, 1)]
+                      children: [(_t = userInfo === null || userInfo === void 0 ? void 0 : userInfo.FirstName) === null || _t === void 0 ? void 0 : _t.substr(0, 1), (_u = userInfo === null || userInfo === void 0 ? void 0 : userInfo.LastName) === null || _u === void 0 ? void 0 : _u.substr(0, 1)]
                     }), jsxs(Text, {
                       children: [userInfo === null || userInfo === void 0 ? void 0 : userInfo.FirstName, " ", userInfo === null || userInfo === void 0 ? void 0 : userInfo.LastName]
                     })]
@@ -13594,141 +13678,6 @@ const CloseSessionConfirmationModal = ({
   });
 };
 
-/**
- * Hook to manage SessionHub WebSocket connection lifecycle
- * @param shouldConnect - When true, starts the connection. Use this to delay connection until FluxoClient is initialized
- */
-const useSessionHub = (shouldConnect = true) => {
-  const isConnecting = useRef(false);
-  const hasStartedRef = useRef(false);
-  const [isConnected, setIsConnected] = useState(false);
-  const hasBeenConnectedOnce = useRef(false); // Flag per tracciare se si è mai connesso
-  // Funzione per avviare la connessione
-  const startConnection = useCallback$1(() => __awaiter(void 0, void 0, void 0, function* () {
-    if (isConnecting.current || hasStartedRef.current) return;
-    isConnecting.current = true;
-    try {
-      yield FluxoClientSys.Instance.sessionHub.start();
-      console.info('✅ SessionHub connection started from useSessionHub hook');
-      // Registra l'handler per ForceLogout subito dopo la connessione
-      FluxoClientSys.Instance.sessionHub.on('ForceLogout', data => {
-        console.warn('🚨 Force logout received from server:', data);
-        FluxoClientSys.Instance.auth.logout();
-      });
-      console.info('🎧 ForceLogout handler registered');
-      hasStartedRef.current = true;
-      setIsConnected(true);
-      hasBeenConnectedOnce.current = true; // Segna che ci siamo connessi almeno una volta
-    } catch (error) {
-      console.error('❌ Failed to start SessionHub connection', error);
-      setIsConnected(false);
-    } finally {
-      isConnecting.current = false;
-    }
-  }), []);
-  // Funzione per fermare la connessione
-  const stopConnection = useCallback$1(() => __awaiter(void 0, void 0, void 0, function* () {
-    if (!hasStartedRef.current) return;
-    try {
-      yield FluxoClientSys.Instance.sessionHub.stop();
-      console.info('🔌 SessionHub connection stopped');
-      hasStartedRef.current = false;
-      setIsConnected(false);
-    } catch (error) {
-      console.error('❌ Failed to stop SessionHub connection', error);
-    }
-  }), []);
-  useEffect(() => {
-    // Start connection when shouldConnect becomes true
-    if (shouldConnect && !hasStartedRef.current && !isConnecting.current) {
-      startConnection();
-    }
-    // Stop connection when shouldConnect becomes false (e.g., user logout)
-    if (!shouldConnect && hasStartedRef.current) {
-      stopConnection();
-    }
-    // Cleanup on unmount
-    return () => {
-      if (hasStartedRef.current) {
-        const cleanup = () => __awaiter(void 0, void 0, void 0, function* () {
-          try {
-            yield FluxoClientSys.Instance.sessionHub.stop();
-            console.info('🔌 SessionHub connection stopped (component unmount)');
-            hasStartedRef.current = false;
-          } catch (error) {
-            console.error('❌ Failed to stop SessionHub on unmount', error);
-          }
-        });
-        cleanup();
-      }
-    };
-  }, [shouldConnect, startConnection, stopConnection]);
-  // Monitora lo stato della connessione ogni 2 secondi
-  useEffect(() => {
-    const checkConnection = () => {
-      const connected = FluxoClientSys.Instance.sessionHub.isConnected;
-      setIsConnected(connected);
-      // Se si connette, segna che ci siamo connessi almeno una volta
-      if (connected) {
-        hasBeenConnectedOnce.current = true;
-      }
-    };
-    const interval = setInterval(checkConnection, 2000);
-    checkConnection(); // Check subito
-    return () => clearInterval(interval);
-  }, []);
-  // Cleanup finale: disconnetti quando il componente viene smontato
-  useEffect(() => {
-    return () => {
-      if (hasStartedRef.current) {
-        const cleanup = () => __awaiter(void 0, void 0, void 0, function* () {
-          try {
-            yield FluxoClientSys.Instance.sessionHub.stop();
-            console.info('SessionHub connection stopped (component unmount)');
-          } catch (error) {
-            console.error('Failed to stop SessionHub connection', error);
-          }
-        });
-        cleanup();
-      }
-    };
-  }, []);
-  // Esponi metodi utili
-  const on = useCallback$1((eventName, handler) => {
-    FluxoClientSys.Instance.sessionHub.on(eventName, handler);
-  }, []);
-  const off = useCallback$1((eventName, handler) => {
-    FluxoClientSys.Instance.sessionHub.off(eventName, handler);
-  }, []);
-  const invoke = useCallback$1((methodName, ...args) => __awaiter(void 0, void 0, void 0, function* () {
-    return yield FluxoClientSys.Instance.sessionHub.invoke(methodName, ...args);
-  }), []);
-  const send = useCallback$1((methodName, ...args) => __awaiter(void 0, void 0, void 0, function* () {
-    yield FluxoClientSys.Instance.sessionHub.send(methodName, ...args);
-  }), []);
-  const getState = useCallback$1(() => {
-    return FluxoClientSys.Instance.sessionHub.state;
-  }, []);
-  const getConnectionId = useCallback$1(() => {
-    return FluxoClientSys.Instance.sessionHub.connectionId;
-  }, []);
-  // Memoizza l'oggetto restituito per evitare re-render inutili del ScreenSharingProvider
-  return useMemo$1(() => ({
-    on,
-    off,
-    invoke,
-    send,
-    getState,
-    getConnectionId,
-    connectionId: FluxoClientSys.Instance.sessionHub.connectionId,
-    isConnected: () => isConnected,
-    connected: isConnected,
-    reconnect: startConnection,
-    disconnect: stopConnection,
-    hasBeenConnectedOnce: hasBeenConnectedOnce.current
-  }), [on, off, invoke, send, getState, getConnectionId, isConnected, startConnection, stopConnection]);
-};
-
 /**
  * Hook personalizzato per tracciare i cambiamenti di pagina e titolo
  * e inviare gli aggiornamenti al server via SessionHub
@@ -13797,9 +13746,13 @@ function AppContent(props) {
   // Hook personalizzati per gestire le diverse responsabilità
   useDocumentTitleManager(props.withMultipleSessions, sessionContext);
   useScrollPositionManager(props.withMultipleSessions, currentSessionId);
-  const sessionHub = useSessionHub(false);
   // Traccia i cambiamenti di pagina e titolo e invia gli aggiornamenti al server
-  usePageTracker(sessionHub);
+  // Wrapper per adattare sessionHub al tipo richiesto da usePageTracker
+  const sessionHubWrapper = useMemo$1(() => ({
+    isConnected: () => FluxoClientSys.Instance.sessionHub.isConnected,
+    invoke: FluxoClientSys.Instance.sessionHub.invoke.bind(FluxoClientSys.Instance.sessionHub)
+  }), []);
+  usePageTracker(sessionHubWrapper);
   // FIX #1: Stabilizza le funzioni del sessionContext per evitare ricreazioni del listener
   const stableSessionContext = useMemo$1(() => ({
     addOrSwitchToSession: sessionContext.addOrSwitchToSession
@@ -13894,6 +13847,7 @@ function AppContent(props) {
     children: [props.withMultipleSessions ? jsxs(Tabs, {
       variant: 'none',
       value: currentSessionId,
+      keepMounted: true,
       onChange: value => value && sessionContext.setCurrentSession(value),
       children: [jsx(Box, {
         style: {
@@ -14730,7 +14684,6 @@ function FooterBar(props) {
     hasDeveloperAccess,
     hasDataAnalystAccess
   } = useAppSelector(state => state.layout);
-  const sessionHub = useSessionHub(false);
   const [wsPopoverOpened, setWsPopoverOpened] = useState(false);
   const [isWsConnected, setIsWsConnected] = useState(false);
   const [connectionId, setConnectionId] = useState(null);
@@ -14744,7 +14697,7 @@ function FooterBar(props) {
   // Monitora lo stato della connessione WebSocket
   useEffect(() => {
     const checkConnection = () => {
-      const connected = sessionHub.isConnected();
+      const connected = FluxoClientSys.Instance.sessionHub.isConnected;
       setIsWsConnected(connected);
       if (connected) {
         // Ottieni il connection ID
@@ -14761,17 +14714,17 @@ function FooterBar(props) {
     // Controlla periodicamente ogni 2 secondi
     const interval = setInterval(checkConnection, 2000);
     return () => clearInterval(interval);
-  }, [sessionHub]);
+  }, []);
   useEffect(() => {
     if (idle) FluxoStateDispatcher.dispatchSetUserIdle();else FluxoStateDispatcher.dispatchUnsetUserIdle();
   }, [idle]);
   // Invia l'aggiornamento dell'attività utente al server quando cambia lo stato idle
   useEffect(() => {
     if (!isWsConnected) return; // Non inviare se non siamo connessi
-    sessionHub.invoke('UpdateUserActivity', !userIdle).catch(error => {
+    FluxoClientSys.Instance.sessionHub.invoke('UpdateUserActivity', !userIdle).catch(error => {
       console.error('Failed to update user activity:', error);
     });
-  }, [userIdle, isWsConnected, sessionHub]);
+  }, [userIdle, isWsConnected]);
   [{
     title: 'Home',
     href: '#'
@@ -15669,7 +15622,7 @@ function Navbar(props) {
         id: 'fluxo-shell-sidebar',
         zIndex: 197,
         style: props.shellUi.navigation === ShellUINavigation.Sidebar || props.shellUi.navigation === ShellUINavigation.SidebarMinimal ? {
-          borderTopLeftRadius: '20px',
+          borderTopLeftRadius: '12px',
           overflow: 'visible'
         } : undefined,
         children: jsx(AppShell.Section, {
@@ -20050,11 +20003,20 @@ function AppLayout({
   const [currentShellUI, setCurrentShellUI] = useState(ui);
   const isMobile = useMediaQuery('(max-width: 992px)');
   // Monitora lo stato della connessione WebSocket
-  const sessionHub = useSessionHub(false);
-  const {
-    connected,
-    hasBeenConnectedOnce
-  } = sessionHub;
+  const [connected, setConnected] = useState(false);
+  const [hasBeenConnectedOnce, setHasBeenConnectedOnce] = useState(false);
+  useEffect(() => {
+    const checkConnection = () => {
+      const isConnected = FluxoClientSys.Instance.sessionHub.isConnected;
+      setConnected(isConnected);
+      if (isConnected) {
+        setHasBeenConnectedOnce(true);
+      }
+    };
+    const interval = setInterval(checkConnection, 2000);
+    checkConnection();
+    return () => clearInterval(interval);
+  }, []);
   // Mostra l'overlay solo se la connessione è stata persa DOPO essere stata stabilita
   const showDisconnectionOverlay = !connected && hasBeenConnectedOnce;
   // Blocca lo scroll quando l'overlay è visibile
@@ -20090,7 +20052,7 @@ function AppLayout({
   return jsx(ShellUIContext.Provider, {
     value: currentShellUI,
     children: jsx(ScreenSharingProvider, {
-      sessionHub: sessionHub,
+      sessionHub: FluxoClientSys.Instance.sessionHub,
       children: jsxs(WithShellSessionProvider, {
         withMultipleSessions: (_a = currentShellUI.withMultipleSessions) !== null && _a !== void 0 ? _a : false,
         children: [jsx(WithRavifyProvider, {
@@ -20101,16 +20063,16 @@ function AppLayout({
             className: currentShellUI.navigation === ShellUINavigation.Sidebar || currentShellUI.navigation === ShellUINavigation.SidebarMinimal ? 'flxShellAppShellV2' : 'flxShellAppShellV1',
             styles: {
               main: {
-                backgroundColor: '#fafbff'
+                backgroundColor: '#fafbff',
+                paddingLeft: currentShellUI.navigation === ShellUINavigation.None || currentShellUI.navigation === ShellUINavigation.Topbar ? 0 : undefined
               }
             },
             navbar: {
               width: currentShellUI.navigation === ShellUINavigation.SidebarMinimal ? navbarOpened ? 248 : 80 : 248,
               breakpoint: 'sm',
               collapsed: {
-                mobile: !navbarOpened,
-                // Su mobile, sempre nascosta quando chiusa
-                desktop: !navbarOpened && currentShellUI.navigation === ShellUINavigation.Sidebar // Su desktop, nascosta solo con Sidebar normale
+                mobile: currentShellUI.navigation === ShellUINavigation.None ? true : !navbarOpened,
+                desktop: currentShellUI.navigation === ShellUINavigation.None ? true : !navbarOpened && currentShellUI.navigation === ShellUINavigation.Sidebar
               }
             },
             header: {
@@ -60665,23 +60627,319 @@ const ScreenViewerModal = ({
   });
 };
 
+/**
+ * Modal per inviare messaggi agli utenti connessi
+ */
+const SendMessageModal = ({
+  opened,
+  onClose,
+  mode,
+  targetId,
+  targetName,
+  availableUsers: _availableUsers = [],
+  sessionHub,
+  onMessageSent
+}) => {
+  var _a, _b;
+  const [message, setMessage] = useState('');
+  const [messageType, setMessageType] = useState('Informazioni');
+  const [displayType, setDisplayType] = useState('Modal');
+  const [selectedUserIds, setSelectedUserIds] = useState([]);
+  const [isSending, setIsSending] = useState(false);
+  const [error, setError] = useState(null);
+  // Configurazione tipi di visualizzazione con icone
+  const displayTypeConfig = {
+    'Modal': {
+      icon: jsx(IconWindow, {
+        size: 16
+      }),
+      color: 'blue',
+      label: 'Modale'
+    },
+    'Toast': {
+      icon: jsx(IconMessage, {
+        size: 16
+      }),
+      color: 'teal',
+      label: 'Toast'
+    },
+    'NotificationBar': {
+      icon: jsx(IconLayoutBottombar, {
+        size: 16
+      }),
+      color: 'cyan',
+      label: 'Notification Bar'
+    }
+  };
+  const displayTypeOptions = Object.entries(displayTypeConfig).map(([value, config]) => ({
+    value,
+    label: config.label
+  }));
+  // Configurazione tipi di messaggio con icone
+  const messageTypeConfig = {
+    'Informazioni': {
+      icon: jsx(IconInfoCircle, {
+        size: 16
+      }),
+      color: 'blue',
+      label: 'Informazioni'
+    },
+    'Successo': {
+      icon: jsx(IconCircleCheck, {
+        size: 16
+      }),
+      color: 'green',
+      label: 'Successo'
+    },
+    'Avviso': {
+      icon: jsx(IconAlertCircle, {
+        size: 16
+      }),
+      color: 'yellow',
+      label: 'Avviso'
+    },
+    'Critico': {
+      icon: jsx(IconAlertOctagon, {
+        size: 16
+      }),
+      color: 'red',
+      label: 'Critico'
+    },
+    'Errore': {
+      icon: jsx(IconX, {
+        size: 16
+      }),
+      color: 'red',
+      label: 'Errore'
+    },
+    'Alert': {
+      icon: jsx(IconBell, {
+        size: 16
+      }),
+      color: 'orange',
+      label: 'Alert'
+    },
+    'Notifica': {
+      icon: jsx(IconMail, {
+        size: 16
+      }),
+      color: 'grape',
+      label: 'Notifica'
+    }
+  };
+  const messageTypeOptions = Object.entries(messageTypeConfig).map(([value, config]) => ({
+    value,
+    label: config.label
+  }));
+  const handleSend = () => __awaiter(void 0, void 0, void 0, function* () {
+    if (!message.trim()) {
+      setError('Il messaggio non può essere vuoto');
+      return;
+    }
+    // Validazione per modalità multiple-users
+    if (mode === 'multiple-users' && selectedUserIds.length === 0) {
+      setError('Seleziona almeno un utente');
+      return;
+    }
+    setIsSending(true);
+    setError(null);
+    try {
+      if (mode === 'broadcast') {
+        yield sessionHub.invoke('SendBroadcastMessage', messageType, displayType, message);
+      } else if (mode === 'user' && targetId) {
+        yield sessionHub.invoke('SendMessageToUser', targetId, messageType, displayType, message);
+      } else if (mode === 'session' && targetId) {
+        yield sessionHub.invoke('SendMessageToSession', targetId, messageType, displayType, message);
+      } else if (mode === 'multiple-users') {
+        // Invia il messaggio a tutti gli utenti selezionati
+        const promises = selectedUserIds.map(userId => sessionHub.invoke('SendMessageToUser', userId, messageType, displayType, message));
+        yield Promise.all(promises);
+        console.info(`✅ Messaggio inviato a ${selectedUserIds.length} utenti`, selectedUserIds);
+      }
+      console.info(`✅ Messaggio inviato - Modalità: ${mode}, Tipo: ${messageType}, Display: ${displayType}`);
+      // Reset form
+      setMessage('');
+      setMessageType('Informazioni');
+      setDisplayType('Modal');
+      setSelectedUserIds([]);
+      // Callback
+      onMessageSent === null || onMessageSent === void 0 ? void 0 : onMessageSent();
+      onClose();
+    } catch (err) {
+      console.error('❌ Errore invio messaggio:', err);
+      setError((err === null || err === void 0 ? void 0 : err.message) || 'Errore durante l\'invio del messaggio');
+    } finally {
+      setIsSending(false);
+    }
+  });
+  const getTitle = () => {
+    switch (mode) {
+      case 'broadcast':
+        return 'Invia messaggio a tutti gli utenti';
+      case 'user':
+        return `Invia messaggio a ${targetName || 'utente'}`;
+      case 'session':
+        return 'Invia messaggio alla sessione';
+      case 'multiple-users':
+        return 'Invia messaggio a utenti specifici';
+      default:
+        return 'Invia messaggio';
+    }
+  };
+  const getDescription = () => {
+    switch (mode) {
+      case 'broadcast':
+        return 'Questo messaggio verrà inviato a tutti gli utenti connessi all\'applicazione';
+      case 'user':
+        return `Questo messaggio verrà inviato a tutte le sessioni attive di ${targetName || 'questo utente'}`;
+      case 'session':
+        return 'Questo messaggio verrà inviato solo a questa specifica sessione';
+      case 'multiple-users':
+        return `Seleziona gli utenti a cui vuoi inviare il messaggio${selectedUserIds.length > 0 ? ` (${selectedUserIds.length} selezionati)` : ''}`;
+      default:
+        return '';
+    }
+  };
+  return jsx(Modal, {
+    opened: opened,
+    onClose: onClose,
+    centered: true,
+    title: jsx(Text, {
+      fw: 600,
+      size: "lg",
+      children: getTitle()
+    }),
+    size: "lg",
+    padding: "md",
+    children: jsxs(Stack, {
+      gap: "md",
+      children: [jsx(Alert, {
+        icon: jsx(IconAlertTriangle, {
+          size: 16
+        }),
+        color: "blue",
+        variant: "light",
+        children: getDescription()
+      }), mode === 'multiple-users' && jsx(MultiSelect, {
+        label: "Seleziona utenti",
+        placeholder: "Cerca e seleziona gli utenti...",
+        value: selectedUserIds,
+        onChange: setSelectedUserIds,
+        data: _availableUsers,
+        searchable: true,
+        clearable: true,
+        required: true,
+        description: `${selectedUserIds.length} utenti selezionati`,
+        error: error && selectedUserIds.length === 0 ? 'Seleziona almeno un utente' : undefined
+      }), jsx(Select, {
+        label: "Tipo di messaggio",
+        placeholder: "Seleziona il tipo",
+        value: messageType,
+        onChange: value => setMessageType(value),
+        data: messageTypeOptions,
+        required: true,
+        leftSection: (_a = messageTypeConfig[messageType]) === null || _a === void 0 ? void 0 : _a.icon,
+        renderOption: ({
+          option
+        }) => {
+          const config = messageTypeConfig[option.value];
+          return jsxs(Group, {
+            gap: "sm",
+            children: [jsx(Text, {
+              c: config.color,
+              children: config.icon
+            }), jsx(Text, {
+              children: config.label
+            })]
+          });
+        }
+      }), jsx(Select, {
+        label: "Modalit\u00E0 di visualizzazione",
+        placeholder: "Seleziona la modalit\u00E0",
+        value: displayType,
+        onChange: value => setDisplayType(value),
+        data: displayTypeOptions,
+        required: true,
+        leftSection: (_b = displayTypeConfig[displayType]) === null || _b === void 0 ? void 0 : _b.icon,
+        renderOption: ({
+          option
+        }) => {
+          const config = displayTypeConfig[option.value];
+          return jsxs(Group, {
+            gap: "sm",
+            children: [jsx(Text, {
+              c: config.color,
+              children: config.icon
+            }), jsx(Text, {
+              children: config.label
+            })]
+          });
+        }
+      }), jsx(Textarea, {
+        label: "Messaggio",
+        placeholder: "Scrivi il messaggio da inviare...",
+        value: message,
+        onChange: e => setMessage(e.currentTarget.value),
+        minRows: 4,
+        maxRows: 8,
+        required: true,
+        error: error
+      }), jsxs(Group, {
+        justify: "space-between",
+        children: [jsxs(Text, {
+          size: "xs",
+          c: "dimmed",
+          children: [mode === 'broadcast' && 'Il messaggio sarà visibile a tutti', mode === 'user' && targetId && `Target User ID: ${targetId}`, mode === 'session' && targetId && `Target Connection ID: ${targetId.substring(0, 8)}...`, mode === 'multiple-users' && selectedUserIds.length > 0 && `Invio a ${selectedUserIds.length} utenti`]
+        }), jsxs(Group, {
+          gap: "sm",
+          children: [jsx(Button, {
+            variant: "subtle",
+            color: "gray",
+            onClick: onClose,
+            disabled: isSending,
+            children: "Annulla"
+          }), jsx(Button, {
+            leftSection: jsx(IconSend, {
+              size: 16
+            }),
+            onClick: handleSend,
+            loading: isSending,
+            color: mode === 'broadcast' ? 'orange' : mode === 'multiple-users' ? 'grape' : 'blue',
+            disabled: mode === 'multiple-users' && selectedUserIds.length === 0,
+            children: isSending && mode === 'multiple-users' ? `Invio... (${selectedUserIds.length})` : 'Invia messaggio'
+          })]
+        })]
+      })]
+    })
+  });
+};
+
 function ConnectedUsers() {
   const [connectedUsers, setConnectedUsers] = useState([]);
   const [expandedUsers, setExpandedUsers] = useState(new Set());
   const [searchQuery, setSearchQuery] = useState('');
   const [currentConnectionId, setCurrentConnectionId] = useState('');
   const [currentDeviceId, setCurrentDeviceId] = useState('');
+  const [loading, setLoading] = useState(true);
   // Screen sharing modal state
   const [screenViewerOpened, setScreenViewerOpened] = useState(false);
   const [selectedConnection, setSelectedConnection] = useState(null);
+  // Send message modal state
+  const [sendMessageOpened, setSendMessageOpened] = useState(false);
+  const [messageMode, setMessageMode] = useState('broadcast');
+  const [messageTarget, setMessageTarget] = useState(null);
+  const [availableUsersForMultipleSelect, setAvailableUsersForMultipleSelect] = useState([]);
   // Confirm modal state for force logout
   const [showForceLogoutModal, setShowForceLogoutModal] = useState(false);
   const [deviceToDisconnect, setDeviceToDisconnect] = useState(null);
-  // Hook per il SessionHub
-  const sessionHub = useSessionHub(false);
+  // Debounce timer per evitare troppi refresh consecutivi
+  const [updateDebounceTimer, setUpdateDebounceTimer] = useState(null);
   // Memoizza la funzione di caricamento per poterla usare nell'event handler
-  const loadConnectedUsers = useCallback$1(() => __awaiter(this, void 0, void 0, function* () {
+  const loadConnectedUsers = useCallback$1((...args_1) => __awaiter(this, [...args_1], void 0, function* (showLoader = true) {
     try {
+      if (showLoader) {
+        setLoading(true);
+      }
       const users = yield FluxoClientSys.Instance.sessionHub.getConnectedUsers();
       setConnectedUsers(users);
       // Ottieni il connection ID corrente
@@ -60701,27 +60959,64 @@ function ConnectedUsers() {
         message: 'Impossibile caricare gli utenti connessi',
         color: 'red'
       });
+    } finally {
+      if (showLoader) {
+        setLoading(false);
+      }
     }
   }), []);
   // Carica gli utenti connessi all'avvio
   useEffect(() => {
     loadConnectedUsers();
   }, [loadConnectedUsers]);
+  // Aggiorna la lista di utenti disponibili per la selezione multipla
+  useEffect(() => {
+    // Raggruppa gli utenti per userId per evitare duplicati
+    const grouped = connectedUsers.reduce((acc, user) => {
+      const existing = acc.find(u => u.userId === user.userId);
+      if (existing) {
+        // Unisci le sessioni
+        existing.sessions = [...existing.sessions, ...user.sessions];
+        existing.count = existing.sessions.length;
+      } else {
+        acc.push(Object.assign({}, user));
+      }
+      return acc;
+    }, []);
+    const usersList = grouped.map(user => ({
+      value: user.userId,
+      label: `${user.userName} (${user.count} ${user.count === 1 ? 'sessione' : 'sessioni'})`
+    }));
+    setAvailableUsersForMultipleSelect(usersList);
+  }, [connectedUsers]);
   // Ascolta l'evento OnConnectedUsersChanged e ricarica automaticamente la lista
   useEffect(() => {
     const handleConnectedUsersChanged = () => {
-      console.info('👥 Connected users changed, reloading list...');
-      loadConnectedUsers();
+      console.info('👥 Connected users changed, scheduling reload...');
+      // Cancella il timer precedente se esiste
+      if (updateDebounceTimer) {
+        clearTimeout(updateDebounceTimer);
+      }
+      // Imposta un nuovo timer con debounce di 500ms
+      const timer = setTimeout(() => {
+        console.info('👥 Executing debounced reload...');
+        loadConnectedUsers(false); // false = non mostrare il loader
+      }, 500);
+      setUpdateDebounceTimer(timer);
     };
     // Registra l'event handler
-    sessionHub.on('OnConnectedUsersChanged', handleConnectedUsersChanged);
+    FluxoClientSys.Instance.sessionHub.on('OnConnectedUsersChanged', handleConnectedUsersChanged);
     console.info('🎧 Listening for OnConnectedUsersChanged events');
     // Cleanup
     return () => {
-      sessionHub.off('OnConnectedUsersChanged', handleConnectedUsersChanged);
+      FluxoClientSys.Instance.sessionHub.off('OnConnectedUsersChanged', handleConnectedUsersChanged);
       console.info('🧹 Stopped listening for OnConnectedUsersChanged events');
+      // Pulisci il timer se esiste
+      if (updateDebounceTimer) {
+        clearTimeout(updateDebounceTimer);
+      }
     };
-  }, [sessionHub, loadConnectedUsers]);
+  }, [loadConnectedUsers, updateDebounceTimer]);
   const toggleUserExpand = userId => {
     const newExpanded = new Set(expandedUsers);
     if (newExpanded.has(userId)) {
@@ -60778,7 +61073,7 @@ function ConnectedUsers() {
   // Funzione per disconnettere forzatamente una sessione
   const handleForceLogout = (deviceId, userName) => __awaiter(this, void 0, void 0, function* () {
     try {
-      yield sessionHub.invoke('ForceLogout', deviceId);
+      yield FluxoClientSys.Instance.sessionHub.invoke('ForceLogout', deviceId);
       showNotification({
         title: 'Disconnessione avviata',
         message: `Tutte le sessioni di ${userName} sul dispositivo sono state disconnesse`,
@@ -60793,92 +61088,182 @@ function ConnectedUsers() {
       });
     }
   });
+  // Funzioni per aprire la modale di invio messaggi
+  const openBroadcastMessage = () => {
+    setMessageMode('broadcast');
+    setMessageTarget(null);
+    setSendMessageOpened(true);
+  };
+  const openMultipleUsersMessage = () => {
+    setMessageMode('multiple-users');
+    setMessageTarget(null);
+    setSendMessageOpened(true);
+  };
+  const openUserMessage = (userId, userName) => {
+    setMessageMode('user');
+    setMessageTarget({
+      id: userId,
+      name: userName
+    });
+    setSendMessageOpened(true);
+  };
+  const openSessionMessage = (connectionId, userName) => {
+    setMessageMode('session');
+    setMessageTarget({
+      id: connectionId,
+      name: userName
+    });
+    setSendMessageOpened(true);
+  };
+  const handleMessageSent = () => {
+    showNotification({
+      title: 'Messaggio inviato',
+      message: 'Il messaggio è stato inviato con successo',
+      color: 'green'
+    });
+  };
   return jsxs(Stack, {
     gap: "md",
     children: [jsxs(Group, {
       gap: "md",
+      grow: true,
       children: [jsx(Card, {
         withBorder: true,
-        padding: "md",
-        style: {
-          flex: 1
-        },
-        children: jsxs(Group, {
+        padding: "lg",
+        children: jsxs(Stack, {
           gap: "xs",
-          children: [jsx(IconUserCircle, {
-            size: 24,
-            style: {
-              color: 'var(--mantine-color-blue-6)'
-            }
+          children: [jsxs(Group, {
+            gap: "sm",
+            justify: "space-between",
+            children: [jsx(IconUserCircle, {
+              size: 28,
+              style: {
+                color: 'var(--mantine-color-blue-6)'
+              }
+            }), loading ? jsx(Loader, {
+              size: "xs"
+            }) : jsx(Badge, {
+              color: "blue",
+              variant: "light",
+              size: "lg",
+              children: groupedUsers.length
+            })]
           }), jsxs("div", {
             children: [jsx(Text, {
-              size: "xs",
+              size: "sm",
               c: "dimmed",
+              fw: 500,
               children: "Utenti connessi"
-            }), jsx(Text, {
-              size: "xl",
-              fw: 700,
-              children: groupedUsers.length
+            }), !loading && jsx(Text, {
+              size: "xs",
+              c: "dimmed",
+              children: "Utenti unici attivi"
             })]
           })]
         })
       }), jsx(Card, {
         withBorder: true,
-        padding: "md",
-        style: {
-          flex: 1
-        },
-        children: jsxs(Group, {
+        padding: "lg",
+        children: jsxs(Stack, {
           gap: "xs",
-          children: [jsx(IconPlugConnected, {
-            size: 24,
-            style: {
-              color: 'var(--mantine-color-teal-6)'
-            }
+          children: [jsxs(Group, {
+            gap: "sm",
+            justify: "space-between",
+            children: [jsx(IconPlugConnected, {
+              size: 28,
+              style: {
+                color: 'var(--mantine-color-teal-6)'
+              }
+            }), loading ? jsx(Loader, {
+              size: "xs"
+            }) : jsx(Badge, {
+              color: "teal",
+              variant: "light",
+              size: "lg",
+              children: getTotalSessions()
+            })]
           }), jsxs("div", {
             children: [jsx(Text, {
-              size: "xs",
+              size: "sm",
               c: "dimmed",
+              fw: 500,
               children: "Sessioni totali"
-            }), jsx(Text, {
-              size: "xl",
-              fw: 700,
-              children: getTotalSessions()
+            }), !loading && jsx(Text, {
+              size: "xs",
+              c: "dimmed",
+              children: "Connessioni WebSocket attive"
             })]
           })]
         })
       }), jsx(Card, {
         withBorder: true,
-        padding: "md",
-        style: {
-          flex: 1
-        },
-        children: jsxs(Group, {
+        padding: "lg",
+        children: jsxs(Stack, {
           gap: "xs",
-          children: [jsx(IconDeviceLaptop, {
-            size: 24,
-            style: {
-              color: 'var(--mantine-color-indigo-6)'
-            }
-          }), jsxs("div", {
-            children: [jsx(Text, {
-              size: "xs",
-              c: "dimmed",
-              children: "Dispositivi totali"
-            }), jsx(Text, {
-              size: "xl",
-              fw: 700,
+          children: [jsxs(Group, {
+            gap: "sm",
+            justify: "space-between",
+            children: [jsx(IconDeviceLaptop, {
+              size: 28,
+              style: {
+                color: 'var(--mantine-color-indigo-6)'
+              }
+            }), loading ? jsx(Loader, {
+              size: "xs"
+            }) : jsx(Badge, {
+              color: "indigo",
+              variant: "light",
+              size: "lg",
               children: groupedUsers.reduce((acc, user) => {
                 const devices = new Set(user.sessions.map(s => s.deviceId || 'unknown'));
                 return acc + devices.size;
               }, 0)
             })]
+          }), jsxs("div", {
+            children: [jsx(Text, {
+              size: "sm",
+              c: "dimmed",
+              fw: 500,
+              children: "Dispositivi totali"
+            }), !loading && jsx(Text, {
+              size: "xs",
+              c: "dimmed",
+              children: "Dispositivi unici registrati"
+            })]
           })]
         })
       })]
     }), jsx(DataCard, {
       title: "Utenti connessi",
       padded: false,
+      elements: [jsx(Tooltip, {
+        label: "Invia messaggio a tutti gli utenti connessi",
+        children: jsx(Button, {
+          leftSection: jsx(IconBroadcast, {
+            size: 16
+          }),
+          variant: "light",
+          color: "orange",
+          size: "xs",
+          onClick: openBroadcastMessage,
+          children: "Messaggio Broadcast"
+        })
+      }, "broadcast-btn"), jsx(Space, {
+        w: 16
+      }), jsx(Tooltip, {
+        label: "Invia messaggio a utenti specifici selezionati",
+        children: jsx(Button, {
+          leftSection: jsx(IconUsersGroup, {
+            size: 16
+          }),
+          variant: "light",
+          color: "grape",
+          size: "xs",
+          onClick: openMultipleUsersMessage,
+          disabled: groupedUsers.length === 0,
+          children: "Messaggio a Utenti Multipli"
+        })
+      }, "multiple-users-btn")],
       children: jsxs(Stack, {
         gap: 0,
         children: [jsx(Box, {
@@ -60902,14 +61287,29 @@ function ConnectedUsers() {
             value: searchQuery,
             onChange: e => setSearchQuery(e.currentTarget.value)
           })
-        }), filteredUsers.length === 0 ? jsx(Box, {
+        }), loading ? jsx(Box, {
+          p: 60,
+          children: jsx(Center, {
+            children: jsxs(Stack, {
+              gap: "md",
+              align: "center",
+              children: [jsx(Loader, {
+                size: "lg"
+              }), jsx(Text, {
+                size: "sm",
+                c: "dimmed",
+                children: "Caricamento utenti connessi..."
+              })]
+            })
+          })
+        }) : filteredUsers.length === 0 ? jsx(Box, {
           p: 40,
           children: jsx(NoData, {
             icon: jsx(IconUsers, {
               size: 48
             }),
             iconSize: 48,
-            message: searchQuery ? "Nessun risultato" : "Nessun utente connesso"
+            message: searchQuery ? "Nessun risultato trovato" : "Nessun utente connesso"
           })
         }) : jsx(Table.ScrollContainer, {
           minWidth: 800,
@@ -60938,6 +61338,12 @@ function ConnectedUsers() {
                     textAlign: 'center'
                   },
                   children: "Sessioni"
+                }), jsx(Table.Th, {
+                  w: 100,
+                  style: {
+                    textAlign: 'center'
+                  },
+                  children: "Azioni"
                 })]
               })
             }), jsx(Table.Tbody, {
@@ -60946,7 +61352,8 @@ function ConnectedUsers() {
                 return jsxs(Fragment, {
                   children: [jsxs(Table.Tr, {
                     style: {
-                      cursor: 'pointer'
+                      cursor: 'pointer',
+                      transition: 'background-color 0.15s ease'
                     },
                     onClick: () => toggleUserExpand(user.userId),
                     children: [jsx(Table.Td, {
@@ -60999,46 +61406,64 @@ function ConnectedUsers() {
                           children: [user.count, " ", user.count === 1 ? 'sessione' : 'sessioni']
                         })
                       })
+                    }), jsx(Table.Td, {
+                      children: jsx(Center, {
+                        children: jsx(Tooltip, {
+                          label: "Invia messaggio a tutte le sessioni dell'utente",
+                          children: jsx(ActionIcon, {
+                            size: "sm",
+                            variant: "light",
+                            color: "blue",
+                            onClick: e => {
+                              e.stopPropagation();
+                              openUserMessage(user.userId, user.userName);
+                            },
+                            children: jsx(IconSend, {
+                              size: 16
+                            })
+                          })
+                        })
+                      })
                     })]
                   }, user.userId), expandedUsers.has(user.userId) && jsx(Table.Tr, {
                     children: jsx(Table.Td, {
-                      colSpan: 5,
+                      colSpan: 6,
                       style: {
                         backgroundColor: 'var(--mantine-color-gray-0)',
                         padding: 0
                       },
                       children: jsx(Box, {
-                        p: "md",
+                        p: "lg",
                         children: jsx(Stack, {
-                          gap: "md",
-                          children: Array.from(groupSessionsByDevice(user.sessions)).map(([deviceId, deviceSessions]) => {
+                          gap: "lg",
+                          children: Array.from(groupSessionsByDevice(user.sessions)).map(([deviceId, deviceSessions], index, array) => {
                             const isCurrentDevice = deviceId === currentDeviceId;
                             return jsxs(Box, {
                               children: [jsxs(Group, {
-                                gap: 6,
-                                mb: 8,
+                                gap: 8,
+                                mb: 12,
                                 justify: "space-between",
                                 children: [jsxs(Group, {
-                                  gap: 6,
+                                  gap: 8,
                                   children: [jsx(IconDeviceLaptop, {
-                                    size: 14,
+                                    size: 16,
                                     style: {
                                       color: 'var(--mantine-color-indigo-6)'
                                     }
                                   }), jsxs(Text, {
-                                    size: "xs",
+                                    size: "sm",
                                     fw: 600,
                                     c: "dimmed",
                                     children: ["Dispositivo: ", getDeviceIdShort(deviceId)]
                                   }), jsxs(Badge, {
-                                    size: "xs",
+                                    size: "sm",
                                     color: "indigo",
                                     variant: "dot",
                                     children: [deviceSessions.length, " ", deviceSessions.length === 1 ? 'sessione' : 'sessioni']
                                   }), isCurrentDevice && jsx(Badge, {
                                     color: "blue",
                                     variant: "filled",
-                                    size: "xs",
+                                    size: "sm",
                                     children: "Il tuo dispositivo"
                                   })]
                                 }), !isCurrentDevice && jsx(Tooltip, {
@@ -61062,45 +61487,57 @@ function ConnectedUsers() {
                                   })
                                 })]
                               }), jsxs(Table, {
-                                withTableBorder: true,
                                 withColumnBorders: true,
+                                style: {
+                                  tableLayout: 'fixed',
+                                  width: '100%'
+                                },
                                 children: [jsx(Table.Thead, {
                                   children: jsxs(Table.Tr, {
                                     children: [jsx(Table.Th, {
-                                      w: 40,
+                                      style: {
+                                        width: '40px'
+                                      },
                                       children: jsx(Center, {
-                                        children: jsx(IconNetwork, {
+                                        children: jsx(IconPlugConnected, {
                                           size: 12
                                         })
                                       })
                                     }), jsx(Table.Th, {
-                                      w: 'auto',
-                                      miw: 150,
-                                      children: "Connection ID"
+                                      style: {
+                                        width: '100px'
+                                      },
+                                      children: "ID"
                                     }), jsx(Table.Th, {
-                                      w: 120,
+                                      style: {
+                                        width: '110px'
+                                      },
                                       children: "Indirizzo IP"
                                     }), jsx(Table.Th, {
-                                      w: 100,
+                                      style: {
+                                        width: '110px'
+                                      },
                                       children: "Browser"
                                     }), jsx(Table.Th, {
-                                      w: 200,
+                                      style: {
+                                        width: '150px'
+                                      },
                                       children: "Pagina Corrente"
                                     }), jsx(Table.Th, {
-                                      w: 100,
                                       style: {
+                                        width: '60px',
                                         textAlign: 'center'
                                       },
                                       children: "Attivit\u00E0"
                                     }), jsx(Table.Th, {
-                                      w: 100,
                                       style: {
+                                        width: '60px',
                                         textAlign: 'center'
                                       },
                                       children: "Stato"
                                     }), jsx(Table.Th, {
-                                      w: 64,
                                       style: {
+                                        width: '80px',
                                         textAlign: 'center'
                                       },
                                       children: "Azioni"
@@ -61220,41 +61657,60 @@ function ConnectedUsers() {
                                         })
                                       }), jsx(Table.Td, {
                                         children: jsx(Center, {
-                                          children: isCurrentConnection ? jsx(Tooltip, {
-                                            label: "Non puoi visualizzare il tuo schermo",
-                                            children: jsx(ActionIcon, {
-                                              size: "xs",
-                                              variant: "light",
-                                              color: "gray",
-                                              disabled: true,
-                                              children: jsx(IconEye, {
-                                                size: 14
+                                          children: jsxs(Group, {
+                                            gap: 8,
+                                            children: [isCurrentConnection ? jsx(Tooltip, {
+                                              label: "Non puoi visualizzare il tuo schermo",
+                                              children: jsx(ActionIcon, {
+                                                size: "xs",
+                                                variant: "light",
+                                                color: "gray",
+                                                disabled: true,
+                                                children: jsx(IconEye, {
+                                                  size: 14
+                                                })
                                               })
-                                            })
-                                          }) : jsx(Tooltip, {
-                                            label: "Visualizza schermo",
-                                            children: jsx(ActionIcon, {
-                                              size: "xs",
-                                              variant: "light",
-                                              color: "gray",
-                                              onClick: e => {
-                                                e.stopPropagation();
-                                                setSelectedConnection({
-                                                  connectionId: session.wsConnectionId,
-                                                  userName: session.userName
-                                                });
-                                                setScreenViewerOpened(true);
-                                              },
-                                              children: jsx(IconEye, {
-                                                size: 14
+                                            }) : jsx(Tooltip, {
+                                              label: "Visualizza schermo",
+                                              children: jsx(ActionIcon, {
+                                                size: "xs",
+                                                variant: "light",
+                                                color: "gray",
+                                                onClick: e => {
+                                                  e.stopPropagation();
+                                                  setSelectedConnection({
+                                                    connectionId: session.wsConnectionId,
+                                                    userName: session.userName
+                                                  });
+                                                  setScreenViewerOpened(true);
+                                                },
+                                                children: jsx(IconEye, {
+                                                  size: 14
+                                                })
                                               })
-                                            })
+                                            }), jsx(Tooltip, {
+                                              label: "Invia messaggio a questa sessione",
+                                              children: jsx(ActionIcon, {
+                                                size: "xs",
+                                                variant: "light",
+                                                color: "blue",
+                                                onClick: e => {
+                                                  e.stopPropagation();
+                                                  openSessionMessage(session.wsConnectionId, session.userName);
+                                                },
+                                                children: jsx(IconSend, {
+                                                  size: 14
+                                                })
+                                              })
+                                            })]
                                           })
                                         })
                                       })]
                                     }, idx);
                                   })
                                 })]
+                              }), index < array.length - 1 && jsx(Divider, {
+                                my: "md"
                               })]
                             }, deviceId);
                           })
@@ -61274,6 +61730,15 @@ function ConnectedUsers() {
       connectionId: selectedConnection === null || selectedConnection === void 0 ? void 0 : selectedConnection.connectionId,
       userName: selectedConnection === null || selectedConnection === void 0 ? void 0 : selectedConnection.userName,
       sessionHub: FluxoClientSys.Instance.sessionHub
+    }), jsx(SendMessageModal, {
+      opened: sendMessageOpened,
+      onClose: () => setSendMessageOpened(false),
+      mode: messageMode,
+      targetId: messageTarget === null || messageTarget === void 0 ? void 0 : messageTarget.id,
+      targetName: messageTarget === null || messageTarget === void 0 ? void 0 : messageTarget.name,
+      availableUsers: availableUsersForMultipleSelect,
+      sessionHub: FluxoClientSys.Instance.sessionHub,
+      onMessageSent: handleMessageSent
     }), jsx(ConfirmModal, {
       open: showForceLogoutModal,
       title: "Conferma disconnessione",
@@ -64594,7 +65059,7 @@ function McpServerManagement() {
 function Settings(props) {
   const [currentTab, setCurrentTab] = useState('ui');
   const [apiRestDoc, setApiRestDoc] = useState();
-  const navigate = useNavigate();
+  const navigate = useFlxNavigate();
   const {
     hasAdminAccess,
     hasDeveloperAccess,
@@ -64606,6 +65071,9 @@ function Settings(props) {
   } = useAppSelector(state => state.layout.systemSettings);
   const [showBiEditorModal, setShowBiEditorModal] = useState(false);
   const isClosingRef = useRef(false);
+  const {
+    headerHeight
+  } = useShellLayout();
   //useDocumentTitle('Amministrazione');
   // Intercetta il refresh e il cambio tab del browser
   useEffect(() => {
@@ -64829,7 +65297,7 @@ function Settings(props) {
       items: [{
         key: 'bi',
         title: jsx(Text, {
-          children: "BI Editor"
+          children: "BI Designer"
         }),
         onClick: () => {
           //window.location.hash = 'bi';
@@ -65017,7 +65485,11 @@ function Settings(props) {
             children: "KOREBI"
           })]
         }),
-        onClick: () => navigate('/korebi-ide'),
+        onClick: () => navigate('/korebi-ide', {
+          state: {
+            title: "Korebi IDE"
+          }
+        }),
         disabled: false,
         icon: jsx(IconCode, {
           size: 18
@@ -65092,32 +65564,27 @@ function Settings(props) {
           children: jsx(EmailTemplate, {})
         }) : jsx(ErrorPage$1, {});
       case 'apidoc':
-        return hasAdminAccess || hasDeveloperAccess ? jsx(ScrollArea, {
-          style: {
-            height: 'calc(100vh - 132px)'
-          },
-          children: jsx(ApiReferenceReact, {
-            configuration: {
-              darkMode: false,
-              customCss: '.darklight-reference {display: none !important} .references-navigation-list  { height: calc(100vh - 132px) !important; }',
-              hideDarkModeToggle: true,
-              forceDarkModeState: 'light',
-              authentication: {
-                http: {
-                  basic: {
-                    username: "",
-                    password: ""
-                  },
-                  bearer: {
-                    token: localStorage.getItem('access-token')
-                  }
+        return hasAdminAccess || hasDeveloperAccess ? jsx(ApiReferenceReact, {
+          configuration: {
+            showDeveloperTools: 'never',
+            darkMode: false,
+            customCss: `.darklight-reference {display: none !important} aside {height: calc(100vh - 178px) !important; top: ${headerHeight + 40}px !important; } .open-api-client-button {display: none !important}`,
+            hideDarkModeToggle: true,
+            forceDarkModeState: 'light',
+            authentication: {
+              http: {
+                bearer: {
+                  token: localStorage.getItem('access-token')
                 }
-              },
-              spec: {
-                url: FluxoClientSys.Instance.clientConfig.fluxoInstanceUrl.replace('/api', '') + '/openapi/v1.json'
               }
-            }
-          })
+            },
+            sources: [{
+              url: FluxoClientSys.Instance.clientConfig.fluxoInstanceUrl.replace('/api', '') + '/openapi/v1.json',
+              agent: {
+                disabled: true
+              }
+            }]
+          }
         }) : jsx(ErrorPage$1, {});
       /*return apiRestDoc ? (
         <DataCard title={'Documentazione API REST'}>
@@ -65224,42 +65691,47 @@ function Settings(props) {
   });
 }
 
-function MainRoutes(props) {
-  const {
-    hasAdminAccess,
-    hasDeveloperAccess,
-    hasDataAnalystAccess
-  } = useSelector(state => state.layout);
-  const KIde = /*#__PURE__*/lazy(() => import('@fluxo-dev/shell-korebi').then(({
-    KorebiIde
-  }) => ({
-    default: KorebiIde
-  })));
-  return jsxs(FlxRoutes, {
-    children: [props.isAdminFrontend && (hasDeveloperAccess || hasDataAnalystAccess || hasAdminAccess) && jsxs(Fragment, {
-      children: [jsx(Route, {
-        path: 'settings',
-        element: jsx(Settings, {
-          slots: props.fluxoShellProps.slots,
-          pluginEndpoint: props.pluginEndpoint,
-          frontends: props.frontends
-        })
-      }), jsx(Route, {
-        path: 'korebi-ide',
-        element: jsx(Suspense, {
-          children: jsx(KIde, {})
-        })
-      }), jsx(Route, {
-        path: 'ravify/jobs-viewer',
-        element: jsx(JobsViewer, {})
-      })]
-    }), props.fluxoShellProps.ui.security.showMyProfile && jsx(Route, {
+const KIde = /*#__PURE__*/lazy(() => import('@fluxo-dev/shell-korebi').then(({
+  KorebiIde
+}) => ({
+  default: KorebiIde
+})));
+/**
+ * Genera le routes principali come RouteObject[] invece di componente wrapper
+ * Questo evita il remount dei componenti quando si switcha tra sessioni
+ */
+function generateMainRoutes(props, hasAdminAccess, hasDeveloperAccess, hasDataAnalystAccess) {
+  const routes = [];
+  if (props.isAdminFrontend && (hasDeveloperAccess || hasDataAnalystAccess || hasAdminAccess)) {
+    routes.push({
+      path: 'settings',
+      element: jsx(Settings, {
+        slots: props.fluxoShellProps.slots,
+        pluginEndpoint: props.pluginEndpoint,
+        frontends: props.frontends
+      })
+    }, {
+      path: 'korebi-ide',
+      element: jsx(Suspense, {
+        fallback: jsx("div", {
+          children: "Loading..."
+        }),
+        children: jsx(KIde, {})
+      })
+    }, {
+      path: 'ravify/jobs-viewer',
+      element: jsx(JobsViewer, {})
+    });
+  }
+  if (props.fluxoShellProps.ui.security.showMyProfile) {
+    routes.push({
       path: 'me',
       element: jsx(UserProfile, {
         slots: props.fluxoShellProps.slots
       })
-    })]
-  });
+    });
+  }
+  return routes;
 }
 
 function ForgotPassword(props) {
@@ -76907,6 +77379,519 @@ var dxReportingIt = {
 	"ASPxReportsStringId.ReportDesigner_FieldList_AddDataSource": "Aggiungi origine dati"
 };
 
+/**
+ * Hook to manage SessionHub WebSocket connection lifecycle
+ * @param shouldConnect - When true, starts the connection. Use this to delay connection until FluxoClient is initialized
+ */
+const useSessionHub = (shouldConnect = true) => {
+  const isConnecting = useRef(false);
+  const hasStartedRef = useRef(false);
+  const [isConnected, setIsConnected] = useState(false);
+  const hasBeenConnectedOnce = useRef(false); // Flag per tracciare se si è mai connesso
+  // Funzione per avviare la connessione
+  const startConnection = useCallback$1(() => __awaiter(void 0, void 0, void 0, function* () {
+    if (isConnecting.current || hasStartedRef.current) return;
+    isConnecting.current = true;
+    try {
+      yield FluxoClientSys.Instance.sessionHub.start();
+      console.info('✅ SessionHub connection started from useSessionHub hook');
+      // Registra l'handler per ForceLogout subito dopo la connessione
+      FluxoClientSys.Instance.sessionHub.on('ForceLogout', data => {
+        console.warn('🚨 Force logout received from server:', data);
+        FluxoClientSys.Instance.auth.logout();
+      });
+      console.info('🎧 ForceLogout handler registered');
+      hasStartedRef.current = true;
+      setIsConnected(true);
+      hasBeenConnectedOnce.current = true; // Segna che ci siamo connessi almeno una volta
+    } catch (error) {
+      console.error('❌ Failed to start SessionHub connection', error);
+      setIsConnected(false);
+    } finally {
+      isConnecting.current = false;
+    }
+  }), []);
+  // Funzione per fermare la connessione
+  const stopConnection = useCallback$1(() => __awaiter(void 0, void 0, void 0, function* () {
+    if (!hasStartedRef.current) return;
+    try {
+      yield FluxoClientSys.Instance.sessionHub.stop();
+      console.info('🔌 SessionHub connection stopped');
+      hasStartedRef.current = false;
+      setIsConnected(false);
+    } catch (error) {
+      console.error('❌ Failed to stop SessionHub connection', error);
+    }
+  }), []);
+  useEffect(() => {
+    // Start connection when shouldConnect becomes true
+    if (shouldConnect && !hasStartedRef.current && !isConnecting.current) {
+      startConnection();
+    }
+    // Stop connection when shouldConnect becomes false (e.g., user logout)
+    if (!shouldConnect && hasStartedRef.current) {
+      stopConnection();
+    }
+    // Cleanup on unmount
+    return () => {
+      if (hasStartedRef.current) {
+        const cleanup = () => __awaiter(void 0, void 0, void 0, function* () {
+          try {
+            yield FluxoClientSys.Instance.sessionHub.stop();
+            console.info('🔌 SessionHub connection stopped (component unmount)');
+            hasStartedRef.current = false;
+          } catch (error) {
+            console.error('❌ Failed to stop SessionHub on unmount', error);
+          }
+        });
+        cleanup();
+      }
+    };
+  }, [shouldConnect, startConnection, stopConnection]);
+  // Monitora lo stato della connessione ogni 2 secondi
+  useEffect(() => {
+    const checkConnection = () => {
+      const connected = FluxoClientSys.Instance.sessionHub.isConnected;
+      setIsConnected(connected);
+      // Se si connette, segna che ci siamo connessi almeno una volta
+      if (connected) {
+        hasBeenConnectedOnce.current = true;
+      }
+    };
+    const interval = setInterval(checkConnection, 2000);
+    checkConnection(); // Check subito
+    return () => clearInterval(interval);
+  }, []);
+  // Cleanup finale: disconnetti quando il componente viene smontato
+  useEffect(() => {
+    return () => {
+      if (hasStartedRef.current) {
+        const cleanup = () => __awaiter(void 0, void 0, void 0, function* () {
+          try {
+            yield FluxoClientSys.Instance.sessionHub.stop();
+            console.info('SessionHub connection stopped (component unmount)');
+          } catch (error) {
+            console.error('Failed to stop SessionHub connection', error);
+          }
+        });
+        cleanup();
+      }
+    };
+  }, []);
+  // Esponi metodi utili
+  const on = useCallback$1((eventName, handler) => {
+    FluxoClientSys.Instance.sessionHub.on(eventName, handler);
+  }, []);
+  const off = useCallback$1((eventName, handler) => {
+    FluxoClientSys.Instance.sessionHub.off(eventName, handler);
+  }, []);
+  const invoke = useCallback$1((methodName, ...args) => __awaiter(void 0, void 0, void 0, function* () {
+    return yield FluxoClientSys.Instance.sessionHub.invoke(methodName, ...args);
+  }), []);
+  const send = useCallback$1((methodName, ...args) => __awaiter(void 0, void 0, void 0, function* () {
+    yield FluxoClientSys.Instance.sessionHub.send(methodName, ...args);
+  }), []);
+  const getState = useCallback$1(() => {
+    return FluxoClientSys.Instance.sessionHub.state;
+  }, []);
+  const getConnectionId = useCallback$1(() => {
+    return FluxoClientSys.Instance.sessionHub.connectionId;
+  }, []);
+  // ============================================================================
+  // METODI MESSAGING REALTIME
+  // ============================================================================
+  /**
+   * Invia un messaggio broadcast a tutte le sessioni connesse all'applicazione
+   * @param messageType - Tipo del messaggio (es: "Critico", "Informazioni", "Avviso")
+   * @param message - Contenuto testuale del messaggio
+   * @throws HubException in caso di errori
+   */
+  const sendBroadcastMessage = useCallback$1((messageType, message) => __awaiter(void 0, void 0, void 0, function* () {
+    try {
+      yield FluxoClientSys.Instance.sessionHub.invoke('SendBroadcastMessage', messageType, message);
+      console.info(`📢 Broadcast message sent - Type: ${messageType}`);
+    } catch (error) {
+      console.error('❌ Failed to send broadcast message', error);
+      throw error;
+    }
+  }), []);
+  /**
+   * Invia un messaggio a una singola sessione specifica
+   * @param targetConnectionId - ID della connessione WebSocket destinataria
+   * @param messageType - Tipo del messaggio (es: "Critico", "Informazioni", "Avviso")
+   * @param message - Contenuto testuale del messaggio
+   * @throws HubException "Sessione non trovata" se il connectionId non esiste
+   */
+  const sendMessageToSession = useCallback$1((targetConnectionId, messageType, message) => __awaiter(void 0, void 0, void 0, function* () {
+    try {
+      yield FluxoClientSys.Instance.sessionHub.invoke('SendMessageToSession', targetConnectionId, messageType, message);
+      console.info(`📨 Message sent to session ${targetConnectionId} - Type: ${messageType}`);
+    } catch (error) {
+      console.error(`❌ Failed to send message to session ${targetConnectionId}`, error);
+      throw error;
+    }
+  }), []);
+  /**
+   * Invia un messaggio a tutte le sessioni di uno specifico utente
+   * @param targetUserId - ID dell'utente destinatario
+   * @param messageType - Tipo del messaggio (es: "Critico", "Informazioni", "Avviso")
+   * @param message - Contenuto testuale del messaggio
+   * @throws HubException "Nessuna sessione trovata per l'utente specificato"
+   */
+  const sendMessageToUser = useCallback$1((targetUserId, messageType, message) => __awaiter(void 0, void 0, void 0, function* () {
+    try {
+      yield FluxoClientSys.Instance.sessionHub.invoke('SendMessageToUser', targetUserId, messageType, message);
+      console.info(`👤 Message sent to user ${targetUserId} - Type: ${messageType}`);
+    } catch (error) {
+      console.error(`❌ Failed to send message to user ${targetUserId}`, error);
+      throw error;
+    }
+  }), []);
+  /**
+   * Registra un listener per l'evento ReceiveMessage
+   * @param handler - Funzione da chiamare quando arriva un messaggio
+   * @returns Funzione per rimuovere il listener
+   */
+  const onReceiveMessage = useCallback$1(handler => {
+    FluxoClientSys.Instance.sessionHub.on('ReceiveMessage', handler);
+    console.info('🎧 ReceiveMessage handler registered');
+    // Ritorna una funzione per rimuovere il listener
+    return () => {
+      FluxoClientSys.Instance.sessionHub.off('ReceiveMessage', handler);
+      console.info('🔇 ReceiveMessage handler removed');
+    };
+  }, []);
+  // ============================================================================
+  // FINE METODI MESSAGING REALTIME
+  // ============================================================================
+  // Memoizza l'oggetto restituito per evitare re-render inutili del ScreenSharingProvider
+  return useMemo$1(() => ({
+    // Metodi base
+    on,
+    off,
+    invoke,
+    send,
+    getState,
+    getConnectionId,
+    connectionId: FluxoClientSys.Instance.sessionHub.connectionId,
+    isConnected: () => isConnected,
+    connected: isConnected,
+    reconnect: startConnection,
+    disconnect: stopConnection,
+    hasBeenConnectedOnce: hasBeenConnectedOnce.current,
+    // Metodi messaging realtime
+    sendBroadcastMessage,
+    sendMessageToSession,
+    sendMessageToUser,
+    onReceiveMessage
+  }), [on, off, invoke, send, getState, getConnectionId, isConnected, startConnection, stopConnection, sendBroadcastMessage, sendMessageToSession, sendMessageToUser, onReceiveMessage]);
+};
+
+// Funzioni helper per icone e colori (fuori dal componente)
+const getIcon = type => {
+  switch (type) {
+    case 'Critico':
+      return jsx(IconAlertCircle, {
+        size: 20
+      });
+    case 'Errore':
+      return jsx(IconAlertTriangle, {
+        size: 20
+      });
+    case 'Avviso':
+      return jsx(IconAlertTriangle, {
+        size: 20
+      });
+    case 'Successo':
+      return jsx(IconCircleCheck, {
+        size: 20
+      });
+    case 'Informazioni':
+    default:
+      return jsx(IconInfoCircle, {
+        size: 20
+      });
+  }
+};
+const getColor = type => {
+  switch (type) {
+    case 'Critico':
+      return 'red';
+    case 'Errore':
+      return 'red';
+    case 'Avviso':
+      return 'yellow';
+    case 'Successo':
+      return 'green';
+    case 'Informazioni':
+      return 'blue';
+    case 'Alert':
+      return 'orange';
+    default:
+      return 'gray';
+  }
+};
+// Chiave localStorage per persistere i messaggi
+const MESSAGES_STORAGE_KEY = 'fluxo_persisted_messages';
+/**
+ * Modal per visualizzare i messaggi ricevuti dal server
+ * Supporta 3 modalità di visualizzazione:
+ * - Modal: apre un modal tradizionale
+ * - Toast: notifica bottom-right che resta aperta finché l'utente non la chiude
+ * - NotificationBar: barra full-width fixed top che resta aperta finché l'utente non la chiude
+ *
+ * I messaggi sono persistiti in localStorage e ricompaiono al refresh della pagina
+ */
+const MessageReceiverModal = () => {
+  const [currentMessage, setCurrentMessage] = useState(null);
+  const [opened, setOpened] = useState(false);
+  // Funzione per ottenere i messaggi da localStorage
+  const getMessagesFromStorage = useCallback$1(() => {
+    try {
+      const stored = localStorage.getItem(MESSAGES_STORAGE_KEY);
+      return stored ? JSON.parse(stored) : [];
+    } catch (error) {
+      console.error('Errore lettura messaggi da localStorage:', error);
+      return [];
+    }
+  }, []);
+  // Funzione per rimuovere un messaggio da localStorage
+  const removeMessageFromStorage = useCallback$1(messageId => {
+    try {
+      const existingMessages = getMessagesFromStorage();
+      const filtered = existingMessages.filter(msg => msg.id !== messageId);
+      localStorage.setItem(MESSAGES_STORAGE_KEY, JSON.stringify(filtered));
+      console.log('✅ Messaggio rimosso da localStorage:', messageId);
+    } catch (error) {
+      console.error('Errore rimozione messaggio da localStorage:', error);
+    }
+  }, [getMessagesFromStorage]);
+  // Funzione per salvare un messaggio in localStorage
+  const saveMessageToStorage = useCallback$1(message => {
+    try {
+      const existingMessages = getMessagesFromStorage();
+      const persistedMessage = Object.assign(Object.assign({}, message), {
+        id: `${message.timestamp}-${Math.random().toString(36).substr(2, 9)}`
+      });
+      existingMessages.push(persistedMessage);
+      localStorage.setItem(MESSAGES_STORAGE_KEY, JSON.stringify(existingMessages));
+      return persistedMessage.id;
+    } catch (error) {
+      console.error('Errore salvataggio messaggio in localStorage:', error);
+      return null;
+    }
+  }, [getMessagesFromStorage]);
+  // Funzione per mostrare una notifica (Toast o NotificationBar)
+  const showNotification = useCallback$1((data, messageId, position, isBar = false) => {
+    notifications.show({
+      id: messageId,
+      // Usa l'ID univoco
+      title: data.messageType,
+      message: data.message,
+      color: getColor(data.messageType),
+      icon: getIcon(data.messageType),
+      autoClose: false,
+      // Tutti i messaggi devono essere chiusi manualmente
+      withCloseButton: true,
+      position,
+      styles: isBar ? {
+        root: {
+          width: '100%',
+          maxWidth: '100%',
+          margin: 0,
+          borderRadius: 0
+        }
+      } : undefined,
+      onClose: () => {
+        // Rimuovi da localStorage quando viene chiuso
+        removeMessageFromStorage(messageId);
+      }
+    });
+  }, [removeMessageFromStorage]);
+  // Ripristina i messaggi persistiti al mount
+  useEffect(() => {
+    const persistedMessages = getMessagesFromStorage();
+    console.log('📦 Ripristino messaggi persistiti:', persistedMessages.length);
+    let firstModalShown = false;
+    persistedMessages.forEach(msg => {
+      if (msg.displayType === 'Modal') {
+        // Per i modal, mostra solo il primo (gli altri verranno mostrati dopo)
+        if (!firstModalShown) {
+          setCurrentMessage(msg);
+          setOpened(true);
+          firstModalShown = true;
+        }
+      } else if (msg.displayType === 'Toast') {
+        showNotification(msg, msg.id, 'bottom-right');
+      } else if (msg.displayType === 'NotificationBar') {
+        showNotification(msg, msg.id, 'top-center', true);
+      } else {
+        // Fallback
+        showNotification(msg, msg.id, 'bottom-right');
+      }
+    });
+  }, [getMessagesFromStorage, showNotification]);
+  useEffect(() => {
+    const handleReceiveMessage = data => {
+      console.log('📩 Messaggio ricevuto:', data);
+      // Salva il messaggio in localStorage
+      const messageId = saveMessageToStorage(data);
+      if (!messageId) return;
+      // Crea il messaggio persistito con ID
+      const persistedMsg = Object.assign(Object.assign({}, data), {
+        id: messageId
+      });
+      // Gestisci in base al displayType
+      if (data.displayType === 'Modal') {
+        // Mostra il modal tradizionale
+        setCurrentMessage(persistedMsg);
+        setOpened(true);
+      } else if (data.displayType === 'Toast') {
+        // Toast: notifica bottom-right che resta aperta finché l'utente non la chiude
+        showNotification(data, messageId, 'bottom-right');
+      } else if (data.displayType === 'NotificationBar') {
+        // NotificationBar: barra full-width fixed top che resta aperta
+        showNotification(data, messageId, 'top-center', true);
+      } else {
+        // Fallback: mostra come Toast
+        showNotification(data, messageId, 'bottom-right');
+      }
+      // Riproduci suono/notifica browser (opzionale)
+      if ('Notification' in window && Notification.permission === 'granted') {
+        new Notification(`${data.messageType}: ${data.message.substring(0, 50)}...`);
+      }
+    };
+    // Registra l'event handler direttamente su FluxoClientSys
+    FluxoClientSys.Instance.sessionHub.on('ReceiveMessage', handleReceiveMessage);
+    console.info('🎧 MessageReceiverModal: ReceiveMessage handler registered');
+    return () => {
+      FluxoClientSys.Instance.sessionHub.off('ReceiveMessage', handleReceiveMessage);
+      console.info('🔇 MessageReceiverModal: ReceiveMessage handler removed');
+    };
+  }, [saveMessageToStorage, showNotification]);
+  // Richiedi permesso notifiche all'avvio (opzionale)
+  useEffect(() => {
+    if ('Notification' in window && Notification.permission === 'default') {
+      Notification.requestPermission();
+    }
+  }, []);
+  const handleClose = () => {
+    // Rimuovi il messaggio da localStorage quando viene chiuso
+    if (currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.id) {
+      removeMessageFromStorage(currentMessage.id);
+    }
+    setOpened(false);
+    setCurrentMessage(null);
+    // Controlla se ci sono altri messaggi Modal da mostrare
+    const remainingMessages = getMessagesFromStorage();
+    const nextModal = remainingMessages.find(msg => msg.displayType === 'Modal');
+    if (nextModal) {
+      setCurrentMessage(nextModal);
+      setOpened(true);
+    }
+  };
+  if (!currentMessage) return null;
+  const isCritical = currentMessage.messageType === 'Critico';
+  return jsx(Modal, {
+    opened: opened,
+    onClose: handleClose,
+    centered: true,
+    title: jsxs(Group, {
+      gap: "sm",
+      children: [getIcon(currentMessage.messageType), jsx(Text, {
+        fw: 500,
+        size: "md",
+        children: currentMessage.messageType
+      })]
+    }),
+    size: "md",
+    closeOnClickOutside: !isCritical,
+    closeOnEscape: !isCritical,
+    withCloseButton: !isCritical,
+    overlayProps: {
+      backgroundOpacity: 0.55,
+      blur: 8
+    },
+    children: jsxs(Stack, {
+      gap: "md",
+      children: [jsx(Alert, {
+        icon: getIcon(currentMessage.messageType),
+        color: getColor(currentMessage.messageType),
+        variant: "light",
+        styles: {
+          root: {
+            border: `1px solid var(--mantine-color-${getColor(currentMessage.messageType)}-3)`
+          }
+        },
+        children: jsx(Text, {
+          size: "sm",
+          style: {
+            whiteSpace: 'pre-wrap',
+            lineHeight: 1.6
+          },
+          children: currentMessage.message
+        })
+      }), jsx(Divider, {}), jsx(Box, {
+        p: "xs",
+        style: {
+          backgroundColor: 'var(--mantine-color-gray-0)',
+          borderRadius: '4px',
+          border: '1px solid var(--mantine-color-gray-2)'
+        },
+        children: jsxs(Group, {
+          gap: "md",
+          justify: "space-between",
+          children: [jsxs(Box, {
+            children: [jsx(Text, {
+              size: "xs",
+              c: "dimmed",
+              fw: 500,
+              children: "Ricevuto il"
+            }), jsx(Text, {
+              size: "xs",
+              fw: 500,
+              children: new Date(currentMessage.timestamp).toLocaleString('it-IT', {
+                day: '2-digit',
+                month: '2-digit',
+                year: 'numeric',
+                hour: '2-digit',
+                minute: '2-digit'
+              })
+            })]
+          }), currentMessage.targetUserId && jsxs(Box, {
+            style: {
+              textAlign: 'right'
+            },
+            children: [jsx(Text, {
+              size: "xs",
+              c: "dimmed",
+              fw: 500,
+              children: "User ID"
+            }), jsx(Text, {
+              size: "xs",
+              fw: 500,
+              ff: "monospace",
+              children: currentMessage.targetUserId
+            })]
+          })]
+        })
+      }), jsx(Group, {
+        justify: "flex-end",
+        gap: "sm",
+        children: jsx(Button, {
+          variant: isCritical ? 'filled' : 'light',
+          color: getColor(currentMessage.messageType),
+          onClick: handleClose,
+          leftSection: isCritical ? undefined : jsx(IconX, {
+            size: 16
+          }),
+          children: isCritical ? 'Ho capito' : 'Chiudi'
+        })
+      })]
+    })
+  });
+};
+
 var ShellUINavigation;
 (function (ShellUINavigation) {
   ShellUINavigation[ShellUINavigation["Sidebar"] = 1] = "Sidebar";
@@ -77202,15 +78187,14 @@ function FluxoShell(props) {
           children: [{
             index: true,
             element: flxFrontend.dashboardComponent
-          }, {
-            path: '/*',
-            element: jsx(MainRoutes, {
-              fluxoShellProps: props,
-              isAdminFrontend: flxFrontend.id === 'admin',
-              pluginEndpoint: props.pluginEndpoint,
-              frontends: props.frontends
-            })
-          }, ...generateRoutesFromEmbeddedModules(flxFrontend, 'protected'), ...generateRoutesFromDeployedApps(flxFrontend, res.apps), ...generateRoutesFromJitApps(flxFrontend)]
+          },
+          // Espande le routes di MainRoutes direttamente qui per evitare il wrapper
+          ...generateMainRoutes({
+            fluxoShellProps: props,
+            isAdminFrontend: flxFrontend.id === 'admin',
+            pluginEndpoint: props.pluginEndpoint,
+            frontends: props.frontends
+          }, res.hasAdminAccess || false, res.hasDeveloperAccess || false, res.hasDataAnalystAccess || false), ...generateRoutesFromEmbeddedModules(flxFrontend, 'protected'), ...generateRoutesFromDeployedApps(flxFrontend, res.apps), ...generateRoutesFromJitApps(flxFrontend)]
         }, {
           path: '*',
           element: jsx(ErrorPage, {})
@@ -77394,13 +78378,13 @@ function SessionHubManager({
   return null; // Componente invisibile, gestisce solo la logica
 }
 function AppInner(props) {
-  return jsx(React__default.Suspense, {
+  return jsxs(React__default.Suspense, {
     fallback: jsx(Fragment, {
       children: "..."
     }),
-    children: jsx(RouterProvider, {
+    children: [jsx(MessageReceiverModal, {}), jsx(RouterProvider, {
       router: props.router
-    })
+    })]
   });
 }
 
@@ -77413,7 +78397,6 @@ function LockedResource({
   onResourceUnlocked,
   readOnlyMode = false
 }) {
-  const sessionHub = useSessionHub(false);
   const [resourceIsAlreadyLocked, setResourceIsAlreadyLocked] = useState(false);
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState(null);
@@ -77435,7 +78418,7 @@ function LockedResource({
   }, [onResourceLocked, onResourceUnlocked]);
   // Funzione per eseguire il lock check
   const performLockCheck = React__default.useCallback((showLoader = true) => {
-    if (!sessionHub || !sessionHub.isConnected()) {
+    if (!FluxoClientSys.Instance.sessionHub || !FluxoClientSys.Instance.sessionHub.isConnected) {
       return;
     }
     // Mostra il loader solo se richiesto (primo check)
@@ -77443,11 +78426,11 @@ function LockedResource({
       setIsLoading(true);
     }
     setError(null);
-    sessionHub.invoke('LockResource', resourceId, componentId.current).then(res => {
-      var _a, _b, _c;
+    FluxoClientSys.Instance.sessionHub.invoke('LockResource', resourceId, componentId.current).then(res => {
+      var _a, _b;
       const isLocked = res.isAlreadyLocked;
-      const currentWsConnectionId = ((_a = sessionHub.getConnectionId) === null || _a === void 0 ? void 0 : _a.call(sessionHub)) || sessionHub.connectionId;
-      const lockingWsConnectionId = (_b = res.session) === null || _b === void 0 ? void 0 : _b.wsConnectionId;
+      const currentWsConnectionId = FluxoClientSys.Instance.sessionHub.connectionId;
+      const lockingWsConnectionId = (_a = res.session) === null || _a === void 0 ? void 0 : _a.wsConnectionId;
       // Verifica se la risorsa è bloccata dalla stessa sessione WebSocket
       const isSameSession = isLocked && currentWsConnectionId && lockingWsConnectionId && currentWsConnectionId === lockingWsConnectionId;
       setResourceIsAlreadyLocked(isLocked);
@@ -77455,7 +78438,7 @@ function LockedResource({
       setIsLoading(false);
       setHasCheckedOnce(true);
       // Salva l'username dell'utente che ha bloccato la risorsa
-      if (isLocked && ((_c = res.session) === null || _c === void 0 ? void 0 : _c.userName)) {
+      if (isLocked && ((_b = res.session) === null || _b === void 0 ? void 0 : _b.userName)) {
         setLockedByUser(res.session.userName);
       } else {
         setLockedByUser(null);
@@ -77476,7 +78459,7 @@ function LockedResource({
         onResourceLockedRef.current();
       }
     });
-  }, [sessionHub, resourceId]);
+  }, [resourceId]);
   // Lock della risorsa all'avvio
   useEffect(() => {
     performLockCheck(true); // Mostra il loader al primo check
@@ -77484,12 +78467,12 @@ function LockedResource({
   // Monitora lo stato di connessione e ri-esegui il check quando si riconnette
   useEffect(() => {
     // Aspetta che il primo check sia completato prima di monitorare la connessione
-    if (!sessionHub || !hasCheckedOnce) return;
-    const currentConnectionState = sessionHub.isConnected();
+    if (!hasCheckedOnce) return;
+    const currentConnectionState = FluxoClientSys.Instance.sessionHub.isConnected;
     setIsConnected(currentConnectionState);
     // Polling per monitorare lo stato di connessione
     const interval = setInterval(() => {
-      const newConnectionState = sessionHub.isConnected();
+      const newConnectionState = FluxoClientSys.Instance.sessionHub.isConnected;
       // Solo se passa da disconnesso a connesso, ri-esegui il check
       if (newConnectionState && !isConnected) {
         console.log('🔄 SessionHub riconnesso, ri-verifico il lock della risorsa:', resourceId);
@@ -77498,23 +78481,17 @@ function LockedResource({
       setIsConnected(newConnectionState);
     }, 2000);
     return () => clearInterval(interval);
-  }, [sessionHub, isConnected, performLockCheck, resourceId, hasCheckedOnce]);
-  // Ref per sessionHub per evitare di catturarlo nella closure
-  const sessionHubRef = useRef(sessionHub);
-  useEffect(() => {
-    sessionHubRef.current = sessionHub;
-  }, [sessionHub]);
+  }, [isConnected, performLockCheck, resourceId, hasCheckedOnce]);
   // Unlock della risorsa alla cleanup (solo al vero unmount)
   useEffect(() => {
     // Salva i valori al mount per usarli nel cleanup
     const currentResourceId = resourceId;
     const currentComponentId = componentId.current;
     return () => {
-      // Usa il ref aggiornato di sessionHub
-      const currentSessionHub = sessionHubRef.current;
-      if (currentSessionHub && currentSessionHub.isConnected()) {
+      // Usa FluxoClientSys.Instance.sessionHub direttamente
+      if (FluxoClientSys.Instance.sessionHub && FluxoClientSys.Instance.sessionHub.isConnected) {
         console.log('🔓 Unlock risorsa al unmount:', currentResourceId, currentComponentId);
-        currentSessionHub.invoke('UnlockResource', currentResourceId, currentComponentId).catch(err => {
+        FluxoClientSys.Instance.sessionHub.invoke('UnlockResource', currentResourceId, currentComponentId).catch(err => {
           console.error('Error unlocking resource:', err);
         });
       }
@@ -77691,4 +78668,4 @@ function LockedResource({
   });
 }
 
-export { FluxoShell, FrontendSwitch, LockedResource, ScreenSharingProvider, ScreenSharingWidget, ShellSessionContext, ShellUINavigation, ShellUISearchPosition, ShellUISearchType, useScreenSharingContext, useSessionHub };
+export { FluxoShell, FrontendSwitch, LockedResource, MessageReceiverModal, ScreenSharingProvider, ScreenSharingWidget, ShellSessionContext, ShellUINavigation, ShellUISearchPosition, ShellUISearchType, useScreenSharingContext, useSessionHub };