baaz-custom-components 3.1.19 → 3.1.21

package/dist/index.js

@@ -676,6 +676,33 @@ function isLeaf(value) {
 function normalizePath(path) {
   return path.startsWith("/") ? path : `/${path}`;
 }
+function extractPathname(urlOrPath) {
+  try {
+    if (urlOrPath.startsWith("http://") || urlOrPath.startsWith("https://")) {
+      return new URL(urlOrPath).pathname;
+    }
+  } catch (_) {
+  }
+  return urlOrPath;
+}
+function treeContainsPath({
+  data,
+  base,
+  pathname
+}) {
+  for (const [, value] of Object.entries(data)) {
+    if (isLeaf(value)) {
+      const full = base + normalizePath(value);
+      const onlyPath = extractPathname(full);
+      if (onlyPath === pathname) return true;
+      continue;
+    }
+    if (treeContainsPath({ data: value, base, pathname })) {
+      return true;
+    }
+  }
+  return false;
+}
 function MenuItems({
   data,
   base,
@@ -684,7 +711,7 @@ function MenuItems({
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children: Object.entries(data).map(([label, value]) => {
     if (isLeaf(value)) {
       const fullPath = base + normalizePath(value);
-      const active = fullPath === router.pathname;
+      const active = extractPathname(fullPath) === router.pathname;
       return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
         MenubarItem,
         {
@@ -716,24 +743,34 @@ function MenuList({
   router
 }) {
   const { name, url, routes } = entry;
+  const isGroupActive = treeContainsPath({ data: routes, base: url, pathname: router.pathname });
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Menubar, { className: "bg-transparent border-none", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(MenubarMenu, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(MenubarTrigger, { className: "cursor-pointer group inline-flex items-center", children: [
-      name,
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-        import_lucide_react5.ChevronDown,
-        {
-          size: 16,
-          className: "ml-1 group-data-[state=open]:hidden"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-        import_lucide_react5.ChevronUp,
-        {
-          size: 16,
-          className: "ml-1 group-data-[state=open]:inline hidden"
-        }
-      )
-    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+      MenubarTrigger,
+      {
+        className: cn(
+          "cursor-pointer group inline-flex items-center",
+          isGroupActive && "bg-accent text-accent-foreground"
+        ),
+        children: [
+          name,
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+            import_lucide_react5.ChevronDown,
+            {
+              size: 16,
+              className: "ml-1 group-data-[state=open]:hidden"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+            import_lucide_react5.ChevronUp,
+            {
+              size: 16,
+              className: "ml-1 group-data-[state=open]:inline hidden"
+            }
+          )
+        ]
+      }
+    ),
     /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(MenubarContent, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       MenuItems,
       {

package/dist/index.mjs

@@ -642,6 +642,33 @@ function isLeaf(value) {
 function normalizePath(path) {
   return path.startsWith("/") ? path : `/${path}`;
 }
+function extractPathname(urlOrPath) {
+  try {
+    if (urlOrPath.startsWith("http://") || urlOrPath.startsWith("https://")) {
+      return new URL(urlOrPath).pathname;
+    }
+  } catch (_) {
+  }
+  return urlOrPath;
+}
+function treeContainsPath({
+  data,
+  base,
+  pathname
+}) {
+  for (const [, value] of Object.entries(data)) {
+    if (isLeaf(value)) {
+      const full = base + normalizePath(value);
+      const onlyPath = extractPathname(full);
+      if (onlyPath === pathname) return true;
+      continue;
+    }
+    if (treeContainsPath({ data: value, base, pathname })) {
+      return true;
+    }
+  }
+  return false;
+}
 function MenuItems({
   data,
   base,
@@ -650,7 +677,7 @@ function MenuItems({
   return /* @__PURE__ */ jsx9(Fragment, { children: Object.entries(data).map(([label, value]) => {
     if (isLeaf(value)) {
       const fullPath = base + normalizePath(value);
-      const active = fullPath === router.pathname;
+      const active = extractPathname(fullPath) === router.pathname;
       return /* @__PURE__ */ jsx9(
         MenubarItem,
         {
@@ -682,24 +709,34 @@ function MenuList({
   router
 }) {
   const { name, url, routes } = entry;
+  const isGroupActive = treeContainsPath({ data: routes, base: url, pathname: router.pathname });
   return /* @__PURE__ */ jsx9(Menubar, { className: "bg-transparent border-none", children: /* @__PURE__ */ jsxs7(MenubarMenu, { children: [
-    /* @__PURE__ */ jsxs7(MenubarTrigger, { className: "cursor-pointer group inline-flex items-center", children: [
-      name,
-      /* @__PURE__ */ jsx9(
-        ChevronDown,
-        {
-          size: 16,
-          className: "ml-1 group-data-[state=open]:hidden"
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        ChevronUp,
-        {
-          size: 16,
-          className: "ml-1 group-data-[state=open]:inline hidden"
-        }
-      )
-    ] }),
+    /* @__PURE__ */ jsxs7(
+      MenubarTrigger,
+      {
+        className: cn(
+          "cursor-pointer group inline-flex items-center",
+          isGroupActive && "bg-accent text-accent-foreground"
+        ),
+        children: [
+          name,
+          /* @__PURE__ */ jsx9(
+            ChevronDown,
+            {
+              size: 16,
+              className: "ml-1 group-data-[state=open]:hidden"
+            }
+          ),
+          /* @__PURE__ */ jsx9(
+            ChevronUp,
+            {
+              size: 16,
+              className: "ml-1 group-data-[state=open]:inline hidden"
+            }
+          )
+        ]
+      }
+    ),
     /* @__PURE__ */ jsx9(MenubarContent, { children: /* @__PURE__ */ jsx9(
       MenuItems,
       {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "baaz-custom-components",
-    "version": "3.1.19",
+    "version": "3.1.21",
     "private": false,
     "sideEffects": false,
     "main": "dist/index.js",