@admin-layout/tailwind-design-pro 12.0.16-alpha.2 → 12.0.16-alpha.23

package/lib/components/Layout/Sidebar/PerplexSidebar.js

@@ -0,0 +1,170 @@
+import {jsxs,jsx}from'react/jsx-runtime';import React__default,{useState,useEffect}from'react';import {useTranslation}from'react-i18next';import BottomMenuDropDown from'../GlobalFooter/BottomMenuDropdown.js';import {getMenuSeparation}from'@admin-layout/client';import {Divider}from'./Divider.js';import {PerplexSidebarMenu}from'./PerplexSidebarMenu.js';import {RightContent}from'../GlobalHeader/RightContent.js';import'@react-icons/all-files/fa/FaSearch.js';import'@react-icons/all-files/io5/IoMenu.js';import'@react-icons/all-files/ai/AiOutlineDash.js';import'@react-icons/all-files/fa/FaChevronDown.js';import'@react-icons/all-files/fa/FaChevronUp.js';import'@react-icons/all-files/fa/FaChevronRight.js';import'@react-icons/all-files/fa/FaChevronLeft.js';import'@react-icons/all-files/md/MdClose.js';import'@react-icons/all-files/ri/RiSettings5Fill.js';import'@react-icons/all-files/io/IoMdCopy.js';import'@react-icons/all-files/fa/FaCheck.js';import'@react-icons/all-files/io5/IoChevronBackCircleOutline.js';import'@react-icons/all-files/io5/IoChevronForwardCircleOutline.js';import'@react-icons/all-files/ri/RiPushpinLine.js';import'@react-icons/all-files/ri/RiPushpinFill.js';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import {useMediaQuery}from'../../../hooks/useMediaQuery.js';const PerplexSidebar = props => {
+  const {
+    isSideMenuOpen,
+    closeSideMenu,
+    menuData,
+    collapsed,
+    routeParams,
+    settings,
+    setCollapsed,
+    location,
+    siderPinned,
+    setSiderPinned,
+    layoutSettings,
+    actor
+  } = props;
+  const [isPagesMenuOpen, setIsPagesMenuOpen] = useState(false);
+  const [iconModule, setIconModule] = React__default.useState(null);
+  const {
+    t,
+    i18n
+  } = useTranslation('menu');
+  const {
+    isMobile
+  } = useMediaQuery();
+  const currentRoute = location?.pathname || '/';
+  const routeSettings = settings?.routeSettings?.[currentRoute] || settings?.routeSettings?.['/'] || settings;
+  const deviceType = isMobile ? 'mobile' : 'desktop';
+  const deviceLayout = routeSettings?.layout?.[deviceType] || {};
+  useEffect(() => {
+    if (!iconModule) {
+      import('./DynamicIcon.js').then(module => {
+        setIconModule(module);
+      });
+    }
+  }, []);
+  // Close sidebar when clicking outside on mobile
+  useEffect(() => {
+    const handleClickOutside = event => {
+      const sidebar = document.getElementById('mobile-sidebar');
+      if (sidebar && !sidebar.contains(event.target) && isSideMenuOpen) {
+        closeSideMenu();
+      }
+    };
+    document.addEventListener('mousedown', handleClickOutside);
+    return () => {
+      document.removeEventListener('mousedown', handleClickOutside);
+    };
+  }, [isSideMenuOpen, closeSideMenu]);
+  // Close sidebar when pressing escape
+  useEffect(() => {
+    const handleEscape = event => {
+      if (event.key === 'Escape' && isSideMenuOpen) {
+        closeSideMenu();
+      }
+    };
+    document.addEventListener('keydown', handleEscape);
+    return () => {
+      document.removeEventListener('keydown', handleEscape);
+    };
+  }, [isSideMenuOpen, closeSideMenu]);
+  const {
+    upperMenus,
+    middleMenus,
+    lowerMenus,
+    bottomMenus
+  } = getMenuSeparation(menuData || []);
+  const updateMenuIcons = (menuItems = []) => {
+    if (!menuItems || !Array.isArray(menuItems)) return [];
+    return menuItems.map(item => {
+      const updatedItem = {
+        ...item,
+        name: t(item.name),
+        icon: iconModule && item.icon ? iconModule.renderDynamicIcon(item.icon) : null
+      };
+      if (updatedItem.children) {
+        updatedItem.children = updateMenuIcons(updatedItem.children);
+      }
+      return updatedItem;
+    });
+  };
+  const bottomMenusData = {
+    menuData: updateMenuIcons(bottomMenus)
+  };
+  // Use CSS classes instead of theme-based styling
+  const getSidebarClasses = () => {
+    let classes = 'text-gray-500 dark:text-gray-400 md:h-[93vh] h-full flex flex-col';
+    if (settings?.navTheme === 'realDark') {
+      classes += ' themed-sidebar';
+    }
+    return classes;
+  };
+  const SidebarStyles = React__default.useMemo(() => ({
+    backgroundColor: settings?.navTheme === 'realDark' ? '#222' : '',
+    color: settings?.navTheme === 'realDark' ? '#fff !important' : ''
+  }), [settings]);
+  // Helper function to render a separator with a name
+  const renderSeparator = name => {
+    if (!deviceLayout?.splitMenus) return null;
+    return collapsed ? jsx("hr", {
+      className: "border-t border-border"
+    }) : jsx(Divider, {
+      className: "text-muted-foreground border-border my-2 p-0",
+      plain: true,
+      children: name
+    });
+  };
+  const renderSidebarContent = () => {
+    return jsxs("div", {
+      className: getSidebarClasses(),
+      style: SidebarStyles,
+      children: [jsx("div", {
+        className: "relative"
+      }), jsxs("div", {
+        className: "flex-grow overflow-y-auto",
+        children: [middleMenus?.length > 0 && jsxs("div", {
+          className: "removeBoxShadow",
+          children: [renderSeparator(deviceLayout?.middleMenuDividerName), jsx(PerplexSidebarMenu, {
+            menuData: updateMenuIcons(middleMenus),
+            routeParams: routeParams,
+            settings: settings,
+            collapsed: collapsed,
+            siderPinned: siderPinned,
+            setSiderPinned: setSiderPinned,
+            actor: actor
+          })]
+        }), lowerMenus?.length > 0 && jsxs("div", {
+          className: "removeBoxShadow",
+          children: [renderSeparator(deviceLayout?.lowerMenuDividerName), jsx(PerplexSidebarMenu, {
+            menuData: updateMenuIcons(lowerMenus),
+            routeParams: routeParams,
+            settings: settings,
+            collapsed: collapsed,
+            siderPinned: siderPinned,
+            setSiderPinned: setSiderPinned,
+            actor: actor
+          })]
+        }), jsx("div", {
+          className: "p-4",
+          children: deviceLayout?.navigationMode === 'sidebar' && jsx(RightContent, {
+            upperMenus: upperMenus,
+            collapsed: collapsed,
+            routeParams: routeParams,
+            settings: settings
+          })
+        })]
+      }), jsx("div", {
+        className: "flex-shrink-0 p-4 border-t border-border",
+        children: jsx(BottomMenuDropDown, {
+          menus: bottomMenusData,
+          collapsed: collapsed,
+          routeParams: routeParams,
+          layoutSettings: layoutSettings
+        })
+      })]
+    });
+  };
+  return jsxs("div", {
+    children: [!isMobile && jsx("aside", {
+      className: `${deviceLayout?.fixedSidebar ? 'fixed' : 'relative'} border-r border-border z-20 h-screen bg-card text-card-foreground md:block flex-shrink-0 transition-all duration-300 ease-in-out w-[92px]`,
+      children: renderSidebarContent()
+    }), isSideMenuOpen && isMobile && jsx("div", {
+      className: "fixed inset-0 z-10 flex items-end bg-black bg-opacity-50 sm:items-center sm:justify-center transition-opacity duration-300",
+      onClick: closeSideMenu
+    }), isSideMenuOpen && isMobile && jsx("aside", {
+      id: "mobile-sidebar",
+      className: `fixed inset-0 z-20 flex-shrink-0 bg-card text-card-foreground md:hidden transition-transform duration-300 ease-in-out transform w-[92px]`,
+      children: renderSidebarContent()
+    })]
+  });
+};export{PerplexSidebar,PerplexSidebar as default};//# sourceMappingURL=PerplexSidebar.js.map

package/lib/components/Layout/Sidebar/PerplexSidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PerplexSidebar.js","sources":["../../../../src/components/Layout/Sidebar/PerplexSidebar.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"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"}

package/lib/components/Layout/Sidebar/PerplexSidebarMenu.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { SidebarMenuProps } from '../../typings';
+export declare const PerplexSidebarMenu: React.FC<SidebarMenuProps>;
+//# sourceMappingURL=PerplexSidebarMenu.d.ts.map

package/lib/components/Layout/Sidebar/PerplexSidebarMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PerplexSidebarMenu.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/Sidebar/PerplexSidebarMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAMnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAEjD,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAkVzD,CAAC"}

package/lib/components/Layout/Sidebar/PerplexSidebarMenu.js

@@ -0,0 +1,261 @@
+import {jsx,jsxs}from'react/jsx-runtime';import React__default,{useState,useEffect}from'react';import {useSelector}from'@xstate/react';import {useLocation,Link}from'@remix-run/react';import {generateMenuPath}from'@admin-layout/client';import {icons}from'../../../icons.js';const PerplexSidebarMenu = ({
+  menuData,
+  routeParams,
+  settings,
+  collapsed,
+  siderPinned,
+  setSiderPinned,
+  actor
+}) => {
+  const [openMenus, setOpenMenus] = useState([]);
+  const [hoveredMenu, setHoveredMenu] = useState(null);
+  const [popupPosition, setPopupPosition] = useState({
+    top: 0,
+    height: 0
+  });
+  const [headerOffset, setHeaderOffset] = useState(0);
+  const hoverCloseTimeout = React__default.useRef(null);
+  const {
+    PushpinLineIcon,
+    PushpinFillIcon
+  } = icons;
+  const location = useLocation();
+  const machineState = useSelector(actor, state => state);
+  const pinnedPath = machineState?.context?.sidebar?.pinnedPath || null;
+  const isMenuItemActive = itemPath => {
+    const currentPath = location.pathname;
+    const menuPath = generateMenuPath(itemPath, routeParams);
+    // Exact match
+    if (currentPath === menuPath) {
+      return true;
+    }
+    // Check if current path is a child of the menu item path
+    if (menuPath && currentPath.startsWith(menuPath + '/')) {
+      return true;
+    }
+    return false;
+  };
+  const toggleMenu = (path, depth, e) => {
+    e.preventDefault();
+    if (collapsed) return;
+    setOpenMenus(prev => {
+      if (prev.includes(path)) {
+        return prev.filter(item => item !== path);
+      } else {
+        return [...prev, path];
+      }
+    });
+  };
+  const handleMenuClick = (path, hasChildren, depth, e) => {
+    if (hasChildren && !collapsed) {
+      toggleMenu(path, depth, e);
+    }
+  };
+  const getFirstLetter = name => {
+    return name.charAt(0).toUpperCase();
+  };
+  const getFirstWord = name => {
+    if (!name) return '';
+    const parts = name.trim().split(/\s+/);
+    return parts[0] || name;
+  };
+  const handleMenuHover = (e, item, isHoverMenu, depth = 0) => {
+    // Only set hover state if the menu has children
+    const canShowHoverPopup = collapsed && !isHoverMenu || !collapsed && depth === 0 && !isHoverMenu;
+    if (item.children && item.children.length > 0 && canShowHoverPopup) {
+      const element = e.currentTarget;
+      const rect = element.getBoundingClientRect();
+      // Calculate position ensuring it stays within viewport roughly
+      const viewportHeight = window.innerHeight;
+      let top = rect.top;
+      const maxTop = Math.max(8, viewportHeight - 300); // crude lower bound to avoid going off screen
+      if (top > maxTop) top = maxTop;
+      setPopupPosition({
+        top: top,
+        height: rect.height
+      });
+      if (hoverCloseTimeout.current) {
+        window.clearTimeout(hoverCloseTimeout.current);
+        hoverCloseTimeout.current = null;
+      }
+      setHoveredMenu(item.path);
+      // If a different top-level item is hovered while pinned, update pinnedPath
+      if (depth === 0 && pinnedPath) {
+        actor?.send({
+          type: 'UPDATE',
+          value: {
+            'sidebar.pinnedPath': item.path
+          }
+        });
+      }
+    }
+  };
+  const handleMenuLeave = (item, isHoverMenu) => {
+    if (!isHoverMenu) {
+      if (hoverCloseTimeout.current) {
+        window.clearTimeout(hoverCloseTimeout.current);
+      }
+      hoverCloseTimeout.current = window.setTimeout(() => {
+        setHoveredMenu(null);
+      }, 120);
+    }
+  };
+  // Measure global header height so the rail starts below it
+  useEffect(() => {
+    const computeHeaderOffset = () => {
+      const headerEl = document.querySelector('header');
+      const measured = headerEl ? headerEl.getBoundingClientRect().height : 0;
+      setHeaderOffset(measured || 0);
+    };
+    computeHeaderOffset();
+    window.addEventListener('resize', computeHeaderOffset);
+    return () => window.removeEventListener('resize', computeHeaderOffset);
+  }, []);
+  const toggleSiderPinned = (e, path) => {
+    e.preventDefault();
+    e.stopPropagation();
+    const nextPinned = pinnedPath === path ? null : path;
+    actor?.send({
+      type: 'UPDATE',
+      value: {
+        'sidebar.pinnedPath': nextPinned
+      }
+    });
+    setHoveredMenu(path);
+    setSiderPinned(!siderPinned);
+  };
+  const renderPopupMenu = (item, depth = 0) => {
+    if (!item.children || item.children.length === 0) return null;
+    const sidebarWidth = 92; // Updated fixed sidebar rail width
+    return jsxs("div", {
+      className: "fixed border border-border z-[999] overflow-hidden bg-background",
+      style: {
+        left: `${sidebarWidth}px`,
+        top: `${headerOffset}px`,
+        height: `calc(100vh - ${headerOffset}px)`,
+        animation: 'fadeIn 0.2s ease-out forwards',
+        width: '228px',
+        maxWidth: 'calc(100vw - 100px)'
+      },
+      onMouseEnter: () => {
+        if (hoverCloseTimeout.current) {
+          window.clearTimeout(hoverCloseTimeout.current);
+          hoverCloseTimeout.current = null;
+        }
+        // keep the popup open while hovering it
+        setHoveredMenu(item.path);
+      },
+      onMouseLeave: () => {
+        if (pinnedPath === item.path) return; // don't close if pinned
+        if (hoverCloseTimeout.current) {
+          window.clearTimeout(hoverCloseTimeout.current);
+        }
+        hoverCloseTimeout.current = window.setTimeout(() => setHoveredMenu(null), 120);
+      },
+      children: [jsx("style", {
+        dangerouslySetInnerHTML: {
+          __html: `
+                    @keyframes fadeIn {
+                        from { opacity: 0; transform: translateX(-10px); }
+                        to { opacity: 1; transform: translateX(0); }
+                    }
+                    `
+        }
+      }), jsxs("div", {
+        className: "font-medium text-sm px-3 py-2 border-b border-border bg-muted sticky top-0 flex items-center justify-between",
+        children: [jsx("span", {
+          className: "text-primary whitespace-nowrap overflow-hidden text-ellipsis pr-2",
+          children: item.name
+        }), jsx("button", {
+          className: "text-muted-foreground hover:text-primary transition-colors",
+          "aria-label": pinnedPath === item.path ? 'Unpin' : 'Pin',
+          onClick: e => toggleSiderPinned(e, item.path),
+          children: pinnedPath === item.path ? jsx(PushpinFillIcon, {
+            className: "h-4 w-4"
+          }) : jsx(PushpinLineIcon, {
+            className: "h-4 w-4"
+          })
+        })]
+      }), jsx("div", {
+        className: "overflow-y-auto overflow-x-hidden py-1",
+        style: {
+          height: `calc(100vh - ${headerOffset}px - 44px)`
+        },
+        children: item.children.map(child => jsx("div", {
+          className: "w-full min-w-max",
+          children: renderMenuItem(child, depth + 1, true)
+        }, child.path))
+      })]
+    });
+  };
+  const renderMenuItem = (item, depth = 0, isHoverMenu = false) => {
+    const hasChildren = item.children && item.children.length > 0;
+    const isOpen = openMenus.includes(item.path);
+    const isActive = isMenuItemActive(item.path);
+    const isHovered = hoveredMenu === item.path;
+    const paddingLeft = `${depth * 1}rem`;
+    // Determine styling based on whether it's a parent or child item
+    const isParentWithChildren = hasChildren && depth === 0;
+    const shouldApplyBackground = isHovered || !isParentWithChildren && isActive;
+    return jsxs("div", {
+      className: `w-full relative group ${isHovered && collapsed && !isHoverMenu ? `rounded-themed` : ''}`,
+      style: {
+        backgroundColor: isHovered && !isHoverMenu ? 'hsl(var(--muted))' : ''
+      },
+      onMouseEnter: e => handleMenuHover(e, item, isHoverMenu, depth),
+      onMouseLeave: () => handleMenuLeave(item, isHoverMenu),
+      children: [depth === 0 && (isActive || isParentWithChildren && isHovered) && jsx("span", {
+        className: "absolute left-0 top-1 bottom-1 w-0.5 bg-primary rounded-sm"
+      }), jsx(Link, {
+        to: hasChildren && (collapsed || !collapsed && depth === 0) && !isHoverMenu ? '#' : generateMenuPath(item?.path, routeParams),
+        className: `flex items-center justify-between w-full px-1 py-2 hover:bg-muted text-xs cursor-pointer transition-colors rounded-themed mx-1 my-1 whitespace-nowrap overflow-hidden text-ellipsis ${shouldApplyBackground ? 'bg-muted' : ''}`,
+        style: {
+          paddingLeft: depth === 0 && !isHoverMenu ? '0.25rem' : `calc(1rem + ${paddingLeft})`
+        },
+        onClick: e => handleMenuClick(item.path, hasChildren && depth > 0, depth, e),
+        children: jsxs("div", {
+          className: `flex ${depth === 0 && !isHoverMenu ? 'flex-col items-center justify-center w-full gap-1' : 'items-center gap-3'}`,
+          children: [item.icon ? jsx("span", {
+            className: `flex-shrink-0 ${isActive ? 'text-primary' : 'text-muted-foreground'} ${depth === 0 && !isHoverMenu ? 'text-[20px]' : ''}`,
+            style: {
+              color: !isActive && settings?.navTheme === 'realDark' ? '#fff' : undefined
+            },
+            children: item.icon
+          }) : jsx("span", {
+            className: `flex items-center justify-center flex-shrink-0 ${isActive ? 'text-primary' : 'text-muted-foreground'} ${depth === 0 && !isHoverMenu ? 'text-[16px] h-6 w-6 rounded-md bg-muted select-none text-center' : ''}`,
+            style: {
+              color: !isActive && settings?.navTheme === 'realDark' ? '#fff' : undefined
+            },
+            children: getFirstLetter(item.name)
+          }), depth === 0 && !isHoverMenu ? jsx("span", {
+            className: `font-medium text-[11px] leading-4 text-center whitespace-nowrap overflow-hidden text-ellipsis w-full px-1 ${isActive ? 'text-primary' : 'text-foreground'}`,
+            style: {
+              color: !isActive && settings?.navTheme === 'realDark' ? '#fff' : undefined
+            },
+            title: item.name,
+            children: getFirstWord(item.name)
+          }) : (!collapsed || isHoverMenu) && jsx("span", {
+            className: `font-medium whitespace-nowrap overflow-hidden text-ellipsis ${isActive ? 'text-primary' : 'text-foreground'}`,
+            style: {
+              color: !isActive && settings?.navTheme === 'realDark' ? '#fff' : undefined
+            },
+            children: item.name
+          })]
+        })
+      }), (() => {
+        const activePath = hoveredMenu || pinnedPath;
+        return hasChildren && !isHoverMenu && item.children.length > 0 && item.path === activePath && (collapsed || !collapsed && depth === 0);
+      })() && renderPopupMenu(item, depth), hasChildren && isOpen && !collapsed && depth > 0 && jsx("div", {
+        className: "transition-all duration-200 ease-in-out bg-background",
+        children: item.children.map(child => renderMenuItem(child, depth + 1))
+      })]
+    }, item.path);
+  };
+  return jsx("div", {
+    className: "overflow-hidden",
+    children: jsx("nav", {
+      className: `mt-2 ${collapsed ? 'px-1' : 'px-2'} overflow-x-hidden`,
+      children: menuData.map(item => renderMenuItem(item))
+    })
+  });
+};export{PerplexSidebarMenu};//# sourceMappingURL=PerplexSidebarMenu.js.map

package/lib/components/Layout/Sidebar/PerplexSidebarMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PerplexSidebarMenu.js","sources":["../../../../src/components/Layout/Sidebar/PerplexSidebarMenu.tsx"],"sourcesContent":[null],"names":["React","_jsxs","_jsx"],"mappings":"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"}

package/lib/components/Layout/util.js

@@ -1,4 +1,4 @@
-import {generatePath}from'react-router';/* eslint-disable import/no-extraneous-dependencies */
+import {generatePath}from'@remix-run/router';/* eslint-disable import/no-extraneous-dependencies */
 const generateMenuPath = (path, params) => {
   try {
     const generatedPath = generatePath(path, params);

package/lib/components/Layout/util.js.map

@@ -1 +1 @@
-{"version":3,"file":"util.js","sources":["../../../src/components/Layout/util.ts"],"sourcesContent":[null],"names":[],"mappings":"wCAAA;MAGa,gBAAgB,GAAG,CAAC,IAAI,EAAE,MAAM,KAAI;AAC7C,EAAA,IAAA;UACU,aAAA,GAAA,YAA4B,CAAA,IAAC,QAAM,CAAA;AACzC,IAAA,OAAA;IACJ,OAAC,GAAA,EAAA;;;;;SAIA,IAAA;AACD"}
+{"version":3,"file":"util.js","sources":["../../../src/components/Layout/util.ts"],"sourcesContent":[null],"names":[],"mappings":"6CAAA;MAGa,gBAAgB,GAAG,CAAC,IAAI,EAAE,MAAM,KAAI;AAC7C,EAAA,IAAA;UACU,aAAA,GAAA,YAA4B,CAAA,IAAC,QAAM,CAAA;AACzC,IAAA,OAAA;IACJ,OAAC,GAAA,EAAA;;;;;SAIA,IAAA;AACD"}

package/lib/components/SettingDrawer/InvitationSettings.js

@@ -1,4 +1,4 @@
-import {jsxs,jsx}from'react/jsx-runtime';import {useTranslation}from'react-i18next';import {Switch}from'./Switch/index.js';import'react';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import'../../hooks/use-get-current-lat-long.js';import {useMediaQuery}from'../../hooks/useMediaQuery.js';function InvitationSettings(props) {
+import {jsxs,jsx}from'react/jsx-runtime';import {useTranslation}from'react-i18next';import {Switch}from'./Switch/index.js';import'react';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import {useMediaQuery}from'../../hooks/useMediaQuery.js';function InvitationSettings(props) {
   const {
     settings,
     changeSetting,

package/lib/components/SettingDrawer/InvitationSettings.js.map

@@ -1 +1 @@
-{"version":3,"file":"InvitationSettings.js","sources":["../../../src/components/SettingDrawer/InvitationSettings.tsx"],"sourcesContent":[null],"names":[],"mappings":"yUAMwB,SAAA,kBAAkB,CAAC,KAAiC,EAAA;QAClE;IACN,QAAQ;AACR,IAAA,aAAgB;AAChB,IAAA;AACA,GAAA,GAAA;QACM;IACN;MACM,cAAA,CAAW,UAAG,CAAQ;AAE5B,EAAA,MAAA;AACI,IAAA;mBAA2B,EAAA;AAC3B,EAAA,MAAA,uBAAuB,EAAA,QAAA,IAAA,GAAA;AACnB,EAAc,QAAA,EAAA,aAAA,GAAA,YAAA,CAAA,IAAA,QAAA,EAAA,aAAA,GAAA,GAAA,CAAA,IAAA;;AAIlB,EAAA,MAAA,WAAA,GAAc,QAAA,EAAA,YAAA,EAAA,OAAA,EAAA,WAAoC,IAAA,EAAc;AACpE,EAAA,MAAE,sBAAA,GAAA,CAAA,GAAA,EAAA,KAAA,KAAA;AAEF,IAAA,IAAA,CAAA,aAAkB,EAAE;IAEpB,MAAO,cAEC,GAAA;AAqCZ,MAAC,GAAA,WAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"InvitationSettings.js","sources":["../../../src/components/SettingDrawer/InvitationSettings.tsx"],"sourcesContent":[null],"names":[],"mappings":"yRAMwB,SAAA,kBAAkB,CAAC,KAAiC,EAAA;QAClE;IACN,QAAQ;AACR,IAAA,aAAgB;AAChB,IAAA;AACA,GAAA,GAAA;QACM;IACN;MACM,cAAA,CAAW,UAAG,CAAQ;AAE5B,EAAA,MAAA;AACI,IAAA;mBAA2B,EAAA;AAC3B,EAAA,MAAA,uBAAuB,EAAA,QAAA,IAAA,GAAA;AACnB,EAAc,QAAA,EAAA,aAAA,GAAA,YAAA,CAAA,IAAA,QAAA,EAAA,aAAA,GAAA,GAAA,CAAA,IAAA;;AAIlB,EAAA,MAAA,WAAA,GAAc,QAAA,EAAA,YAAA,EAAA,OAAA,EAAA,WAAoC,IAAA,EAAc;AACpE,EAAA,MAAE,sBAAA,GAAA,CAAA,GAAA,EAAA,KAAA,KAAA;AAEF,IAAA,IAAA,CAAA,aAAkB,EAAE;IAEpB,MAAO,cAEC,GAAA;AAqCZ,MAAC,GAAA,WAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/SettingDrawer/LayoutChange.js

@@ -1,4 +1,4 @@
-import {jsxs,jsx,Fragment}from'react/jsx-runtime';import {useTranslation}from'react-i18next';import {Switch}from'./Switch/index.js';import'react';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import'../../hooks/use-get-current-lat-long.js';import {useMediaQuery}from'../../hooks/useMediaQuery.js';function LayoutChange(props) {
+import {jsxs,jsx,Fragment}from'react/jsx-runtime';import {useTranslation}from'react-i18next';import {Switch}from'./Switch/index.js';import'react';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import {useMediaQuery}from'../../hooks/useMediaQuery.js';function LayoutChange(props) {
   const {
     settings,
     changeSetting,

package/lib/components/SettingDrawer/LayoutChange.js.map

@@ -1 +1 @@
-{"version":3,"file":"LayoutChange.js","sources":["../../../src/components/SettingDrawer/LayoutChange.tsx"],"sourcesContent":[null],"names":[],"mappings":"kVAMwB,SAAA,YAAY,CAAC,KAAiC,EAAA;QAC5D;IACN,QAAQ;AACR,IAAA,aAAgB;AAChB,IAAA;AACA,GAAA,GAAA;AACA,EAAA,MAAA;IACA;MACM,cAAA,CAAA,UAAe,CAAA;AAErB,EAAA,MAAA;AACI,IAAA;mBAA2B,EAAA;AAE3B,EAAA,MAAA,YAAA,GAA+B,QAAA,EAAA,QAAA,IAAA,GAAA;AAC3B,EAAA,MAAA;;AAEH,GAAA,GAAA,QAAE,IAAA,EAAA;AACP,EAAA,MAAE,aAAA,GAAA,QAAA,EAAA,aAAA,GAAA,YAAA,CAAA,IAAA,QAAA,EAAA,aAAA,GAAA,GAAA,CAAA,IAAA,QAAA;AAEF,EAAA,MAAA,aAAkB,QAAO,WAAe,GAAA,SAAQ;QAEzC,YAEC,GAAA,aAAA,EAAA,MAAA,GAAA,UAAc,CAAA,IAAA,EAAC;6CAiD2B;AACtB,IAAA,IAAA,CAAA,aAAA,EAAA;+CAYsB,CAAA,QAAA,EAAA;AACtB,MAAA,GAAA,YAAA;;AAaA,KAAA,CAAA;AAQhC,GAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"LayoutChange.js","sources":["../../../src/components/SettingDrawer/LayoutChange.tsx"],"sourcesContent":[null],"names":[],"mappings":"kSAMwB,SAAA,YAAY,CAAC,KAAiC,EAAA;QAC5D;IACN,QAAQ;AACR,IAAA,aAAgB;AAChB,IAAA;AACA,GAAA,GAAA;AACA,EAAA,MAAA;IACA;MACM,cAAA,CAAA,UAAe,CAAA;AAErB,EAAA,MAAA;AACI,IAAA;mBAA2B,EAAA;AAE3B,EAAA,MAAA,YAAA,GAA+B,QAAA,EAAA,QAAA,IAAA,GAAA;AAC3B,EAAA,MAAA;;AAEH,GAAA,GAAA,QAAE,IAAA,EAAA;AACP,EAAA,MAAE,aAAA,GAAA,QAAA,EAAA,aAAA,GAAA,YAAA,CAAA,IAAA,QAAA,EAAA,aAAA,GAAA,GAAA,CAAA,IAAA,QAAA;AAEF,EAAA,MAAA,aAAkB,QAAO,WAAe,GAAA,SAAQ;QAEzC,YAEC,GAAA,aAAA,EAAA,MAAA,GAAA,UAAc,CAAA,IAAA,EAAC;6CAiD2B;AACtB,IAAA,IAAA,CAAA,aAAA,EAAA;+CAYsB,CAAA,QAAA,EAAA;AACtB,MAAA,GAAA,YAAA;;AAaA,KAAA,CAAA;AAQhC,GAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/SettingDrawer/NavigationsModes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationsModes.d.ts","sourceRoot":"","sources":["../../../src/components/SettingDrawer/NavigationsModes.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AA4E/C,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,oBAAoB,2CA8ElG"}
+{"version":3,"file":"NavigationsModes.d.ts","sourceRoot":"","sources":["../../../src/components/SettingDrawer/NavigationsModes.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AA6F/C,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,oBAAoB,2CAgFlG"}

package/lib/components/SettingDrawer/NavigationsModes.js

@@ -1,4 +1,4 @@
-import {jsxs,jsx}from'react/jsx-runtime';import'react';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import'../../hooks/use-get-current-lat-long.js';import {useMediaQuery}from'../../hooks/useMediaQuery.js';const navigationModes = [{
+import {jsxs,jsx}from'react/jsx-runtime';import'react';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import {useMediaQuery}from'../../hooks/useMediaQuery.js';const navigationModes = [{
   key: 'sidebar',
   title: 'Sidebar',
   svg: jsxs("svg", {
@@ -219,6 +219,89 @@ const menuTypes = [{
       opacity: "0.65"
     })]
   })
+}, {
+  key: 'perplexLayout',
+  title: 'Perplex Layout',
+  svg: jsxs("svg", {
+    width: "58",
+    height: "50",
+    viewBox: "0 0 80 60",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [jsx("rect", {
+      x: "1",
+      y: "1",
+      width: "78",
+      height: "58",
+      rx: "4",
+      fill: "white",
+      stroke: "#E5E7EB",
+      strokeWidth: "2"
+    }), jsx("rect", {
+      x: "1",
+      y: "1",
+      width: "20",
+      height: "58",
+      rx: "3",
+      fill: "#0F172A"
+    }), jsx("rect", {
+      x: "5",
+      y: "10",
+      width: "10",
+      height: "3",
+      rx: "1.5",
+      fill: "white",
+      opacity: "0.9"
+    }), jsx("rect", {
+      x: "5",
+      y: "20",
+      width: "10",
+      height: "3",
+      rx: "1.5",
+      fill: "white",
+      opacity: "0.6"
+    }), jsx("rect", {
+      x: "5",
+      y: "30",
+      width: "10",
+      height: "3",
+      rx: "1.5",
+      fill: "white",
+      opacity: "0.4"
+    }), jsx("rect", {
+      x: "25",
+      y: "10",
+      width: "40",
+      height: "3",
+      rx: "1.5",
+      fill: "#0F172A",
+      opacity: "0.7"
+    }), jsx("rect", {
+      x: "25",
+      y: "20",
+      width: "30",
+      height: "3",
+      rx: "1.5",
+      fill: "#0F172A",
+      opacity: "0.5"
+    }), jsx("rect", {
+      x: "25",
+      y: "35",
+      width: "45",
+      height: "3",
+      rx: "1.5",
+      fill: "#0F172A",
+      opacity: "0.4"
+    }), jsx("rect", {
+      x: "25",
+      y: "45",
+      width: "35",
+      height: "3",
+      rx: "1.5",
+      fill: "#0F172A",
+      opacity: "0.3"
+    })]
+  })
 }];
 function NavigationModes({
   changeSetting,
@@ -267,10 +350,13 @@ function NavigationModes({
         className: "flex flex-row gap-4",
         children: menuTypes.map((type, index) => jsx("div", {
           className: "relative cursor-pointer hover:opacity-80 transition-opacity shadow-sm dark:shadow-md rounded overflow-hidden",
-          onClick: () => changeSetting(`routeSettings.${currentRoute}.layout.${deviceType}`, {
-            ...deviceLayout,
-            sideMenuType: type.key
-          }),
+          onClick: () => {
+            changeSetting(`routeSettings.${currentRoute}.layout.${deviceType}`, {
+              ...deviceLayout,
+              sideMenuType: type.key
+            });
+            changeSetting('sideMenuType', type.key);
+          },
           children: jsxs("div", {
             className: "relative",
             children: [type.svg, deviceLayout?.sideMenuType === type.key && jsx("svg", {

package/lib/components/SettingDrawer/NavigationsModes.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationsModes.js","sources":["../../../src/components/SettingDrawer/NavigationsModes.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":"uPAIA,MAAM,eAAe,GAAG,CAAA;AACpB,EAAA,GAAA,EAAA,SAAA;AACI,EAAA,KAAA,EAAA,SAAc;AACd,EAAA,GAAA,EAAAA,IAAA,CAAK,KAAW,EAAA;AAChB,IAAA,KAAA,EAAG,IACM;AAQZ,IAAA,MAAA,EAAA,IAAA;AACD,IAAA,OAAA,EAAA,WAAA;AACI,IAAA,KAAA,EAAG,4BAAU;AACb,IAAA,QAAA,GAAOC,GAAS,CAAA,MAAA,EAAA;AAChB,MAAA,KAAG,EAAE,IACI;AAQZ,MAAA,MAAA,EAAA,IAAA;AACD,MAAA,EAAA,EAAA,GAAA;AACI,MAAA,IAAA;AACA,KAAA,CAAA,EAAAA,GAAA,CAAK,MAAS,EAAA;SACX,GAAA;AAaN,MAAA,CAAA,EAAA,GAAA;MACH,KAAA,EAAA,IAAA;AAEF,MAAM,YAAY;AACd,MAAA,IAAA,EAAA;AACI,KAAA,CAAA,EAAAA,IAAK,MAAS,EAAA;AACd,MAAA,CAAA,EAAA,GAAA;SACG,GAAA;AAQN,MAAA,KAAA,EAAA,IAAA;AACD,MAAA,MAAA,EAAA,GAAA;AACI,MAAA,EAAA,EAAA,GAAK;AACL,MAAA,IAAA,EAAA;QACAA,GAAG,CAAE,MACD,EAAA;AAOP,MAAA,CAAA,EAAA,GAAA;MACH,CAAA,EAAA,IAAA;AAEF,MAAM,KAAQ,EAAA,IAAA;AACV,MAAA,MAAQ,EAAQ,GAAA;AAChB,MAAA,EAAA,EAAM;AACN,MAAA,IAAM;MACA,OAAA,EAAA;KACA,CAAA,EAAAA,GAAA,CAAA,MAAA,EAAA;MAEC,CAAA,EAAA,GACH;AAa4B,MAAA,CAAA,EAAA,IAAA;;;AAkCA,MAAA,EAAA,EAAA,GAAA;;;AAuBpC,KAAC,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"NavigationsModes.js","sources":["../../../src/components/SettingDrawer/NavigationsModes.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":"uMAIA,MAAM,eAAe,GAAG,CAAA;AACpB,EAAA,GAAA,EAAA,SAAA;AACI,EAAA,KAAA,EAAA,SAAc;AACd,EAAA,GAAA,EAAAA,IAAA,CAAK,KAAW,EAAA;AAChB,IAAA,KAAA,EAAG,IACM;AAQZ,IAAA,MAAA,EAAA,IAAA;AACD,IAAA,OAAA,EAAA,WAAA;AACI,IAAA,KAAA,EAAG,4BAAU;AACb,IAAA,QAAA,GAAOC,GAAS,CAAA,MAAA,EAAA;AAChB,MAAA,KAAG,EAAE,IACI;AAQZ,MAAA,MAAA,EAAA,IAAA;AACD,MAAA,EAAA,EAAA,GAAA;AACI,MAAA,IAAA;AACA,KAAA,CAAA,EAAAA,GAAA,CAAK,MAAS,EAAA;SACX,GAAA;AAaN,MAAA,CAAA,EAAA,GAAA;MACH,KAAA,EAAA,IAAA;AAEF,MAAM,YAAY;AACd,MAAA,IAAA,EAAA;AACI,KAAA,CAAA,EAAAA,IAAK,MAAS,EAAA;AACd,MAAA,CAAA,EAAA,GAAA;SACG,GAAA;AAQN,MAAA,KAAA,EAAA,IAAA;AACD,MAAA,MAAA,EAAA,GAAA;AACI,MAAA,EAAA,EAAA,GAAK;AACL,MAAA,IAAA,EAAA;QACAA,GAAG,CAAE,MACD,EAAA;AAOP,MAAA,CAAA,EAAA,GAAA;AACD,MAAA,CAAA,EAAA,IAAA;AACI,MAAA,KAAG,EAAE,IAAe;AACpB,MAAA,MAAA,KAAuB;AACvB,MAAA,EAAA,EAAA,GAAK;AAaR,MAAA,IAAA,EAAA,SAAA;MACH,OAAA,EAAA;AAEF,KAAM,CAAA,EAAQA,GAAA,CAAA,MAAA,EAAA;AACV,MAAA,CAAA,EAAA,GAAQ;AACR,MAAA,CAAA,EAAA;AACA,MAAA;MACM,MAAA,EAAA,GAAA;MACA,EAAA,EAAA,GAAA;MAEC,IAAA,EACH,SAAK;AAauB,MAAA,OAAA,EAAA;;;AAiCJ,CAAA,EAAA;AACI,EAAA,GAAA,EAAA,QAAA;;AAEH,EAAA,GAAA,EAAAD,IAAA,CAAA,KAAA,EAAA;AAED,IAAA,KAAA,EAAA,IAAA;;AAqBhC,IAAC,OAAA,EAAA,WAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/SettingDrawer/RegionalSettings.js

@@ -1,4 +1,4 @@
-import {jsxs,jsx,Fragment}from'react/jsx-runtime';import*as React from'react';import {useTranslation}from'react-i18next';import {Switch}from'./Switch/index.js';import {SearchBarBehavior}from'../../machines/types.js';import {config}from'../../config/env-config.js';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import'../../hooks/use-get-current-lat-long.js';import {useMediaQuery}from'../../hooks/useMediaQuery.js';function RegionalSettings(props) {
+import {jsxs,jsx,Fragment}from'react/jsx-runtime';import*as React from'react';import {useTranslation}from'react-i18next';import {Switch}from'./Switch/index.js';import {SearchBarBehavior}from'../../machines/types.js';import {config}from'../../config/env-config.js';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import {useMediaQuery}from'../../hooks/useMediaQuery.js';function RegionalSettings(props) {
   const {
     t
   } = useTranslation('settings');