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

package/dist/components/api/keys/ApiKeyDisplay.js

@@ -1,13 +1,13 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
-import { Button } from "../../ui/button";
-import { Input } from "../../ui/input";
-import { Alert, AlertDescription } from "../../ui/alert";
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../../ui/card";
+import { Button } from "../../ui/button.js";
+import { Input } from "../../ui/input.js";
+import { Alert, AlertDescription } from "../../ui/alert.js";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../../ui/card.js";
 import { Copy, Eye, EyeOff, CheckCircle, AlertTriangle, X } from "lucide-react";
 import { toast } from "sonner";
-import { createCyId } from "../../../lib/test";
+import { sel } from "../../../lib/test/index.js";
 function ApiKeyDisplay({ apiKey, keyName, warning, onClose }) {
   const [isVisible, setIsVisible] = useState(false);
   const [copied, setCopied] = useState(false);
@@ -22,19 +22,19 @@ function ApiKeyDisplay({ apiKey, keyName, warning, onClose }) {
     }
   };
   const maskedKey = apiKey.substring(0, 16) + "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022";
-  return /* @__PURE__ */ jsxs(Card, { className: "border-green-200 bg-green-50", "data-cy": createCyId("api-keys", "display"), children: [
+  return /* @__PURE__ */ jsxs(Card, { className: "border-green-200 bg-green-50", "data-cy": sel("settings.apiKeys.newKeyDisplay.container"), children: [
     /* @__PURE__ */ jsxs(CardHeader, { children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ jsx(CheckCircle, { className: "h-5 w-5 text-green-600" }),
-          /* @__PURE__ */ jsx(CardTitle, { className: "text-green-800", "data-cy": createCyId("api-keys", "display-title"), children: "API Key creada exitosamente" })
+          /* @__PURE__ */ jsx(CardTitle, { className: "text-green-800", children: "API Key creada exitosamente" })
         ] }),
-        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: onClose, "data-cy": createCyId("api-keys", "display-close"), children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }) })
+        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: onClose, children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }) })
       ] }),
-      keyName && /* @__PURE__ */ jsx(CardDescription, { className: "text-green-700", "data-cy": createCyId("api-keys", "display-name"), children: keyName })
+      keyName && /* @__PURE__ */ jsx(CardDescription, { className: "text-green-700", children: keyName })
     ] }),
     /* @__PURE__ */ jsxs(CardContent, { className: "space-y-4", children: [
-      warning && /* @__PURE__ */ jsxs(Alert, { variant: "destructive", "data-cy": createCyId("api-keys", "display-warning"), children: [
+      warning && /* @__PURE__ */ jsxs(Alert, { variant: "destructive", children: [
         /* @__PURE__ */ jsx(AlertTriangle, { className: "h-4 w-4" }),
         /* @__PURE__ */ jsxs(AlertDescription, { children: [
           /* @__PURE__ */ jsx("strong", { children: "\xA1Importante!" }),
@@ -52,8 +52,7 @@ function ApiKeyDisplay({ apiKey, keyName, warning, onClose }) {
                 type: isVisible ? "text" : "password",
                 value: isVisible ? apiKey : maskedKey,
                 readOnly: true,
-                className: "font-mono text-sm pr-10",
-                "data-cy": createCyId("api-keys", "display-value")
+                className: "font-mono text-sm pr-10"
               }
             ),
             /* @__PURE__ */ jsx(
@@ -64,7 +63,6 @@ function ApiKeyDisplay({ apiKey, keyName, warning, onClose }) {
                 size: "sm",
                 className: "absolute right-1 top-1 h-8 w-8 p-0",
                 onClick: () => setIsVisible(!isVisible),
-                "data-cy": createCyId("api-keys", "display-toggle"),
                 children: isVisible ? /* @__PURE__ */ jsx(EyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(Eye, { className: "h-4 w-4" })
               }
             )
@@ -75,7 +73,7 @@ function ApiKeyDisplay({ apiKey, keyName, warning, onClose }) {
               onClick: copyToClipboard,
               variant: copied ? "default" : "outline",
               className: "shrink-0",
-              "data-cy": createCyId("api-keys", "display-copy"),
+              "data-cy": sel("settings.apiKeys.newKeyDisplay.copyButton"),
               children: [
                 /* @__PURE__ */ jsx(Copy, { className: "h-4 w-4 mr-2" }),
                 copied ? "Copiado!" : "Copiar"

package/dist/components/api/keys/CreateApiKeyDialog.js

@@ -2,10 +2,10 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { useMutation } from "@tanstack/react-query";
-import { Button } from "../../ui/button";
-import { Input } from "../../ui/input";
-import { Label } from "../../ui/label";
-import { Checkbox } from "../../ui/checkbox";
+import { Button } from "../../ui/button.js";
+import { Input } from "../../ui/input.js";
+import { Label } from "../../ui/label.js";
+import { Checkbox } from "../../ui/checkbox.js";
 import {
   Dialog,
   DialogContent,
@@ -13,21 +13,21 @@ import {
   DialogFooter,
   DialogHeader,
   DialogTitle
-} from "../../ui/dialog";
+} from "../../ui/dialog.js";
 import {
   Select,
   SelectContent,
   SelectItem,
   SelectTrigger,
   SelectValue
-} from "../../ui/select";
-import { Alert, AlertDescription } from "../../ui/alert";
-import { Badge } from "../../ui/badge";
-import { Separator } from "../../ui/separator";
+} from "../../ui/select.js";
+import { Alert, AlertDescription } from "../../ui/alert.js";
+import { Badge } from "../../ui/badge.js";
+import { Separator } from "../../ui/separator.js";
 import { AlertTriangle, Info } from "lucide-react";
 import { toast } from "sonner";
-import { API_SCOPES, SCOPE_CATEGORIES } from "../../../lib/api/keys";
-import { createCyId } from "../../../lib/test";
+import { API_SCOPES, SCOPE_CATEGORIES } from "../../../lib/api/keys.js";
+import { sel } from "../../../lib/test/index.js";
 function CreateApiKeyDialog({ open, onClose, onSuccess }) {
   const [name, setName] = useState("");
   const [selectedScopes, setSelectedScopes] = useState([]);
@@ -116,12 +116,12 @@ function CreateApiKeyDialog({ open, onClose, onSuccess }) {
   const isCategoryPartiallySelected = (categoryScopes) => {
     return categoryScopes.some((scope) => selectedScopes.includes(scope)) && !isCategoryFullySelected(categoryScopes);
   };
-  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-w-2xl max-h-[90vh] overflow-y-auto", "data-cy": createCyId("api-keys", "dialog"), children: [
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-w-2xl max-h-[90vh] overflow-y-auto", "data-cy": sel("settings.apiKeys.createDialog.container"), children: [
     /* @__PURE__ */ jsxs(DialogHeader, { children: [
-      /* @__PURE__ */ jsx(DialogTitle, { "data-cy": createCyId("api-keys", "dialog-title"), children: "Crear nueva API Key" }),
+      /* @__PURE__ */ jsx(DialogTitle, { children: "Crear nueva API Key" }),
       /* @__PURE__ */ jsx(DialogDescription, { children: "Crea una API key para acceder a los endpoints externos de forma segura." })
     ] }),
-    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-6", "data-cy": createCyId("api-keys", "dialog-form"), children: [
+    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-6", children: [
       /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
         /* @__PURE__ */ jsx(Label, { htmlFor: "name", children: "Nombre de la API Key" }),
         /* @__PURE__ */ jsx(
@@ -132,7 +132,7 @@ function CreateApiKeyDialog({ open, onClose, onSuccess }) {
             onChange: (e) => setName(e.target.value),
             placeholder: "ej. Mi aplicaci\xF3n m\xF3vil",
             maxLength: 100,
-            "data-cy": createCyId("api-keys", "dialog-name")
+            "data-cy": sel("settings.apiKeys.createDialog.nameInput")
           }
         ),
         /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Un nombre descriptivo para identificar esta API key" })
@@ -140,13 +140,13 @@ function CreateApiKeyDialog({ open, onClose, onSuccess }) {
       /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
         /* @__PURE__ */ jsx(Label, { children: "Expiraci\xF3n" }),
         /* @__PURE__ */ jsxs(Select, { value: expiryOption, onValueChange: (value) => setExpiryOption(value), children: [
-          /* @__PURE__ */ jsx(SelectTrigger, { "data-cy": createCyId("api-keys", "dialog-expiration"), children: /* @__PURE__ */ jsx(SelectValue, {}) }),
-          /* @__PURE__ */ jsxs(SelectContent, { "data-cy": createCyId("api-keys", "dialog-expiration-options"), children: [
-            /* @__PURE__ */ jsx(SelectItem, { value: "never", "data-cy": createCyId("api-keys", "dialog-expiration-never"), children: "Nunca expira" }),
-            /* @__PURE__ */ jsx(SelectItem, { value: "30d", "data-cy": createCyId("api-keys", "dialog-expiration-30d"), children: "30 d\xEDas" }),
-            /* @__PURE__ */ jsx(SelectItem, { value: "90d", "data-cy": createCyId("api-keys", "dialog-expiration-90d"), children: "90 d\xEDas" }),
-            /* @__PURE__ */ jsx(SelectItem, { value: "1y", "data-cy": createCyId("api-keys", "dialog-expiration-1y"), children: "1 a\xF1o" }),
-            /* @__PURE__ */ jsx(SelectItem, { value: "custom", "data-cy": createCyId("api-keys", "dialog-expiration-custom"), children: "Fecha personalizada" })
+          /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsxs(SelectContent, { children: [
+            /* @__PURE__ */ jsx(SelectItem, { value: "never", children: "Nunca expira" }),
+            /* @__PURE__ */ jsx(SelectItem, { value: "30d", children: "30 d\xEDas" }),
+            /* @__PURE__ */ jsx(SelectItem, { value: "90d", children: "90 d\xEDas" }),
+            /* @__PURE__ */ jsx(SelectItem, { value: "1y", children: "1 a\xF1o" }),
+            /* @__PURE__ */ jsx(SelectItem, { value: "custom", children: "Fecha personalizada" })
           ] })
         ] }),
         expiryOption === "custom" && /* @__PURE__ */ jsx(
@@ -155,12 +155,11 @@ function CreateApiKeyDialog({ open, onClose, onSuccess }) {
             type: "datetime-local",
             value: expiresAt,
             onChange: (e) => setExpiresAt(e.target.value),
-            min: (/* @__PURE__ */ new Date()).toISOString().slice(0, 16),
-            "data-cy": createCyId("api-keys", "dialog-expiration-date")
+            min: (/* @__PURE__ */ new Date()).toISOString().slice(0, 16)
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs("div", { className: "space-y-4", "data-cy": createCyId("api-keys", "dialog-scopes"), children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-4", "data-cy": sel("settings.apiKeys.createDialog.scopesContainer"), children: [
         /* @__PURE__ */ jsxs("div", { children: [
           /* @__PURE__ */ jsx(Label, { children: "Permisos (Scopes)" }),
           /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Selecciona los permisos que tendr\xE1 esta API key" })
@@ -172,7 +171,7 @@ function CreateApiKeyDialog({ open, onClose, onSuccess }) {
         /* @__PURE__ */ jsx("div", { className: "space-y-4", children: Object.entries(SCOPE_CATEGORIES).map(([categoryKey, category]) => {
           const isFullySelected = isCategoryFullySelected(category.scopes);
           const isPartiallySelected = isCategoryPartiallySelected(category.scopes);
-          return /* @__PURE__ */ jsxs("div", { className: "space-y-3", "data-cy": createCyId("api-keys", `dialog-category-${categoryKey}`), children: [
+          return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
             /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
               /* @__PURE__ */ jsx(
                 Checkbox,
@@ -182,8 +181,7 @@ function CreateApiKeyDialog({ open, onClose, onSuccess }) {
                   ref: (el) => {
                     if (el && "indeterminate" in el) el.indeterminate = isPartiallySelected;
                   },
-                  onCheckedChange: (checked) => handleCategoryToggle(category.scopes, checked),
-                  "data-cy": createCyId("api-keys", `dialog-category-checkbox-${categoryKey}`)
+                  onCheckedChange: (checked) => handleCategoryToggle(category.scopes, checked)
                 }
               ),
               /* @__PURE__ */ jsxs("div", { children: [
@@ -205,7 +203,7 @@ function CreateApiKeyDialog({ open, onClose, onSuccess }) {
                   id: scope,
                   checked: selectedScopes.includes(scope),
                   onCheckedChange: (checked) => handleScopeToggle(scope, checked),
-                  "data-cy": createCyId("api-keys", `dialog-permission-${scope}`)
+                  "data-cy": sel("settings.apiKeys.createDialog.scopeOption", { scope })
                 }
               ),
               /* @__PURE__ */ jsxs(Label, { htmlFor: scope, className: "text-sm", children: [
@@ -216,16 +214,16 @@ function CreateApiKeyDialog({ open, onClose, onSuccess }) {
             categoryKey !== "system" && /* @__PURE__ */ jsx(Separator, {})
           ] }, categoryKey);
         }) }),
-        selectedScopes.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-2", "data-cy": createCyId("api-keys", "dialog-selected-scopes"), children: [
+        selectedScopes.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
           /* @__PURE__ */ jsxs(Label, { children: [
             "Permisos seleccionados (",
             selectedScopes.length,
             ")"
           ] }),
-          /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1", children: selectedScopes.map((scope) => /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "text-xs", "data-cy": createCyId("api-keys", `dialog-selected-${scope}`), children: scope }, scope)) })
+          /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1", children: selectedScopes.map((scope) => /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "text-xs", children: scope }, scope)) })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs(Alert, { variant: "destructive", "data-cy": createCyId("api-keys", "dialog-warning"), children: [
+      /* @__PURE__ */ jsxs(Alert, { variant: "destructive", children: [
         /* @__PURE__ */ jsx(AlertTriangle, { className: "h-4 w-4" }),
         /* @__PURE__ */ jsxs(AlertDescription, { children: [
           /* @__PURE__ */ jsx("strong", { children: "Importante:" }),
@@ -233,14 +231,14 @@ function CreateApiKeyDialog({ open, onClose, onSuccess }) {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs(DialogFooter, { "data-cy": createCyId("api-keys", "dialog-footer"), children: [
-      /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: handleClose, disabled: createApiKey.isPending, "data-cy": createCyId("api-keys", "dialog-cancel"), children: "Cancelar" }),
+    /* @__PURE__ */ jsxs(DialogFooter, { "data-cy": sel("settings.apiKeys.createDialog.footer"), children: [
+      /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: handleClose, disabled: createApiKey.isPending, children: "Cancelar" }),
       /* @__PURE__ */ jsx(
         Button,
         {
           onClick: handleSubmit,
           disabled: createApiKey.isPending || selectedScopes.length === 0 || !name.trim(),
-          "data-cy": createCyId("api-keys", "dialog-submit"),
+          "data-cy": sel("settings.apiKeys.createDialog.submitButton"),
           children: createApiKey.isPending ? "Creando..." : "Crear API Key"
         }
       )

package/dist/components/app/guards/DeveloperGuard.js

@@ -1,11 +1,11 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useSession } from "../../../lib/auth-client";
+import { useSession } from "../../../lib/auth-client.js";
 import { useRouter } from "next/navigation";
 import { useEffect } from "react";
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../../ui/card";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../../ui/card.js";
 import { AlertTriangle, ArrowLeft } from "lucide-react";
-import { Button } from "../../ui/button";
+import { Button } from "../../ui/button.js";
 import { useTranslations } from "next-intl";
 function DeveloperGuard({ children, fallback }) {
   var _a;

package/dist/components/app/guards/SuperAdminGuard.js

@@ -1,11 +1,11 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useSession } from "../../../lib/auth-client";
+import { useSession } from "../../../lib/auth-client.js";
 import { useRouter } from "next/navigation";
 import { useEffect } from "react";
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../../ui/card";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../../ui/card.js";
 import { AlertTriangle, ArrowLeft } from "lucide-react";
-import { Button } from "../../ui/button";
+import { Button } from "../../ui/button.js";
 import { useTranslations } from "next-intl";
 function SuperAdminGuard({ children, fallback }) {
   var _a, _b;

package/dist/components/app/guards/index.js

@@ -1,5 +1,5 @@
-import { DeveloperGuard, useIsDeveloper } from "./DeveloperGuard";
-import { SuperAdminGuard, useIsSuperAdmin, useCanAccessAdmin } from "./SuperAdminGuard";
+import { DeveloperGuard, useIsDeveloper } from "./DeveloperGuard.js";
+import { SuperAdminGuard, useIsSuperAdmin, useCanAccessAdmin } from "./SuperAdminGuard.js";
 export {
   DeveloperGuard,
   SuperAdminGuard,

package/dist/components/app/index.js

@@ -1,8 +1,8 @@
-import { DeveloperGuard, useIsDeveloper } from "./guards/DeveloperGuard";
-import { SuperAdminGuard, useIsSuperAdmin, useCanAccessAdmin } from "./guards/SuperAdminGuard";
-import { PublicFooter } from "./layouts/PublicFooter";
-import { PublicNavbar } from "./layouts/PublicNavbar";
-import { ThemeToggle } from "./misc/ThemeToggle";
+import { DeveloperGuard, useIsDeveloper } from "./guards/DeveloperGuard.js";
+import { SuperAdminGuard, useIsSuperAdmin, useCanAccessAdmin } from "./guards/SuperAdminGuard.js";
+import { PublicFooter } from "./layouts/PublicFooter.js";
+import { PublicNavbar } from "./layouts/PublicNavbar.js";
+import { ThemeToggle } from "./misc/ThemeToggle.js";
 export {
   DeveloperGuard,
   PublicFooter,

package/dist/components/app/layouts/PublicFooter.js

@@ -1,8 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import Link from "next/link";
-import { Separator } from "../../ui/separator";
+import { Separator } from "../../ui/separator.js";
 import { useTranslations } from "next-intl";
-import { sel } from "../../../lib/test";
+import { sel } from "../../../lib/test/index.js";
 function PublicFooter() {
   const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
   const t = useTranslations("footer");

package/dist/components/app/layouts/PublicNavbar.js

@@ -1,12 +1,12 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import Link from "next/link";
-import { useAuth } from "../../../hooks/useAuth";
-import { Button } from "../../ui/button";
-import { ThemeToggle } from "../misc/ThemeToggle";
+import { useAuth } from "../../../hooks/useAuth.js";
+import { Button } from "../../ui/button.js";
+import { ThemeToggle } from "../misc/ThemeToggle.js";
 import { Menu, X } from "lucide-react";
 import { useState } from "react";
-import { sel } from "../../../lib/test";
+import { sel } from "../../../lib/test/index.js";
 import { useTranslations } from "next-intl";
 function PublicNavbar() {
   const { user, isLoading } = useAuth();

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

@@ -1,5 +1,5 @@
-import { PublicFooter } from "./PublicFooter";
-import { PublicNavbar } from "./PublicNavbar";
+import { PublicFooter } from "./PublicFooter.js";
+import { PublicNavbar } from "./PublicNavbar.js";
 export {
   PublicFooter,
   PublicNavbar

package/dist/components/app/misc/ThemeToggle.js

@@ -2,17 +2,17 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Moon, Sun, Monitor } from "lucide-react";
 import { useTheme } from "next-themes";
-import { Button } from "../../ui/button";
+import { Button } from "../../ui/button.js";
 import {
   DropdownMenu,
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger
-} from "../../ui/dropdown-menu";
+} from "../../ui/dropdown-menu.js";
 import { useEffect, useState, useCallback } from "react";
-import { createTestId, createCyId, createAriaLabel } from "../../../lib/test";
+import { createAriaLabel, sel } from "../../../lib/test/index.js";
 import { useTranslations } from "next-intl";
-import { useAuth } from "../../../hooks/useAuth";
+import { useAuth } from "../../../hooks/useAuth.js";
 function ThemeToggle() {
   const { setTheme, theme } = useTheme();
   const { user } = useAuth();
@@ -58,8 +58,7 @@ function ThemeToggle() {
         size: "icon",
         disabled: true,
         "aria-label": t("theme.loading"),
-        ...createTestId("theme", "toggle", "loading") && { "data-testid": createTestId("theme", "toggle", "loading") },
-        ...createCyId("theme", "loading") && { "data-cy": createCyId("theme", "loading") },
+        "data-cy": sel("dashboard.topnav.themeToggle"),
         children: [
           /* @__PURE__ */ jsx(Sun, { className: "h-5 w-5", "aria-hidden": "true" }),
           /* @__PURE__ */ jsx("span", { className: "sr-only", children: t("theme.loading") })
@@ -74,7 +73,6 @@ function ThemeToggle() {
         "aria-live": "polite",
         "aria-atomic": "true",
         className: "sr-only",
-        ...createTestId("theme", "status", "message") && { "data-testid": createTestId("theme", "status", "message") },
         children: statusMessage
       }
     ),
@@ -91,8 +89,7 @@ function ThemeToggle() {
           }),
           "aria-haspopup": "true",
           "aria-expanded": "false",
-          ...createTestId("theme", "toggle", "button") && { "data-testid": createTestId("theme", "toggle", "button") },
-          ...createCyId("theme", "toggle") && { "data-cy": createCyId("theme", "toggle") },
+          "data-cy": sel("dashboard.topnav.themeToggle"),
           children: [
             /* @__PURE__ */ jsx(Sun, { className: "h-5 w-5 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0", "aria-hidden": "true" }),
             /* @__PURE__ */ jsx(Moon, { className: "absolute h-5 w-5 rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100", "aria-hidden": "true" }),
@@ -104,16 +101,12 @@ function ThemeToggle() {
         DropdownMenuContent,
         {
           align: "end",
-          ...createTestId("theme", "dropdown", "content") && { "data-testid": createTestId("theme", "dropdown", "content") },
-          ...createCyId("theme", "menu") && { "data-cy": createCyId("theme", "menu") },
           children: [
             /* @__PURE__ */ jsxs(
               DropdownMenuItem,
               {
                 onClick: () => handleThemeChange("light"),
                 "aria-label": t("theme.changeToLight"),
-                ...createTestId("theme", "option", "light") && { "data-testid": createTestId("theme", "option", "light") },
-                ...createCyId("theme", "light") && { "data-cy": createCyId("theme", "light") },
                 children: [
                   /* @__PURE__ */ jsx(Sun, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
                   /* @__PURE__ */ jsx("span", { children: t("theme.light") })
@@ -125,8 +118,6 @@ function ThemeToggle() {
               {
                 onClick: () => handleThemeChange("dark"),
                 "aria-label": t("theme.changeToDark"),
-                ...createTestId("theme", "option", "dark") && { "data-testid": createTestId("theme", "option", "dark") },
-                ...createCyId("theme", "dark") && { "data-cy": createCyId("theme", "dark") },
                 children: [
                   /* @__PURE__ */ jsx(Moon, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
                   /* @__PURE__ */ jsx("span", { children: t("theme.dark") })
@@ -138,8 +129,6 @@ function ThemeToggle() {
               {
                 onClick: () => handleThemeChange("system"),
                 "aria-label": t("theme.changeToSystem"),
-                ...createTestId("theme", "option", "system") && { "data-testid": createTestId("theme", "option", "system") },
-                ...createCyId("theme", "system") && { "data-cy": createCyId("theme", "system") },
                 children: [
                   /* @__PURE__ */ jsx(Monitor, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
                   /* @__PURE__ */ jsx("span", { children: t("theme.system") })

package/dist/components/app/misc/index.js

@@ -1,4 +1,4 @@
-import { ThemeToggle } from "./ThemeToggle";
+import { ThemeToggle } from "./ThemeToggle.js";
 export {
   ThemeToggle
 };

package/dist/components/auth/DevKeyring.js

@@ -2,10 +2,10 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useCallback, useMemo } from "react";
 import { Key, ChevronDown, User, Shield, Crown, ShieldCheck, UserCircle } from "lucide-react";
-import { Popover, PopoverContent, PopoverTrigger } from "../ui/popover";
-import { Button } from "../ui/button";
-import { Badge } from "../ui/badge";
-import { sel } from "../../lib/test";
+import { Popover, PopoverContent, PopoverTrigger } from "../ui/popover.js";
+import { Button } from "../ui/button.js";
+import { Badge } from "../ui/badge.js";
+import { sel } from "../../lib/test/index.js";
 function parseTeamRoles(teamRoles) {
   if (!teamRoles) return [];
   const hasHighlight = teamRoles.includes("\u2B50");