@ixo/ui 0.0.22 → 0.0.23

package/dist/{components-BNly6Y-x.cjs → components-_MkU3jTT.cjs}

@@ -797,8 +797,8 @@ function AccordionTable({
     }
   );
 }
-const Header$3 = react$1.lazy(() => Promise.resolve().then(() => require("./index-DkxiMwu0.cjs")));
-const Footer = react$1.lazy(() => Promise.resolve().then(() => require("./index-B-OdChcI.cjs")));
+const Header$3 = react$1.lazy(() => Promise.resolve().then(() => require("./index-BdurzkQE.cjs")));
+const Footer = react$1.lazy(() => Promise.resolve().then(() => require("./index-BkHXIaln.cjs")));
 function ActionCard({ header, content, footer, useHoverMode = false }) {
   const hasContent = !!content || !!footer;
   const initialVisibility = footer?.startHidden !== true;
@@ -882,7 +882,7 @@ function Loader({ size, color = "primary" }) {
 }
 const CARD_WIDTH$1 = 350;
 const CARD_HEADER_HEIGHT = 158;
-const Header$2 = react$1.lazy(() => Promise.resolve().then(() => require("./index-CyALadsH.cjs")));
+const Header$2 = react$1.lazy(() => Promise.resolve().then(() => require("./index-DFEKL4SE.cjs")));
 function Card({ children, className, contentClassName, roundedBottom, noPadding = false, fullWidth = false, header, wrapperSx, onClick }) {
   const wrapperRef = react$1.useRef(null);
   const handleOnClick = react$1.useCallback(
@@ -1317,7 +1317,7 @@ function ModalSheet({ isOpen, children, hideHandler, zIndex, onRequestHide, onRe
     document.body
   );
 }
-const Badge = react$1.lazy(() => Promise.resolve().then(() => require("./index-tbar1igU.cjs")));
+const Badge = react$1.lazy(() => Promise.resolve().then(() => require("./index-Cbh2O8ES.cjs")));
 function ActionSheet({ children, isOpen, header, navMenu = void 0, onRequestHide, onRequestShow }) {
   const shadowScrollRef = react$1.useRef(null);
   const wrapperContentAreaRef = react$1.useRef(null);
@@ -2270,6 +2270,50 @@ function SelectedIndicator() {
     }
   );
 }
+function NavigationItemSkeleton() {
+  const theme = useUITheme.useUITheme();
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Flex,
+    {
+      align: "center",
+      gap: 8,
+      pl: 12,
+      pr: 12,
+      py: 6,
+      style: {
+        borderRadius: 8,
+        backgroundColor: theme.bg.navIconsBg
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Flex, { align: "center", gap: 4, style: { flex: 1 }, children: /* @__PURE__ */ jsxRuntime.jsx(
+          core.Skeleton,
+          {
+            height: "15px",
+            radius: "xl",
+            sx: {
+              "::before": { opacity: 0 },
+              "::after": { opacity: 1 }
+            },
+            style: { opacity: 0.2 }
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          core.Skeleton,
+          {
+            height: 16,
+            width: 16,
+            radius: 4,
+            sx: {
+              "::before": { opacity: 0 },
+              "::after": { opacity: 1 }
+            },
+            style: { opacity: 0.3 }
+          }
+        )
+      ]
+    }
+  );
+}
 function SpaceItem({ icon, id, selectedSpace, onClick }) {
   const { hovered, ref } = hooks.useHover();
   const theme = useUITheme.useUITheme();
@@ -2456,6 +2500,7 @@ function AppShellNavigation({
   asideCollapsed = true,
   onAsideToggle,
   onMaxExpand,
+  loading,
   children
 }) {
   const [navbarCollapsed, { toggle: toggleNavbar }] = hooks.useDisclosure(true);
@@ -2547,10 +2592,10 @@ function AppShellNavigation({
                 ] }),
                 /* @__PURE__ */ jsxRuntime.jsx(Flex, { gap: 12, align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(core.Center, { sx: { cursor: "pointer" }, onClick: toggleNavbar, children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.PanelLeftSolid, { size: 22, color: "secondary" }) }) })
               ] }),
-              menuItems?.map((item) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem, { onMenuItemClick, item }, item.id)),
+              loading ? /* @__PURE__ */ jsxRuntime.jsx(core.Stack, { gap: 5, children: Array.from({ length: 6 }).map((_, idx) => /* @__PURE__ */ jsxRuntime.jsx(NavigationItemSkeleton, {}, idx)) }) : menuItems?.map((item) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem, { onMenuItemClick, item }, item.id)),
               roomCategories && roomCategories.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(core.Stack, { gap: 8, mt: 16, children: roomCategories.map((category) => /* @__PURE__ */ jsxRuntime.jsx(RoomCategory, { category }, category.id)) })
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(core.Stack, { gap: 5, children: footerMenuItems?.map((item) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem, { onMenuItemClick, item }, item.id)) })
+            /* @__PURE__ */ jsxRuntime.jsx(core.Stack, { gap: 5, children: loading ? Array.from({ length: 2 }).map((_, idx) => /* @__PURE__ */ jsxRuntime.jsx(NavigationItemSkeleton, {}, idx)) : footerMenuItems?.map((item) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem, { onMenuItemClick, item }, item.id)) })
           ] })
         ] }) }),
         /* @__PURE__ */ jsxRuntime.jsx(core.AppShell.Main, { children }),
@@ -5532,13 +5577,13 @@ function ActionButton({ onClick, left, right }) {
     }
   );
 }
-const MainAction = react$1.lazy(() => Promise.resolve().then(() => require("./index-DSQZMIiq.cjs")));
-const Header$1 = react$1.lazy(() => Promise.resolve().then(() => require("./index-CvlLzI5F.cjs")));
-const Content = react$1.lazy(() => Promise.resolve().then(() => require("./index-C6QZLB5t.cjs")));
+const MainAction = react$1.lazy(() => Promise.resolve().then(() => require("./index-1_x_N7t0.cjs")));
+const Header$1 = react$1.lazy(() => Promise.resolve().then(() => require("./index-paAq-KH4.cjs")));
+const Content = react$1.lazy(() => Promise.resolve().then(() => require("./index-DtDKdj1b.cjs")));
 const Map = react$1.lazy(() => Promise.resolve().then(() => require("./index-D4PsPquZ.cjs")));
 const CustomContent = react$1.lazy(() => Promise.resolve().then(() => require("./index-ByrCNpS2.cjs")));
-const Assets = react$1.lazy(() => Promise.resolve().then(() => require("./index-Dg7GVuRa.cjs")));
-const Actions = react$1.lazy(() => Promise.resolve().then(() => require("./index-BRD5ffg_.cjs")));
+const Assets = react$1.lazy(() => Promise.resolve().then(() => require("./index-B67PPfoW.cjs")));
+const Actions = react$1.lazy(() => Promise.resolve().then(() => require("./index-Cjc9U9We.cjs")));
 const HOVER_BORDER_WIDTH = 1;
 function SodaCardCmp({ numSelected = 0, expanded = true, mainAction, header, content, map, customContent, customFooter, actions, assets, onClick }, ref) {
   const wrapperRef = react$1.useRef(null);
@@ -10850,4 +10895,4 @@ exports.UserMessage = UserMessage;
 exports.WorkspaceModal = WorkspaceModal;
 exports.cutText = cutText;
 exports.isValidClick = isValidClick;
-//# sourceMappingURL=components-BNly6Y-x.cjs.map
+//# sourceMappingURL=components-_MkU3jTT.cjs.map