@nextsparkjs/core 0.1.0-beta.7 → 0.1.0-beta.70

package/dist/components/dashboard/layouts/Sidebar.js

@@ -2,11 +2,11 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import Link from "next/link";
 import { useState, useEffect } from "react";
-import { cn } from "../../../lib/utils";
-import { useSidebar } from "../../../contexts/sidebar-context";
-import { createTestId, createCyId } from "../../../lib/test";
-import { DynamicNavigation } from "../navigation/DynamicNavigation";
-import { TeamSwitcherCompact } from "../../teams/TeamSwitcherCompact";
+import { cn } from "../../../lib/utils/index.js";
+import { useSidebar } from "../../../contexts/sidebar-context.js";
+import { sel } from "../../../lib/test/index.js";
+import { DynamicNavigation } from "../navigation/DynamicNavigation.js";
+import { TeamSwitcherCompact } from "../../teams/TeamSwitcherCompact.js";
 function Sidebar({ className, entities }) {
   const { isCollapsed } = useSidebar();
   const [statusMessage, setStatusMessage] = useState("");
@@ -22,7 +22,6 @@ function Sidebar({ className, entities }) {
         "aria-live": "polite",
         "aria-atomic": "true",
         className: "sr-only",
-        ...createTestId("sidebar", "status", "message") && { "data-testid": createTestId("sidebar", "status", "message") },
         children: statusMessage
       }
     ),
@@ -36,8 +35,7 @@ function Sidebar({ className, entities }) {
         ),
         role: "complementary",
         "aria-label": isCollapsed ? "Sidebar de navegaci\xF3n contra\xEDdo" : "Sidebar de navegaci\xF3n expandido",
-        ...createTestId("sidebar", "container") && { "data-testid": createTestId("sidebar", "container") },
-        ...createCyId("sidebar", "main") && { "data-cy": createCyId("sidebar", "main") },
+        "data-cy": sel("dashboard.sidebar.container"),
         "data-collapsed": isCollapsed,
         children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full", children: [
           /* @__PURE__ */ jsx("header", { className: "p-4", children: /* @__PURE__ */ jsx(
@@ -45,16 +43,14 @@ function Sidebar({ className, entities }) {
             {
               className: "flex items-center justify-between",
               role: "banner",
-              ...createTestId("sidebar", "header") && { "data-testid": createTestId("sidebar", "header") },
-              ...createCyId("sidebar", "header-section") && { "data-cy": createCyId("sidebar", "header-section") },
+              "data-cy": sel("dashboard.sidebar.header"),
               children: /* @__PURE__ */ jsxs(
                 Link,
                 {
                   href: "/",
                   className: "flex items-center gap-2",
                   "aria-label": isCollapsed ? "Ir a la p\xE1gina principal" : "Boilerplate - Ir a la p\xE1gina principal",
-                  ...createTestId("sidebar", "logo", "link") && { "data-testid": createTestId("sidebar", "logo", "link") },
-                  ...createCyId("sidebar", "logo") && { "data-cy": createCyId("sidebar", "logo") },
+                  "data-cy": sel("dashboard.sidebar.logo"),
                   children: [
                     /* @__PURE__ */ jsx(
                       "div",
@@ -62,7 +58,6 @@ function Sidebar({ className, entities }) {
                         className: "w-8 h-8 rounded-lg bg-primary flex items-center justify-center",
                         role: "img",
                         "aria-label": "Logo de Boilerplate",
-                        ...createTestId("sidebar", "logo", "icon") && { "data-testid": createTestId("sidebar", "logo", "icon") },
                         children: /* @__PURE__ */ jsx("span", { className: "text-primary-foreground font-bold text-sm", "aria-hidden": "true", children: "B" })
                       }
                     ),
@@ -70,7 +65,6 @@ function Sidebar({ className, entities }) {
                       "span",
                       {
                         className: "font-semibold text-lg",
-                        ...createTestId("sidebar", "brand", "text") && { "data-testid": createTestId("sidebar", "brand", "text") },
                         children: "Boilerplate"
                       }
                     )
@@ -86,26 +80,17 @@ function Sidebar({ className, entities }) {
               id: "sidebar-navigation",
               role: "navigation",
               "aria-label": "Navegaci\xF3n principal del dashboard",
-              ...createTestId("sidebar", "navigation") && { "data-testid": createTestId("sidebar", "navigation") },
-              ...createCyId("sidebar", "nav") && { "data-cy": createCyId("sidebar", "nav") },
+              "data-cy": sel("dashboard.sidebar.content"),
               children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("section", { "aria-labelledby": !isCollapsed ? "nav-heading" : void 0, children: [
                 !isCollapsed && /* @__PURE__ */ jsx(
                   "h3",
                   {
                     id: "nav-heading",
                     className: "px-2 text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-3",
-                    ...createTestId("sidebar", "nav", "heading") && { "data-testid": createTestId("sidebar", "nav", "heading") },
                     children: "Navigation"
                   }
                 ),
-                /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    ...createTestId("sidebar", "nav", "items") && { "data-testid": createTestId("sidebar", "nav", "items") },
-                    ...createCyId("sidebar", "nav-items") && { "data-cy": createCyId("sidebar", "nav-items") },
-                    children: /* @__PURE__ */ jsx(DynamicNavigation, { entities })
-                  }
-                )
+                /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(DynamicNavigation, { entities }) })
               ] }) })
             }
           ),

package/dist/components/dashboard/layouts/TopNavbar.js

@@ -3,9 +3,9 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import Link from "next/link";
 import Image from "next/image";
 import { usePathname } from "next/navigation";
-import { useAuth } from "../../../hooks/useAuth";
-import { useSidebar } from "../../../contexts/sidebar-context";
-import { Button } from "../../ui/button";
+import { useAuth } from "../../../hooks/useAuth.js";
+import { useSidebar } from "../../../contexts/sidebar-context.js";
+import { Button } from "../../ui/button.js";
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -13,22 +13,22 @@ import {
   DropdownMenuLabel,
   DropdownMenuSeparator,
   DropdownMenuTrigger
-} from "../../ui/dropdown-menu";
-import { Menu, X, LogOut, User, Settings, CreditCard, HelpCircle, Shield, PanelLeft, PanelLeftClose, Key, Code } from "lucide-react";
+} from "../../ui/dropdown-menu.js";
+import { Menu, X, LogOut, User, Settings, CreditCard, HelpCircle, Shield, PanelLeft, PanelLeftClose, Key, Code, Layers, Tags } from "lucide-react";
 import { useState, useEffect, useCallback } from "react";
-import { ThemeToggle } from "../../app/misc/ThemeToggle";
-import { NotificationsDropdown } from "../misc/NotificationsDropdown";
-import { SearchDropdown } from "../misc/SearchDropdown";
-import { QuickCreateDropdown } from "../misc/QuickCreateDropdown";
-import { cn } from "../../../lib/utils";
-import { createTestId, sel, createAriaLabel } from "../../../lib/test";
+import { ThemeToggle } from "../../app/misc/ThemeToggle.js";
+import { NotificationsDropdown } from "../misc/NotificationsDropdown.js";
+import { SearchDropdown } from "../misc/SearchDropdown.js";
+import { QuickCreateDropdown } from "../misc/QuickCreateDropdown.js";
+import { cn } from "../../../lib/utils/index.js";
+import { sel, createAriaLabel } from "../../../lib/test/index.js";
 import { useTranslations } from "next-intl";
-import { useIsSuperAdmin } from "../../app/guards/SuperAdminGuard";
-import { useIsDeveloper } from "../../app/guards/DeveloperGuard";
-import { DynamicNavigation } from "../navigation/DynamicNavigation";
-import { isTopbarFeatureEnabled, getTopbarFeatureConfig, TOPBAR_CONFIG } from "../../../lib/config";
+import { useIsSuperAdmin } from "../../app/guards/SuperAdminGuard.js";
+import { useIsDeveloper } from "../../app/guards/DeveloperGuard.js";
+import { DynamicNavigation } from "../navigation/DynamicNavigation.js";
+import { isTopbarFeatureEnabled, getTopbarFeatureConfig, TOPBAR_CONFIG } from "../../../lib/config/index.js";
 function TopNavbar({ entities, className }) {
-  var _a;
+  var _a, _b, _c;
   const { user, signOut, isLoading } = useAuth();
   const pathname = usePathname();
   const { isCollapsed, toggleSidebar } = useSidebar();
@@ -47,7 +47,9 @@ function TopNavbar({ entities, className }) {
     "credit-card": CreditCard,
     "key": Key,
     "shield": Shield,
-    "log-out": LogOut
+    "log-out": LogOut,
+    "layers": Layers,
+    "tags": Tags
   };
   const getUserInitials = (user2) => {
     if (user2.firstName && user2.lastName) {
@@ -116,7 +118,6 @@ function TopNavbar({ entities, className }) {
         "aria-live": "polite",
         "aria-atomic": "true",
         className: "sr-only",
-        ...createTestId("topnav", "status", "message") && { "data-testid": createTestId("topnav", "status", "message") },
         children: statusMessage
       }
     ),
@@ -133,8 +134,7 @@ function TopNavbar({ entities, className }) {
         ),
         role: "banner",
         "aria-label": "Navegaci\xF3n principal",
-        ...createTestId("topnav", "container") && { "data-testid": createTestId("topnav", "container") },
-        "data-cy": sel("dashboard.topnav.header"),
+        "data-cy": sel("dashboard.topnav.container"),
         children: [
           /* @__PURE__ */ jsx("div", { className: "w-full pl-2.5 pr-4 sm:pr-6 lg:pr-8", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between h-16", children: [
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 flex-1", children: [
@@ -144,7 +144,6 @@ function TopNavbar({ entities, className }) {
                   href: "/",
                   className: "text-xl font-bold text-foreground lg:hidden",
                   "aria-label": "Ir a la p\xE1gina principal",
-                  ...createTestId("topnav", "logo", "link") && { "data-testid": createTestId("topnav", "logo", "link") },
                   "data-cy": sel("dashboard.topnav.logo"),
                   children: "Boilerplate"
                 }
@@ -160,7 +159,6 @@ function TopNavbar({ entities, className }) {
                     "aria-label": isCollapsed ? "Expandir sidebar" : "Contraer sidebar",
                     "aria-expanded": !isCollapsed,
                     "aria-controls": "sidebar-navigation",
-                    "data-testid": createTestId("topnav", "sidebar-toggle", "button"),
                     "data-cy": sel("dashboard.topnav.sidebarToggle"),
                     children: isCollapsed ? /* @__PURE__ */ jsx(PanelLeft, { className: "h-4 w-4", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(PanelLeftClose, { className: "h-4 w-4", "aria-hidden": "true" })
                   }
@@ -172,8 +170,7 @@ function TopNavbar({ entities, className }) {
                     className: "hidden lg:flex items-center min-w-0 max-w-sm",
                     role: "search",
                     "aria-label": "B\xFAsqueda de tareas",
-                    ...createTestId("topnav", "search", "container") && { "data-testid": createTestId("topnav", "search", "container") },
-                    "data-cy": sel("dashboard.topnav.searchSection"),
+                    "data-cy": sel("dashboard.topnav.search.container"),
                     children: /* @__PURE__ */ jsx(SearchDropdown, {})
                   }
                 )
@@ -185,24 +182,15 @@ function TopNavbar({ entities, className }) {
                 className: "flex items-center space-x-4 flex-shrink-0",
                 role: "toolbar",
                 "aria-label": "Acciones y configuraci\xF3n",
-                ...createTestId("topnav", "actions", "toolbar") && { "data-testid": createTestId("topnav", "actions", "toolbar") },
                 "data-cy": sel("dashboard.topnav.actions"),
                 children: [
-                  user && isTopbarFeatureEnabled("notifications") && /* @__PURE__ */ jsx(
-                    "div",
-                    {
-                      ...createTestId("topnav", "notifications") && { "data-testid": createTestId("topnav", "notifications") },
-                      "data-cy": sel("dashboard.topnav.notifications"),
-                      children: /* @__PURE__ */ jsx(NotificationsDropdown, {})
-                    }
-                  ),
+                  user && isTopbarFeatureEnabled("notifications") && /* @__PURE__ */ jsx(NotificationsDropdown, {}),
                   user && isTopbarFeatureEnabled("support") && /* @__PURE__ */ jsx(
                     Button,
                     {
                       variant: "ghost",
                       size: "sm",
                       asChild: true,
-                      ...createTestId("topnav", "help", "button") && { "data-testid": createTestId("topnav", "help", "button") },
                       "data-cy": sel("dashboard.topnav.help"),
                       children: /* @__PURE__ */ jsxs(
                         Link,
@@ -222,7 +210,6 @@ function TopNavbar({ entities, className }) {
                   isTopbarFeatureEnabled("themeToggle") && /* @__PURE__ */ jsx(
                     "div",
                     {
-                      ...createTestId("topnav", "theme", "toggle") && { "data-testid": createTestId("topnav", "theme", "toggle") },
                       "data-cy": sel("dashboard.topnav.themeToggle"),
                       children: /* @__PURE__ */ jsx(ThemeToggle, {})
                     }
@@ -233,7 +220,6 @@ function TopNavbar({ entities, className }) {
                       variant: "ghost",
                       size: "sm",
                       asChild: true,
-                      ...createTestId("topnav", "superadmin", "button") && { "data-testid": createTestId("topnav", "superadmin", "button") },
                       "data-cy": sel("dashboard.topnav.superadmin"),
                       children: /* @__PURE__ */ jsxs(
                         Link,
@@ -255,7 +241,6 @@ function TopNavbar({ entities, className }) {
                       variant: "ghost",
                       size: "sm",
                       asChild: true,
-                      ...createTestId("topnav", "devtools", "button") && { "data-testid": createTestId("topnav", "devtools", "button") },
                       "data-cy": sel("dashboard.topnav.devtools"),
                       children: /* @__PURE__ */ jsxs(
                         Link,
@@ -271,13 +256,61 @@ function TopNavbar({ entities, className }) {
                       )
                     }
                   ),
+                  user && isTopbarFeatureEnabled("settingsMenu") && /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+                    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+                      Button,
+                      {
+                        variant: "ghost",
+                        size: "sm",
+                        "data-cy": sel("dashboard.topnav.settingsMenu.trigger"),
+                        children: [
+                          /* @__PURE__ */ jsx(Settings, { className: "h-4 w-4", "aria-hidden": "true" }),
+                          /* @__PURE__ */ jsx("span", { className: "sr-only", children: t("navigation.settings") })
+                        ]
+                      }
+                    ) }),
+                    /* @__PURE__ */ jsxs(
+                      DropdownMenuContent,
+                      {
+                        align: "end",
+                        className: "w-56",
+                        "data-cy": sel("dashboard.topnav.settingsMenu.content"),
+                        children: [
+                          /* @__PURE__ */ jsx(DropdownMenuLabel, { children: t("navigation.settings") }),
+                          /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+                          (_b = (_a = TOPBAR_CONFIG.settingsMenu) == null ? void 0 : _a.links) == null ? void 0 : _b.map((link, index) => {
+                            const IconComponent = iconMap[link.icon];
+                            return /* @__PURE__ */ jsx(
+                              DropdownMenuItem,
+                              {
+                                asChild: true,
+                                "data-cy": sel("dashboard.topnav.settingsMenu.item", { index }),
+                                children: /* @__PURE__ */ jsxs(
+                                  Link,
+                                  {
+                                    href: link.href,
+                                    className: "flex items-center",
+                                    "data-cy": sel("dashboard.topnav.settingsMenu.link", { index }),
+                                    children: [
+                                      IconComponent && /* @__PURE__ */ jsx(IconComponent, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
+                                      t(link.label)
+                                    ]
+                                  }
+                                )
+                              },
+                              index
+                            );
+                          })
+                        ]
+                      }
+                    )
+                  ] }),
                   isLoading ? /* @__PURE__ */ jsx(
                     "div",
                     {
                       className: "h-8 w-20 bg-muted animate-pulse rounded",
                       role: "status",
                       "aria-label": "Cargando informaci\xF3n del usuario",
-                      ...createTestId("topnav", "user", "loading") && { "data-testid": createTestId("topnav", "user", "loading") },
                       "data-cy": sel("dashboard.topnav.userLoading"),
                       children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Cargando..." })
                     }
@@ -286,8 +319,7 @@ function TopNavbar({ entities, className }) {
                       DropdownMenuTrigger,
                       {
                         asChild: true,
-                        ...createTestId("topnav", "user", "trigger") && { "data-testid": createTestId("topnav", "user", "trigger") },
-                        "data-cy": sel("dashboard.topnav.userMenuTrigger"),
+                        "data-cy": sel("dashboard.topnav.userMenu.trigger"),
                         children: /* @__PURE__ */ jsxs(
                           Button,
                           {
@@ -307,8 +339,7 @@ function TopNavbar({ entities, className }) {
                                   alt: "",
                                   width: 32,
                                   height: 32,
-                                  className: "h-8 w-8 rounded-full object-cover border border-border",
-                                  ...createTestId("topnav", "user", "avatar") && { "data-testid": createTestId("topnav", "user", "avatar") }
+                                  className: "h-8 w-8 rounded-full object-cover border border-border"
                                 }
                               ) : /* @__PURE__ */ jsx(
                                 "div",
@@ -316,7 +347,6 @@ function TopNavbar({ entities, className }) {
                                   className: `h-8 w-8 rounded-full flex items-center justify-center text-white text-sm font-medium ${getAvatarColor(user.email)}`,
                                   role: "img",
                                   "aria-label": `Avatar de ${user.firstName || user.email}`,
-                                  ...createTestId("topnav", "user", "avatar") && { "data-testid": createTestId("topnav", "user", "avatar") },
                                   children: getUserInitials(user)
                                 }
                               ),
@@ -331,8 +361,7 @@ function TopNavbar({ entities, className }) {
                       {
                         align: "end",
                         className: "w-56",
-                        ...createTestId("topnav", "user", "menu") && { "data-testid": createTestId("topnav", "user", "menu") },
-                        "data-cy": sel("dashboard.topnav.userMenu"),
+                        "data-cy": sel("dashboard.topnav.userMenu.content"),
                         children: [
                           (TOPBAR_CONFIG.userMenu.showAvatar || TOPBAR_CONFIG.userMenu.showEmail || TOPBAR_CONFIG.userMenu.showRole) && /* @__PURE__ */ jsx(DropdownMenuLabel, { children: /* @__PURE__ */ jsxs(
                             "div",
@@ -357,8 +386,7 @@ function TopNavbar({ entities, className }) {
                                 DropdownMenuItem,
                                 {
                                   asChild: true,
-                                  ...createTestId("topnav", "menu", "item") && { "data-testid": createTestId("topnav", "menu", "item") },
-                                  "data-cy": sel("dashboard.topnav.menuItem", { icon: item.icon }),
+                                  "data-cy": sel("dashboard.topnav.userMenu.item", { icon: item.icon }),
                                   children: /* @__PURE__ */ jsxs(
                                     Link,
                                     {
@@ -383,8 +411,7 @@ function TopNavbar({ entities, className }) {
                                 {
                                   onClick: isSignOut ? handleSignOut : void 0,
                                   className: isSignOut ? "text-red-600 focus:text-red-600" : void 0,
-                                  ...createTestId("topnav", "menu", "action") && { "data-testid": createTestId("topnav", "menu", "action") },
-                                  "data-cy": sel("dashboard.topnav.menuAction", { action: item.action }),
+                                  "data-cy": sel("dashboard.topnav.userMenu.action", { action: item.action }),
                                   children: [
                                     IconComponent && /* @__PURE__ */ jsx(IconComponent, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
                                     t(item.label)
@@ -418,14 +445,13 @@ function TopNavbar({ entities, className }) {
                           children: getUserInitials(user)
                         }
                       ),
-                      /* @__PURE__ */ jsx("span", { className: "text-sm text-foreground hidden sm:block", children: user.firstName || ((_a = user.email) == null ? void 0 : _a.split("@")[0]) })
+                      /* @__PURE__ */ jsx("span", { className: "text-sm text-foreground hidden sm:block", children: user.firstName || ((_c = user.email) == null ? void 0 : _c.split("@")[0]) })
                     ] })
                   ) : /* @__PURE__ */ jsxs(Fragment, { children: [
                     /* @__PURE__ */ jsx(
                       Link,
                       {
                         href: "/login",
-                        ...createTestId("topnav", "signin", "link") && { "data-testid": createTestId("topnav", "signin", "link") },
                         "data-cy": sel("dashboard.topnav.signin"),
                         children: /* @__PURE__ */ jsx(
                           Button,
@@ -442,7 +468,6 @@ function TopNavbar({ entities, className }) {
                       Link,
                       {
                         href: "/signup",
-                        ...createTestId("topnav", "signup", "link") && { "data-testid": createTestId("topnav", "signup", "link") },
                         "data-cy": sel("dashboard.topnav.signup"),
                         children: /* @__PURE__ */ jsx(
                           Button,
@@ -464,13 +489,11 @@ function TopNavbar({ entities, className }) {
                 className: "lg:hidden flex items-center space-x-2",
                 role: "group",
                 "aria-label": "Acciones m\xF3viles",
-                ...createTestId("topnav", "mobile", "actions") && { "data-testid": createTestId("topnav", "mobile", "actions") },
-                "data-cy": sel("dashboard.topnav.mobileActions"),
+                "data-cy": sel("dashboard.topnav.mobileMenu.actions"),
                 children: [
                   isTopbarFeatureEnabled("themeToggle") && /* @__PURE__ */ jsx(
                     "div",
                     {
-                      ...createTestId("topnav", "mobile", "theme") && { "data-testid": createTestId("topnav", "mobile", "theme") },
                       children: /* @__PURE__ */ jsx(ThemeToggle, {})
                     }
                   ),
@@ -482,8 +505,7 @@ function TopNavbar({ entities, className }) {
                       "aria-label": isMenuOpen ? "Cerrar men\xFA de navegaci\xF3n" : "Abrir men\xFA de navegaci\xF3n",
                       "aria-expanded": isMenuOpen,
                       "aria-controls": "mobile-menu",
-                      ...createTestId("topnav", "mobile", "toggle") && { "data-testid": createTestId("topnav", "mobile", "toggle") },
-                      "data-cy": sel("dashboard.topnav.mobileMenuToggle"),
+                      "data-cy": sel("dashboard.topnav.mobileMenu.toggle"),
                       children: isMenuOpen ? /* @__PURE__ */ jsx(X, { className: "h-6 w-6", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Menu, { className: "h-6 w-6", "aria-hidden": "true" })
                     }
                   )
@@ -498,8 +520,7 @@ function TopNavbar({ entities, className }) {
               id: "mobile-menu",
               role: "navigation",
               "aria-label": "Men\xFA de navegaci\xF3n m\xF3vil",
-              ...createTestId("topnav", "mobile", "menu") && { "data-testid": createTestId("topnav", "mobile", "menu") },
-              "data-cy": sel("dashboard.topnav.mobileMenu"),
+              "data-cy": sel("dashboard.topnav.mobileMenu.container"),
               children: /* @__PURE__ */ jsx("div", { className: "px-2 pt-2 pb-3 space-y-1", children: user ? /* @__PURE__ */ jsxs(Fragment, { children: [
                 /* @__PURE__ */ jsxs(
                   "div",
@@ -526,8 +547,7 @@ function TopNavbar({ entities, className }) {
                           ),
                           onClick: handleMenuClose,
                           "aria-label": "Ir a Super Admin - \xC1rea de super administrador",
-                          ...createTestId("topnav", "mobile", "superadmin") && { "data-testid": createTestId("topnav", "mobile", "superadmin") },
-                          "data-cy": sel("dashboard.topnav.mobileNavSuperadmin"),
+                          "data-cy": sel("dashboard.topnav.mobileMenu.superadmin"),
                           children: [
                             /* @__PURE__ */ jsx(Shield, { className: "h-4 w-4", "aria-hidden": "true" }),
                             /* @__PURE__ */ jsx("span", { className: "sr-only", children: "\xC1rea de super administrador" })
@@ -544,8 +564,7 @@ function TopNavbar({ entities, className }) {
                           ),
                           onClick: handleMenuClose,
                           "aria-label": "Ir a DevTools - \xC1rea de desarrolladores",
-                          ...createTestId("topnav", "mobile", "devtools") && { "data-testid": createTestId("topnav", "mobile", "devtools") },
-                          "data-cy": sel("dashboard.topnav.mobileNavDevtools"),
+                          "data-cy": sel("dashboard.topnav.mobileMenu.devtools"),
                           children: [
                             /* @__PURE__ */ jsx(Code, { className: "h-4 w-4", "aria-hidden": "true" }),
                             /* @__PURE__ */ jsx("span", { className: "sr-only", children: "\xC1rea de desarrolladores" })
@@ -561,8 +580,7 @@ function TopNavbar({ entities, className }) {
                     className: "flex items-center gap-3 px-3 py-2 border-t border-border pt-4",
                     role: "group",
                     "aria-label": "Informaci\xF3n del usuario",
-                    ...createTestId("topnav", "mobile", "userinfo") && { "data-testid": createTestId("topnav", "mobile", "userinfo") },
-                    "data-cy": sel("dashboard.topnav.mobileUserInfo"),
+                    "data-cy": sel("dashboard.topnav.mobileMenu.userInfo"),
                     children: [
                       user.image ? /* @__PURE__ */ jsx(
                         Image,
@@ -596,8 +614,7 @@ function TopNavbar({ entities, className }) {
                     className: "block px-3 py-2 rounded-md text-base font-medium text-foreground hover:bg-accent",
                     onClick: handleMenuClose,
                     "aria-label": "Ir a perfil",
-                    ...createTestId("topnav", "mobile", "profile") && { "data-testid": createTestId("topnav", "mobile", "profile") },
-                    "data-cy": sel("dashboard.topnav.mobileLinkProfile"),
+                    "data-cy": sel("dashboard.topnav.mobileMenu.linkProfile"),
                     children: [
                       /* @__PURE__ */ jsx(User, { className: "inline mr-2 h-4 w-4", "aria-hidden": "true" }),
                       "Profile"
@@ -611,8 +628,7 @@ function TopNavbar({ entities, className }) {
                     className: "block px-3 py-2 rounded-md text-base font-medium text-foreground hover:bg-accent",
                     onClick: handleMenuClose,
                     "aria-label": "Ir a configuraci\xF3n",
-                    ...createTestId("topnav", "mobile", "settings") && { "data-testid": createTestId("topnav", "mobile", "settings") },
-                    "data-cy": sel("dashboard.topnav.mobileLinkSettings"),
+                    "data-cy": sel("dashboard.topnav.mobileMenu.linkSettings"),
                     children: [
                       /* @__PURE__ */ jsx(Settings, { className: "inline mr-2 h-4 w-4", "aria-hidden": "true" }),
                       "Settings"
@@ -626,8 +642,7 @@ function TopNavbar({ entities, className }) {
                     className: "block px-3 py-2 rounded-md text-base font-medium text-foreground hover:bg-accent",
                     onClick: handleMenuClose,
                     "aria-label": "Ir a facturaci\xF3n",
-                    ...createTestId("topnav", "mobile", "billing") && { "data-testid": createTestId("topnav", "mobile", "billing") },
-                    "data-cy": sel("dashboard.topnav.mobileLinkBilling"),
+                    "data-cy": sel("dashboard.topnav.mobileMenu.linkBilling"),
                     children: [
                       /* @__PURE__ */ jsx(CreditCard, { className: "inline mr-2 h-4 w-4", "aria-hidden": "true" }),
                       "Billing"
@@ -643,8 +658,7 @@ function TopNavbar({ entities, className }) {
                     },
                     className: "w-full text-left px-3 py-2 rounded-md text-base font-medium text-red-600 hover:bg-accent",
                     "aria-label": "Cerrar sesi\xF3n",
-                    ...createTestId("topnav", "mobile", "signout") && { "data-testid": createTestId("topnav", "mobile", "signout") },
-                    "data-cy": sel("dashboard.topnav.mobileSignout"),
+                    "data-cy": sel("dashboard.topnav.mobileMenu.signout"),
                     children: [
                       /* @__PURE__ */ jsx(LogOut, { className: "inline mr-2 h-4 w-4", "aria-hidden": "true" }),
                       "Sign out"
@@ -659,8 +673,7 @@ function TopNavbar({ entities, className }) {
                     className: "block px-3 py-2 rounded-md text-base font-medium text-foreground hover:bg-accent",
                     onClick: handleMenuClose,
                     "aria-label": "Iniciar sesi\xF3n",
-                    ...createTestId("topnav", "mobile", "signin") && { "data-testid": createTestId("topnav", "mobile", "signin") },
-                    "data-cy": "topnav-mobile-signin",
+                    "data-cy": sel("dashboard.topnav.signin"),
                     children: "Sign in"
                   }
                 ),
@@ -671,8 +684,7 @@ function TopNavbar({ entities, className }) {
                     className: "block px-3 py-2 rounded-md text-base font-medium text-foreground hover:bg-accent",
                     onClick: handleMenuClose,
                     "aria-label": "Registrarse",
-                    ...createTestId("topnav", "mobile", "signup") && { "data-testid": createTestId("topnav", "mobile", "signup") },
-                    "data-cy": "topnav-mobile-signup",
+                    "data-cy": sel("dashboard.topnav.signup"),
                     children: "Sign up"
                   }
                 )

package/dist/components/dashboard/layouts/index.js

@@ -1,7 +1,7 @@
-import { AuthGuard } from "./AuthGuard";
-import { DashboardShell } from "./DashboardShell";
-import { Sidebar } from "./Sidebar";
-import { TopNavbar } from "./TopNavbar";
+import { AuthGuard } from "./AuthGuard.js";
+import { DashboardShell } from "./DashboardShell.js";
+import { Sidebar } from "./Sidebar.js";
+import { TopNavbar } from "./TopNavbar.js";
 export {
   AuthGuard,
   DashboardShell,

package/dist/components/dashboard/misc/NotificationsDropdown.js

@@ -1,7 +1,7 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import Link from "next/link";
-import { Button } from "../../ui/button";
+import { Button } from "../../ui/button.js";
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -9,14 +9,14 @@ import {
   DropdownMenuLabel,
   DropdownMenuSeparator,
   DropdownMenuTrigger
-} from "../../ui/dropdown-menu";
-import { ScrollArea } from "../../ui/scroll-area";
-import { Badge } from "../../ui/badge";
+} from "../../ui/dropdown-menu.js";
+import { ScrollArea } from "../../ui/scroll-area.js";
+import { Badge } from "../../ui/badge.js";
 import { Bell, Check, CheckCheck, X, AlertCircle, Info, CheckCircle, AlertTriangle, Settings } from "lucide-react";
-import { useNotifications } from "../../../hooks/useNotifications";
-import { cn } from "../../../lib/utils";
+import { useNotifications } from "../../../hooks/useNotifications.js";
+import { cn } from "../../../lib/utils/index.js";
 import { useState, useCallback } from "react";
-import { createTestId, createCyId, createAriaLabel } from "../../../lib/test";
+import { sel, createAriaLabel } from "../../../lib/test/index.js";
 import { useTranslations } from "next-intl";
 const getNotificationIcon = (type) => {
   switch (type) {
@@ -90,8 +90,6 @@ function NotificationItem({ notification, onMarkAsRead, onDelete }) {
           status: notification.isRead ? "le\xEDda" : "no le\xEDda"
         }
       ),
-      ...createTestId("notification", "item") && { "data-testid": createTestId("notification", "item") },
-      ...createCyId("notification", "item") && { "data-cy": createCyId("notification", "item") },
       "data-notification-id": notification.id,
       "data-read": notification.isRead,
       "data-type": notification.type,
@@ -113,8 +111,6 @@ function NotificationItem({ notification, onMarkAsRead, onDelete }) {
                   className: "h-6 w-6 p-0 opacity-0 group-hover:opacity-100 transition-opacity",
                   onClick: handleDelete,
                   "aria-label": `Eliminar notificaci\xF3n: ${notification.title}`,
-                  ...createTestId("notification", "delete", "button") && { "data-testid": createTestId("notification", "delete", "button") },
-                  ...createCyId("notification", "delete") && { "data-cy": createCyId("notification", "delete") },
                   children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3", "aria-hidden": "true" })
                 }
               )
@@ -131,8 +127,6 @@ function NotificationItem({ notification, onMarkAsRead, onDelete }) {
                 className: "h-6 px-2 text-xs opacity-0 group-hover:opacity-100 transition-opacity",
                 onClick: handleMarkAsRead,
                 "aria-label": `Marcar como le\xEDda: ${notification.title}`,
-                ...createTestId("notification", "mark", "read") && { "data-testid": createTestId("notification", "mark", "read") },
-                ...createCyId("notification", "mark-read") && { "data-cy": createCyId("notification", "mark-read") },
                 children: [
                   /* @__PURE__ */ jsx(Check, { className: "h-3 w-3 mr-1", "aria-hidden": "true" }),
                   "Marcar le\xEDdo"
@@ -164,7 +158,6 @@ function NotificationsDropdown() {
         "aria-live": "polite",
         "aria-atomic": "true",
         className: "sr-only",
-        ...createTestId("notifications", "status", "message") && { "data-testid": createTestId("notifications", "status", "message") },
         children: statusMessage
       }
     ),
@@ -184,8 +177,7 @@ function NotificationsDropdown() {
           ),
           "aria-haspopup": "true",
           "aria-expanded": "false",
-          ...createTestId("notifications", "trigger", "button") && { "data-testid": createTestId("notifications", "trigger", "button") },
-          ...createCyId("notifications", "trigger") && { "data-cy": createCyId("notifications", "trigger") },
+          "data-cy": sel("dashboard.topnav.notifications.trigger"),
           children: [
             /* @__PURE__ */ jsx(Bell, { className: "h-4 w-4", "aria-hidden": "true" }),
             unreadCount > 0 && /* @__PURE__ */ jsx(
@@ -194,8 +186,6 @@ function NotificationsDropdown() {
                 className: "absolute -top-1 -right-1 h-5 w-5 bg-red-500 rounded-full flex items-center justify-center",
                 role: "status",
                 "aria-label": `${unreadCount} ${t("notifications.unread")}`,
-                ...createTestId("notifications", "badge") && { "data-testid": createTestId("notifications", "badge") },
-                ...createCyId("notifications", "unread-badge") && { "data-cy": createCyId("notifications", "unread-badge") },
                 children: /* @__PURE__ */ jsx("span", { className: "text-[10px] text-white font-medium", "aria-hidden": "true", children: unreadCount > 9 ? "9+" : unreadCount })
               }
             )
@@ -220,8 +210,6 @@ function NotificationsDropdown() {
                 className: "h-6 px-2 text-xs",
                 onClick: handleMarkAllAsRead,
                 "aria-label": t("notifications.markAllAsRead"),
-                ...createTestId("notifications", "mark", "all") && { "data-testid": createTestId("notifications", "mark", "all") },
-                ...createCyId("notifications", "mark-all") && { "data-cy": createCyId("notifications", "mark-all") },
                 children: [
                   /* @__PURE__ */ jsx(CheckCheck, { className: "h-3 w-3 mr-1", "aria-hidden": "true" }),
                   t("notifications.markAll")