shad-m 1.0.0 → 1.0.2

package/dist/common/display/sidebar/nav-main.js

@@ -1,406 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var icons = require('@/icons');
-var usePathname = require('@repo/ui/hooks/usePathname');
-var providers = require('@repo/ui/providers');
-var collapsible = require('@repo/ui/components/collapsible');
-var hoverCard = require('@repo/ui/components/hover-card');
-var sidebar = require('@repo/ui/components/sidebar');
-var utils = require('@repo/ui/lib/utils');
-var React = require('react');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-function NavMain({
-  label,
-  items,
-  LinkComponent: LinkComponentProp,
-  labelClassName,
-  itemClassName,
-  itemActiveClassName,
-  itemHoverClassName = "hover:bg-white-100",
-  subItemClassName,
-  subItemActiveClassName,
-  subItemHoverClassName = "hover:bg-white-100"
-}) {
-  const pathname = usePathname.usePathname();
-  const { open, state, isHovered, isMobile, openMobile, setOpenMobile } = sidebar.useSidebar();
-  const { LinkComponent: LinkComponentContext } = providers.useUISystemContext();
-  const showLabel = isMobile ? true : open || state === "collapsed" && isHovered;
-  const [openStates, setOpenStates] = React__default.default.useState({});
-  const [hoverCardStates, setHoverCardStates] = React__default.default.useState({});
-  const isExpanded = isMobile ? openMobile : open || state === "collapsed" && isHovered;
-  const toggleHoverCard = React__default.default.useCallback((itemTitle, isOpen) => {
-    setHoverCardStates((prev) => ({
-      ...prev,
-      [itemTitle]: isOpen
-    }));
-  }, []);
-  const STORAGE_KEY = "sidebar-nav-collapse-states";
-  const Link = LinkComponentProp || LinkComponentContext || (({ href, children, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("a", { href, ...props, children }));
-  const handleLinkClick = React__default.default.useCallback(
-    (onNavigationClick) => {
-      if (isMobile) {
-        setOpenMobile(false);
-      }
-      onNavigationClick?.();
-    },
-    [isMobile, setOpenMobile]
-  );
-  const hasActiveSubItem = React__default.default.useCallback(
-    (item) => {
-      return item.items?.some(
-        (subItem) => pathname === subItem.url || subItem.url !== "/" && pathname.startsWith(subItem.url + "/")
-      ) || false;
-    },
-    [pathname]
-  );
-  React__default.default.useEffect(() => {
-    try {
-      const savedStates = localStorage.getItem(STORAGE_KEY);
-      const parsedStates = savedStates ? JSON.parse(savedStates) : {};
-      const initialStates = {};
-      items.forEach((item) => {
-        if (item.items && item.items.length > 0) {
-          const hasActiveSub = hasActiveSubItem(item);
-          initialStates[item.title] = parsedStates[item.title] ?? hasActiveSub ?? item.isActive ?? false;
-        }
-      });
-      setOpenStates(initialStates);
-    } catch (error) {
-      console.warn("Failed to load sidebar collapse states from localStorage:", error);
-      const fallbackStates = {};
-      items.forEach((item) => {
-        if (item.items && item.items.length > 0) {
-          fallbackStates[item.title] = hasActiveSubItem(item) || item.isActive || false;
-        }
-      });
-      setOpenStates(fallbackStates);
-    }
-  }, []);
-  React__default.default.useEffect(() => {
-    setOpenStates((prev) => {
-      const updatedStates = { ...prev };
-      let hasChanges = false;
-      items.forEach((item) => {
-        if (item.items && item.items.length > 0) {
-          const hasActiveSub = hasActiveSubItem(item);
-          if (hasActiveSub && !updatedStates[item.title]) {
-            updatedStates[item.title] = true;
-            hasChanges = true;
-          }
-        }
-      });
-      if (hasChanges) {
-        try {
-          localStorage.setItem(STORAGE_KEY, JSON.stringify(updatedStates));
-        } catch (error) {
-          console.warn("Failed to save sidebar states:", error);
-        }
-        return updatedStates;
-      }
-      return prev;
-    });
-  }, [pathname, items, hasActiveSubItem, STORAGE_KEY]);
-  const toggleOpenState = React__default.default.useCallback(
-    (itemTitle) => {
-      setOpenStates((prev) => {
-        const newStates = {
-          ...prev,
-          [itemTitle]: !prev[itemTitle]
-        };
-        try {
-          localStorage.setItem(STORAGE_KEY, JSON.stringify(newStates));
-        } catch (error) {
-          console.warn("Failed to save sidebar collapse states:", error);
-        }
-        return newStates;
-      });
-    },
-    [STORAGE_KEY]
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs(
-    sidebar.SidebarGroup,
-    {
-      className: utils.cn({
-        "!px-1": !isExpanded
-      }),
-      children: [
-        label && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("relative h-[18px] overflow-hidden", labelClassName), children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              className: utils.cn(
-                "text-ink-400s absolute inset-0 whitespace-nowrap px-3 text-xs uppercase tracking-wider transition-opacity duration-300",
-                showLabel ? "z-10 opacity-100" : "z-0 opacity-0"
-              ),
-              children: label
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              className: utils.cn(
-                "absolute inset-0 -ml-2 flex items-center transition-opacity duration-300",
-                !showLabel ? "z-10 opacity-100" : "z-0 opacity-0"
-              ),
-              children: /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarSeparator, { className: utils.cn("bg-ink-300s dark:bg-ink-400s w-full") })
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          sidebar.SidebarMenu,
-          {
-            className: utils.cn("gap-3", {
-              "gap-2": !isExpanded && !isMobile
-            }),
-            children: items.map((item) => {
-              const isMainActive = item.exactMatch ? pathname === item.url : pathname === item.url || item.url !== "/" && pathname.startsWith(item.url + "/");
-              const hasSubItems = item.items && item.items.length > 0;
-              if (!hasSubItems) {
-                if (item.type === "button") {
-                  return /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarMenuItem, { className: item.className, children: /* @__PURE__ */ jsxRuntime.jsxs(
-                    sidebar.SidebarMenuButton,
-                    {
-                      className: utils.cn(
-                        itemHoverClassName,
-                        itemClassName,
-                        isMainActive && (itemActiveClassName || "bg-white-200 hover:bg-white-200"),
-                        {
-                          "!flex-col !gap-1 !px-0 !py-2": !isExpanded && !isMobile,
-                          "icon-red-500 text-red-500 hover:bg-red-50": item.isLogoutButton
-                        }
-                      ),
-                      onClick: item.onClick,
-                      "data-notification-trigger": true,
-                      children: [
-                        item.icon && /* @__PURE__ */ jsxRuntime.jsx(item.icon, {}),
-                        /* @__PURE__ */ jsxRuntime.jsx(
-                          "span",
-                          {
-                            className: utils.cn({
-                              "!block !whitespace-normal text-center text-[10px] font-medium leading-4 !opacity-100": !isExpanded && !isMobile
-                            }),
-                            children: isExpanded ? item.title : item.shortTitle || item.title
-                          }
-                        ),
-                        item.badge && /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarMenuBadge, { className: item.badgeClassName, children: item.badge })
-                      ]
-                    }
-                  ) }, item.title);
-                }
-                return /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarMenuItem, { className: item.className, children: /* @__PURE__ */ jsxRuntime.jsx(
-                  sidebar.SidebarMenuButton,
-                  {
-                    asChild: true,
-                    className: utils.cn(
-                      itemHoverClassName,
-                      itemClassName,
-                      isMainActive && (itemActiveClassName || "bg-white-200 hover:bg-white-200"),
-                      {
-                        "!flex-col !gap-1 !px-0 !py-2": !isExpanded && !isMobile
-                      }
-                    ),
-                    children: /* @__PURE__ */ jsxRuntime.jsxs(
-                      Link,
-                      {
-                        href: item.url || "#",
-                        onClick: (e) => {
-                          if (!item.url || item.url === "#") {
-                            e.preventDefault();
-                          }
-                          handleLinkClick(item.onNavigationClick);
-                        },
-                        prefetch: true,
-                        children: [
-                          item.icon && /* @__PURE__ */ jsxRuntime.jsx(item.icon, {}),
-                          /* @__PURE__ */ jsxRuntime.jsx(
-                            "span",
-                            {
-                              className: utils.cn({
-                                "!block !whitespace-normal text-center text-[10px] font-medium leading-4 !opacity-100": !isExpanded && !isMobile
-                              }),
-                              children: isExpanded ? item.title : item.shortTitle || item.title
-                            }
-                          ),
-                          item.badge && /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarMenuBadge, { className: item.badgeClassName, children: item.badge })
-                        ]
-                      }
-                    )
-                  }
-                ) }, item.title);
-              }
-              if (!open) {
-                if (item.type === "button") {
-                  return /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarMenuItem, { className: item.className, children: /* @__PURE__ */ jsxRuntime.jsxs(
-                    sidebar.SidebarMenuButton,
-                    {
-                      className: utils.cn(
-                        itemHoverClassName,
-                        itemClassName,
-                        isMainActive && (itemActiveClassName || "bg-white-200 hover:bg-white-200")
-                      ),
-                      onClick: item.onClick,
-                      children: [
-                        item.icon && /* @__PURE__ */ jsxRuntime.jsx(item.icon, {}),
-                        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium", children: item.title }),
-                        item.badge && /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarMenuBadge, { className: item.badgeClassName, children: item.badge })
-                      ]
-                    }
-                  ) }, item.title);
-                }
-                return /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarMenuItem, { className: item.className, children: /* @__PURE__ */ jsxRuntime.jsxs(
-                  hoverCard.HoverCard,
-                  {
-                    openDelay: 200,
-                    closeDelay: 100,
-                    open: hoverCardStates[item.title] || false,
-                    onOpenChange: (isOpen) => toggleHoverCard(item.title, isOpen),
-                    children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(hoverCard.HoverCardTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
-                        sidebar.SidebarMenuButton,
-                        {
-                          asChild: true,
-                          className: utils.cn(
-                            itemHoverClassName,
-                            itemClassName,
-                            isMainActive && (itemActiveClassName || "bg-white-200 hover:bg-white-200")
-                          ),
-                          children: /* @__PURE__ */ jsxRuntime.jsxs(
-                            Link,
-                            {
-                              href: item.url || "#",
-                              onClick: (e) => {
-                                if (!item.url || item.url === "#") {
-                                  e.preventDefault();
-                                }
-                                toggleHoverCard(item.title, false);
-                                handleLinkClick(item.onNavigationClick);
-                              },
-                              prefetch: true,
-                              children: [
-                                item.icon && /* @__PURE__ */ jsxRuntime.jsx(item.icon, {}),
-                                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium", children: item.title }),
-                                item.badge && /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarMenuBadge, { className: item.badgeClassName, children: item.badge })
-                              ]
-                            }
-                          )
-                        }
-                      ) }),
-                      /* @__PURE__ */ jsxRuntime.jsxs(
-                        hoverCard.HoverCardContent,
-                        {
-                          side: "right",
-                          align: "start",
-                          className: "pointer-events-auto w-56 p-3",
-                          sideOffset: 8,
-                          onPointerDownOutside: () => toggleHoverCard(item.title, false),
-                          children: [
-                            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-ink-200s text-ink-500s mb-2 border-b px-2 py-1.5 text-sm font-bold", children: item.title }),
-                            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: item.items?.map((subItem) => {
-                              const isSubActive = pathname === subItem.url || subItem.url !== "/" && pathname.startsWith(subItem.url + "/");
-                              return /* @__PURE__ */ jsxRuntime.jsxs(
-                                Link,
-                                {
-                                  href: subItem.url,
-                                  onClick: (e) => {
-                                    if (!subItem.url || subItem.url === "#") {
-                                      e.preventDefault();
-                                    }
-                                    toggleHoverCard(item.title, false);
-                                    handleLinkClick(subItem.onNavigationClick);
-                                  },
-                                  prefetch: true,
-                                  className: utils.cn(
-                                    "flex items-center justify-between rounded-md px-2 py-2 text-sm transition-colors",
-                                    subItemHoverClassName,
-                                    subItemClassName,
-                                    isSubActive && (subItemActiveClassName || "bg-white-200 hover:bg-white-200")
-                                  ),
-                                  children: [
-                                    /* @__PURE__ */ jsxRuntime.jsx("span", { children: subItem.title }),
-                                    subItem.title === "Tin nh\u1EAFn" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rounded bg-red-500 px-1.5 py-0.5 text-xs text-white", children: "4 m\u1EDBi" })
-                                  ]
-                                },
-                                subItem.title
-                              );
-                            }) })
-                          ]
-                        }
-                      )
-                    ]
-                  }
-                ) }, item.title);
-              }
-              return /* @__PURE__ */ jsxRuntime.jsx(
-                collapsible.Collapsible,
-                {
-                  asChild: true,
-                  open: openStates[item.title] || false,
-                  onOpenChange: () => toggleOpenState(item.title),
-                  className: "group/collapsible",
-                  children: /* @__PURE__ */ jsxRuntime.jsxs(sidebar.SidebarMenuItem, { className: item.className, children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(collapsible.CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
-                      sidebar.SidebarMenuButton,
-                      {
-                        className: utils.cn(
-                          itemHoverClassName,
-                          itemClassName,
-                          isMainActive && (itemActiveClassName || "bg-white-200 hover:bg-white-200")
-                        ),
-                        children: [
-                          item.icon && /* @__PURE__ */ jsxRuntime.jsx(item.icon, {}),
-                          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex w-full items-center justify-between", children: [
-                            item.title,
-                            /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowRightIcon, { className: "transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" })
-                          ] }),
-                          item.badge && /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarMenuBadge, { className: item.badgeClassName, children: item.badge })
-                        ]
-                      }
-                    ) }),
-                    /* @__PURE__ */ jsxRuntime.jsx(collapsible.CollapsibleContent, { children: /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarMenuSub, { children: item.items?.map((subItem) => {
-                      const isSubActive = pathname === subItem.url || subItem.url !== "/" && pathname.startsWith(subItem.url + "/");
-                      return /* @__PURE__ */ jsxRuntime.jsx(sidebar.SidebarMenuSubItem, { children: /* @__PURE__ */ jsxRuntime.jsx(
-                        sidebar.SidebarMenuSubButton,
-                        {
-                          asChild: true,
-                          className: utils.cn(
-                            subItemHoverClassName,
-                            subItemClassName,
-                            isSubActive && (subItemActiveClassName || "bg-white-200 hover:bg-white-200")
-                          ),
-                          children: /* @__PURE__ */ jsxRuntime.jsx(
-                            Link,
-                            {
-                              href: subItem.url,
-                              onClick: (e) => {
-                                if (!subItem.url || subItem.url === "#") {
-                                  e.preventDefault();
-                                }
-                                handleLinkClick(subItem.onNavigationClick);
-                              },
-                              prefetch: true,
-                              children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium", children: subItem.title })
-                            }
-                          )
-                        }
-                      ) }, subItem.title);
-                    }) }) })
-                  ] })
-                },
-                item.title
-              );
-            })
-          }
-        )
-      ]
-    }
-  ) });
-}
-
-exports.NavMain = NavMain;
-//# sourceMappingURL=nav-main.js.map
-//# sourceMappingURL=nav-main.js.map

package/dist/common/display/sidebar/nav-main.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/common/display/sidebar/nav-main.tsx"],"names":["usePathname","useSidebar","useUISystemContext","React","jsx","Fragment","jsxs","SidebarGroup","cn","SidebarSeparator","SidebarMenu","SidebarMenuItem","SidebarMenuButton","SidebarMenuBadge","HoverCard","HoverCardTrigger","HoverCardContent","Collapsible","CollapsibleTrigger","ArrowRightIcon","CollapsibleContent","SidebarMenuSub","SidebarMenuSubItem","SidebarMenuSubButton"],"mappings":"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","file":"nav-main.js","sourcesContent":["'use client';\n\nimport { ArrowRightIcon } from '@/icons';\nimport { usePathname } from '@repo/ui/hooks/usePathname';\nimport { NavItemType } from '@/lib/types';\nimport { useUISystemContext } from '@repo/ui/providers';\nimport {\n  Collapsible,\n  CollapsibleContent,\n  CollapsibleTrigger,\n} from '@repo/ui/components/collapsible';\nimport { HoverCard, HoverCardContent, HoverCardTrigger } from '@repo/ui/components/hover-card';\nimport {\n  SidebarGroup,\n  SidebarMenu,\n  SidebarMenuBadge,\n  SidebarMenuButton,\n  SidebarMenuItem,\n  SidebarMenuSub,\n  SidebarMenuSubButton,\n  SidebarMenuSubItem,\n  SidebarSeparator,\n  useSidebar,\n} from '@repo/ui/components/sidebar';\nimport { cn } from '@repo/ui/lib/utils';\nimport React from 'react';\n\ninterface NavMainProps {\n  label?: string; // Section label (e.g., \"QUẢN LÝ\", \"KHÁC\")\n  items: NavItemType[];\n  LinkComponent?: React.ComponentType<any>;\n  labelClassName?: string; // Custom style for section label\n  itemClassName?: string;\n  itemActiveClassName?: string;\n  itemHoverClassName?: string;\n  subItemClassName?: string;\n  subItemActiveClassName?: string;\n  subItemHoverClassName?: string;\n}\n\nexport function NavMain({\n  label,\n  items,\n  LinkComponent: LinkComponentProp,\n  labelClassName,\n  itemClassName,\n  itemActiveClassName,\n  itemHoverClassName = 'hover:bg-white-100',\n  subItemClassName,\n  subItemActiveClassName,\n  subItemHoverClassName = 'hover:bg-white-100',\n}: NavMainProps) {\n  const pathname = usePathname();\n  const { open, state, isHovered, isMobile, openMobile, setOpenMobile } = useSidebar();\n  const { LinkComponent: LinkComponentContext } = useUISystemContext();\n\n  // Show label when: sidebar is expanded OR (collapsed but hovered)\n  const showLabel = isMobile ? true : open || (state === 'collapsed' && isHovered);\n\n  // State to track which nav items are open\n  const [openStates, setOpenStates] = React.useState<Record<string, boolean>>({});\n\n  // State to track which hover cards are open (for collapsed sidebar)\n  const [hoverCardStates, setHoverCardStates] = React.useState<Record<string, boolean>>({});\n\n  // On mobile: use openMobile state\n  // On desktop: show expanded when open OR when collapsed but hovered\n  const isExpanded = isMobile ? openMobile : open || (state === 'collapsed' && isHovered);\n\n  // Function to toggle hover card state\n  const toggleHoverCard = React.useCallback((itemTitle: string, isOpen: boolean) => {\n    setHoverCardStates((prev) => ({\n      ...prev,\n      [itemTitle]: isOpen,\n    }));\n  }, []);\n\n  // localStorage key for saving collapse states\n  const STORAGE_KEY = 'sidebar-nav-collapse-states';\n\n  // Use the provided LinkComponent prop, fallback to context, or fallback to anchor tag\n  const Link =\n    LinkComponentProp ||\n    LinkComponentContext ||\n    (({ href, children, ...props }) => (\n      <a href={href} {...props}>\n        {children}\n      </a>\n    ));\n\n  // Handler to close mobile sidebar when clicking on a link\n  const handleLinkClick = React.useCallback(\n    (onNavigationClick?: () => void) => {\n      if (isMobile) {\n        setOpenMobile(false);\n      }\n      // Call the onNavigationClick callback if provided (to close notification sheet)\n      onNavigationClick?.();\n    },\n    [isMobile, setOpenMobile],\n  );\n\n  // Function to check if any sub-item is active\n  const hasActiveSubItem = React.useCallback(\n    (item: NavItemType) => {\n      return (\n        item.items?.some(\n          (subItem) =>\n            pathname === subItem.url ||\n            (subItem.url !== '/' && pathname.startsWith(subItem.url + '/')),\n        ) || false\n      );\n    },\n    [pathname],\n  );\n\n  // Initialize open states from localStorage and active sub-items\n  React.useEffect(() => {\n    try {\n      const savedStates = localStorage.getItem(STORAGE_KEY);\n      const parsedStates = savedStates ? JSON.parse(savedStates) : {};\n\n      // Create initial states based on saved data and active sub-items\n      const initialStates: Record<string, boolean> = {};\n\n      items.forEach((item) => {\n        if (item.items && item.items.length > 0) {\n          const hasActiveSub = hasActiveSubItem(item);\n          // Open if: saved as open OR has active sub-item OR item.isActive is true\n          initialStates[item.title] =\n            parsedStates[item.title] ?? hasActiveSub ?? item.isActive ?? false;\n        }\n      });\n\n      setOpenStates(initialStates);\n    } catch (error) {\n      console.warn('Failed to load sidebar collapse states from localStorage:', error);\n      // Fallback to default behavior if localStorage fails\n      const fallbackStates: Record<string, boolean> = {};\n      items.forEach((item) => {\n        if (item.items && item.items.length > 0) {\n          fallbackStates[item.title] = hasActiveSubItem(item) || item.isActive || false;\n        }\n      });\n      setOpenStates(fallbackStates);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []); // Only run on mount\n\n  // Update active states when pathname changes\n  React.useEffect(() => {\n    setOpenStates((prev) => {\n      const updatedStates = { ...prev };\n      let hasChanges = false;\n\n      items.forEach((item) => {\n        if (item.items && item.items.length > 0) {\n          const hasActiveSub = hasActiveSubItem(item);\n          // Auto-open if has active sub-item (don't close if user manually opened)\n          if (hasActiveSub && !updatedStates[item.title]) {\n            updatedStates[item.title] = true;\n            hasChanges = true;\n          }\n        }\n      });\n\n      // Only update and save if there are changes\n      if (hasChanges) {\n        try {\n          localStorage.setItem(STORAGE_KEY, JSON.stringify(updatedStates));\n        } catch (error) {\n          console.warn('Failed to save sidebar states:', error);\n        }\n        return updatedStates;\n      }\n\n      return prev;\n    });\n  }, [pathname, items, hasActiveSubItem, STORAGE_KEY]);\n\n  // Function to toggle open state\n  const toggleOpenState = React.useCallback(\n    (itemTitle: string) => {\n      setOpenStates((prev) => {\n        const newStates = {\n          ...prev,\n          [itemTitle]: !prev[itemTitle],\n        };\n        // Save to localStorage immediately\n        try {\n          localStorage.setItem(STORAGE_KEY, JSON.stringify(newStates));\n        } catch (error) {\n          console.warn('Failed to save sidebar collapse states:', error);\n        }\n        return newStates;\n      });\n    },\n    [STORAGE_KEY],\n  );\n\n  return (\n    <>\n      <SidebarGroup\n        className={cn({\n          '!px-1': !isExpanded,\n        })}\n      >\n        {label && (\n          <div className={cn('relative h-[18px] overflow-hidden', labelClassName)}>\n            {/* Label text */}\n            <div\n              className={cn(\n                'text-ink-400s absolute inset-0 whitespace-nowrap px-3 text-xs uppercase tracking-wider transition-opacity duration-300',\n                showLabel ? 'z-10 opacity-100' : 'z-0 opacity-0',\n              )}\n            >\n              {label}\n            </div>\n\n            {/* Separator line */}\n            <div\n              className={cn(\n                'absolute inset-0 -ml-2 flex items-center transition-opacity duration-300',\n                !showLabel ? 'z-10 opacity-100' : 'z-0 opacity-0',\n              )}\n            >\n              <SidebarSeparator className={cn('bg-ink-300s dark:bg-ink-400s w-full')} />\n            </div>\n          </div>\n        )}\n        <SidebarMenu\n          className={cn('gap-3', {\n            'gap-2': !isExpanded && !isMobile,\n          })}\n        >\n          {items.map((item) => {\n            // Check for exact match or if current path is a sub-route of the nav item\n            // If exactMatch is true, only match the exact URL\n            const isMainActive = item.exactMatch\n              ? pathname === item.url\n              : pathname === item.url || (item.url !== '/' && pathname.startsWith(item.url + '/'));\n            const hasSubItems = item.items && item.items.length > 0;\n\n            // If no sub-items, render as simple menu button\n            if (!hasSubItems) {\n              // For button-type items (e.g., notifications)\n              if (item.type === 'button') {\n                return (\n                  <SidebarMenuItem key={item.title} className={item.className}>\n                    <SidebarMenuButton\n                      className={cn(\n                        itemHoverClassName,\n                        itemClassName,\n                        isMainActive && (itemActiveClassName || 'bg-white-200 hover:bg-white-200'),\n                        {\n                          '!flex-col !gap-1 !px-0 !py-2': !isExpanded && !isMobile,\n                          'icon-red-500 text-red-500 hover:bg-red-50': item.isLogoutButton,\n                        },\n                      )}\n                      onClick={item.onClick}\n                      data-notification-trigger\n                    >\n                      {item.icon && <item.icon />}\n                      <span\n                        className={cn({\n                          '!block !whitespace-normal text-center text-[10px] font-medium leading-4 !opacity-100':\n                            !isExpanded && !isMobile,\n                        })}\n                      >\n                        {isExpanded ? item.title : item.shortTitle || item.title}\n                      </span>\n                      {item.badge && (\n                        <SidebarMenuBadge className={item.badgeClassName}>\n                          {item.badge}\n                        </SidebarMenuBadge>\n                      )}\n                    </SidebarMenuButton>\n                  </SidebarMenuItem>\n                );\n              }\n\n              // For link-type items (default)\n              return (\n                <SidebarMenuItem key={item.title} className={item.className}>\n                  <SidebarMenuButton\n                    asChild\n                    className={cn(\n                      itemHoverClassName,\n                      itemClassName,\n                      isMainActive && (itemActiveClassName || 'bg-white-200 hover:bg-white-200'),\n                      {\n                        '!flex-col !gap-1 !px-0 !py-2': !isExpanded && !isMobile,\n                      },\n                    )}\n                  >\n                    <Link\n                      href={item.url || '#'}\n                      onClick={(e: React.MouseEvent) => {\n                        // Ensure navigation happens\n                        if (!item.url || item.url === '#') {\n                          e.preventDefault();\n                        }\n                        handleLinkClick(item.onNavigationClick);\n                      }}\n                      prefetch={true}\n                    >\n                      {item.icon && <item.icon />}\n                      <span\n                        className={cn({\n                          '!block !whitespace-normal text-center text-[10px] font-medium leading-4 !opacity-100':\n                            !isExpanded && !isMobile,\n                        })}\n                      >\n                        {isExpanded ? item.title : item.shortTitle || item.title}\n                      </span>\n                      {item.badge && (\n                        <SidebarMenuBadge className={item.badgeClassName}>\n                          {item.badge}\n                        </SidebarMenuBadge>\n                      )}\n                    </Link>\n                  </SidebarMenuButton>\n                </SidebarMenuItem>\n              );\n            }\n\n            // If collapsed, render with hover card\n            if (!open) {\n              // For button-type items when collapsed\n              if (item.type === 'button') {\n                return (\n                  <SidebarMenuItem key={item.title} className={item.className}>\n                    <SidebarMenuButton\n                      className={cn(\n                        itemHoverClassName,\n                        itemClassName,\n                        isMainActive && (itemActiveClassName || 'bg-white-200 hover:bg-white-200'),\n                      )}\n                      onClick={item.onClick}\n                    >\n                      {item.icon && <item.icon />}\n                      <span className=\"font-medium\">{item.title}</span>\n                      {item.badge && (\n                        <SidebarMenuBadge className={item.badgeClassName}>\n                          {item.badge}\n                        </SidebarMenuBadge>\n                      )}\n                    </SidebarMenuButton>\n                  </SidebarMenuItem>\n                );\n              }\n\n              // For link-type items when collapsed with sub-items\n              return (\n                <SidebarMenuItem key={item.title} className={item.className}>\n                  <HoverCard\n                    openDelay={200}\n                    closeDelay={100}\n                    open={hoverCardStates[item.title] || false}\n                    onOpenChange={(isOpen) => toggleHoverCard(item.title, isOpen)}\n                  >\n                    <HoverCardTrigger asChild>\n                      <SidebarMenuButton\n                        asChild\n                        className={cn(\n                          itemHoverClassName,\n                          itemClassName,\n                          isMainActive &&\n                            (itemActiveClassName || 'bg-white-200 hover:bg-white-200'),\n                        )}\n                      >\n                        <Link\n                          href={item.url || '#'}\n                          onClick={(e: React.MouseEvent) => {\n                            // Prevent default if no valid URL\n                            if (!item.url || item.url === '#') {\n                              e.preventDefault();\n                            }\n                            // Close hover card immediately on click\n                            toggleHoverCard(item.title, false);\n                            handleLinkClick(item.onNavigationClick);\n                          }}\n                          prefetch={true}\n                        >\n                          {item.icon && <item.icon />}\n                          <span className=\"font-medium\">{item.title}</span>\n                          {item.badge && (\n                            <SidebarMenuBadge className={item.badgeClassName}>\n                              {item.badge}\n                            </SidebarMenuBadge>\n                          )}\n                        </Link>\n                      </SidebarMenuButton>\n                    </HoverCardTrigger>\n                    <HoverCardContent\n                      side=\"right\"\n                      align=\"start\"\n                      className=\"pointer-events-auto w-56 p-3\"\n                      sideOffset={8}\n                      onPointerDownOutside={() => toggleHoverCard(item.title, false)}\n                    >\n                      <div className=\"border-ink-200s text-ink-500s mb-2 border-b px-2 py-1.5 text-sm font-bold\">\n                        {item.title}\n                      </div>\n                      <div className=\"space-y-1\">\n                        {item.items?.map((subItem) => {\n                          // Check for exact match or if current path is a sub-route of the sub-item\n                          const isSubActive =\n                            pathname === subItem.url ||\n                            (subItem.url !== '/' && pathname.startsWith(subItem.url + '/'));\n                          return (\n                            <Link\n                              key={subItem.title}\n                              href={subItem.url}\n                              onClick={(e: React.MouseEvent) => {\n                                // Ensure navigation happens\n                                if (!subItem.url || subItem.url === '#') {\n                                  e.preventDefault();\n                                }\n                                toggleHoverCard(item.title, false);\n                                handleLinkClick(subItem.onNavigationClick);\n                              }}\n                              prefetch={true}\n                              className={cn(\n                                'flex items-center justify-between rounded-md px-2 py-2 text-sm transition-colors',\n                                subItemHoverClassName,\n                                subItemClassName,\n                                isSubActive &&\n                                  (subItemActiveClassName || 'bg-white-200 hover:bg-white-200'),\n                              )}\n                            >\n                              <span>{subItem.title}</span>\n                              {subItem.title === 'Tin nhắn' && (\n                                <span className=\"rounded bg-red-500 px-1.5 py-0.5 text-xs text-white\">\n                                  4 mới\n                                </span>\n                              )}\n                            </Link>\n                          );\n                        })}\n                      </div>\n                    </HoverCardContent>\n                  </HoverCard>\n                </SidebarMenuItem>\n              );\n            }\n\n            // If has sub-items and expanded, render with collapsible functionality\n            return (\n              <Collapsible\n                key={item.title}\n                asChild\n                open={openStates[item.title] || false}\n                onOpenChange={() => toggleOpenState(item.title)}\n                className=\"group/collapsible\"\n              >\n                <SidebarMenuItem className={item.className}>\n                  <CollapsibleTrigger asChild>\n                    <SidebarMenuButton\n                      className={cn(\n                        itemHoverClassName,\n                        itemClassName,\n                        isMainActive && (itemActiveClassName || 'bg-white-200 hover:bg-white-200'),\n                      )}\n                    >\n                      {item.icon && <item.icon />}\n                      <span className=\"flex w-full items-center justify-between\">\n                        {item.title}\n                        <ArrowRightIcon className=\"transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90\" />\n                      </span>\n                      {item.badge && (\n                        <SidebarMenuBadge className={item.badgeClassName}>\n                          {item.badge}\n                        </SidebarMenuBadge>\n                      )}\n                    </SidebarMenuButton>\n                  </CollapsibleTrigger>\n                  <CollapsibleContent>\n                    <SidebarMenuSub>\n                      {item.items?.map((subItem) => {\n                        // Check for exact match or if current path is a sub-route of the sub-item\n                        const isSubActive =\n                          pathname === subItem.url ||\n                          (subItem.url !== '/' && pathname.startsWith(subItem.url + '/'));\n                        return (\n                          <SidebarMenuSubItem key={subItem.title}>\n                            <SidebarMenuSubButton\n                              asChild\n                              className={cn(\n                                subItemHoverClassName,\n                                subItemClassName,\n                                isSubActive &&\n                                  (subItemActiveClassName || 'bg-white-200 hover:bg-white-200'),\n                              )}\n                            >\n                              <Link\n                                href={subItem.url}\n                                onClick={(e: React.MouseEvent) => {\n                                  // Ensure navigation happens\n                                  if (!subItem.url || subItem.url === '#') {\n                                    e.preventDefault();\n                                  }\n                                  handleLinkClick(subItem.onNavigationClick);\n                                }}\n                                prefetch={true}\n                              >\n                                <span className=\"font-medium\">{subItem.title}</span>\n                              </Link>\n                            </SidebarMenuSubButton>\n                          </SidebarMenuSubItem>\n                        );\n                      })}\n                    </SidebarMenuSub>\n                  </CollapsibleContent>\n                </SidebarMenuItem>\n              </Collapsible>\n            );\n          })}\n        </SidebarMenu>\n      </SidebarGroup>\n    </>\n  );\n}\n"]}