@nocios/crudify-ui 3.0.48 → 3.0.52

package/dist/index.d.mts

@@ -227,6 +227,8 @@ type SessionConfig = {
     onSessionRestored?: (tokens: TokenData) => void;
     onLoginSuccess?: (tokens: TokenData) => void;
     onLogout?: () => void;
+    showNotification?: (message: string, severity?: "error" | "info" | "success" | "warning") => void;
+    translateFn?: (key: string) => string;
 };
 type LoginResult = {
     success: boolean;
@@ -298,6 +300,10 @@ declare class SessionManager {
      * Limpiar sesión completamente
      */
     clearSession(): void;
+    /**
+     * Obtener mensaje de sesión expirada traducido
+     */
+    private getSessionExpiredMessage;
     private log;
     private formatError;
 }
@@ -314,6 +320,8 @@ type UseSessionOptions = {
     enableLogging?: boolean;
     onSessionExpired?: () => void;
     onSessionRestored?: (tokens: TokenData) => void;
+    showNotification?: (message: string, severity?: "error" | "info" | "success" | "warning") => void;
+    translateFn?: (key: string) => string;
 };
 declare function useSession(options?: UseSessionOptions): {
     login: (email: string, password: string) => Promise<LoginResult>;
@@ -400,10 +408,9 @@ type SessionProviderProps = {
     notificationOptions?: NotificationOptions;
 };
 /**
- * Provider de sesión para envolver la aplicación
+ * Provider de sesión principal para envolver la aplicación
  */
-declare function SessionProvider({ children, options, config: propConfig, showNotifications, // ✅ Por defecto DESACTIVADO
-notificationOptions, }: SessionProviderProps): react_jsx_runtime.JSX.Element;
+declare function SessionProvider(props: SessionProviderProps): react_jsx_runtime.JSX.Element;
 /**
  * Hook para usar el contexto de sesión
  */

package/dist/index.d.ts

@@ -227,6 +227,8 @@ type SessionConfig = {
     onSessionRestored?: (tokens: TokenData) => void;
     onLoginSuccess?: (tokens: TokenData) => void;
     onLogout?: () => void;
+    showNotification?: (message: string, severity?: "error" | "info" | "success" | "warning") => void;
+    translateFn?: (key: string) => string;
 };
 type LoginResult = {
     success: boolean;
@@ -298,6 +300,10 @@ declare class SessionManager {
      * Limpiar sesión completamente
      */
     clearSession(): void;
+    /**
+     * Obtener mensaje de sesión expirada traducido
+     */
+    private getSessionExpiredMessage;
     private log;
     private formatError;
 }
@@ -314,6 +320,8 @@ type UseSessionOptions = {
     enableLogging?: boolean;
     onSessionExpired?: () => void;
     onSessionRestored?: (tokens: TokenData) => void;
+    showNotification?: (message: string, severity?: "error" | "info" | "success" | "warning") => void;
+    translateFn?: (key: string) => string;
 };
 declare function useSession(options?: UseSessionOptions): {
     login: (email: string, password: string) => Promise<LoginResult>;
@@ -400,10 +408,9 @@ type SessionProviderProps = {
     notificationOptions?: NotificationOptions;
 };
 /**
- * Provider de sesión para envolver la aplicación
+ * Provider de sesión principal para envolver la aplicación
  */
-declare function SessionProvider({ children, options, config: propConfig, showNotifications, // ✅ Por defecto DESACTIVADO
-notificationOptions, }: SessionProviderProps): react_jsx_runtime.JSX.Element;
+declare function SessionProvider(props: SessionProviderProps): react_jsx_runtime.JSX.Element;
 /**
  * Hook para usar el contexto de sesión
  */

package/dist/index.js

@@ -662,6 +662,162 @@ _TokenStorage.ENCRYPTION_KEY = "crudify_secure_key_v1";
 _TokenStorage.storageType = "localStorage";
 var TokenStorage = _TokenStorage;
 
+// src/utils/errorTranslation.ts
+var ERROR_TRANSLATION_HIERARCHY = [
+  "errors.{category}.{code}",
+  // errors.auth.INVALID_CREDENTIALS
+  "errors.{code}",
+  // errors.INVALID_CREDENTIALS
+  "login.{code}",
+  // login.INVALID_CREDENTIALS (legacy)
+  "error.{code}",
+  // error.INVALID_CREDENTIALS (singular)
+  "messages.{code}",
+  // messages.INVALID_CREDENTIALS
+  "{code}"
+  // INVALID_CREDENTIALS (direct)
+];
+var ERROR_CATEGORY_MAP = {
+  // Authentication errors
+  "INVALID_CREDENTIALS": "auth",
+  "UNAUTHORIZED": "auth",
+  "INVALID_API_KEY": "auth",
+  "USER_NOT_FOUND": "auth",
+  "USER_NOT_ACTIVE": "auth",
+  "NO_PERMISSION": "auth",
+  "SESSION_EXPIRED": "auth",
+  // Data errors
+  "ITEM_NOT_FOUND": "data",
+  "NOT_FOUND": "data",
+  "IN_USE": "data",
+  "DUPLICATE_ENTRY": "data",
+  // Validation errors
+  "FIELD_ERROR": "validation",
+  "BAD_REQUEST": "validation",
+  "INVALID_EMAIL": "validation",
+  "INVALID_CODE": "validation",
+  "REQUIRED_FIELD": "validation",
+  // System errors
+  "INTERNAL_SERVER_ERROR": "system",
+  "DATABASE_CONNECTION_ERROR": "system",
+  "INVALID_CONFIGURATION": "system",
+  "UNKNOWN_OPERATION": "system",
+  "TIMEOUT_ERROR": "system",
+  "NETWORK_ERROR": "system",
+  // Rate limiting
+  "TOO_MANY_REQUESTS": "rate_limit"
+};
+var DEFAULT_ERROR_MESSAGES = {
+  "INVALID_CREDENTIALS": "Invalid username or password",
+  "UNAUTHORIZED": "You are not authorized to perform this action",
+  "SESSION_EXPIRED": "Your session has expired. Please log in again.",
+  "USER_NOT_FOUND": "User not found",
+  "ITEM_NOT_FOUND": "Item not found",
+  "FIELD_ERROR": "Invalid field value",
+  "INTERNAL_SERVER_ERROR": "An internal error occurred",
+  "NETWORK_ERROR": "Network connection error",
+  "TIMEOUT_ERROR": "Request timeout",
+  "UNKNOWN_OPERATION": "Unknown operation",
+  "INVALID_EMAIL": "Invalid email format",
+  "INVALID_CODE": "Invalid code",
+  "TOO_MANY_REQUESTS": "Too many requests, please try again later"
+};
+function translateErrorCode(errorCode, config) {
+  const { translateFn, currentLanguage, enableDebug } = config;
+  if (enableDebug) {
+    console.log(`\u{1F50D} [ErrorTranslation] Translating error code: ${errorCode} (lang: ${currentLanguage || "unknown"})`);
+  }
+  const normalizedCode = errorCode.toUpperCase();
+  const category = ERROR_CATEGORY_MAP[normalizedCode];
+  const translationKeys = ERROR_TRANSLATION_HIERARCHY.map((pattern) => {
+    return pattern.replace("{category}", category || "general").replace("{code}", normalizedCode);
+  });
+  if (enableDebug) {
+    console.log(`\u{1F511} [ErrorTranslation] Searching keys:`, translationKeys);
+  }
+  for (const key of translationKeys) {
+    const translated = translateFn(key);
+    if (enableDebug) {
+      console.log(`\u{1F50D} [ErrorTranslation] Checking key: "${key}" -> result: "${translated}" (same as key: ${translated === key})`);
+    }
+    if (translated && translated !== key) {
+      if (enableDebug) {
+        console.log(`\u2705 [ErrorTranslation] Found translation at key: ${key} = "${translated}"`);
+      }
+      return translated;
+    }
+  }
+  const defaultMessage = DEFAULT_ERROR_MESSAGES[normalizedCode];
+  if (defaultMessage) {
+    if (enableDebug) {
+      console.log(`\u{1F504} [ErrorTranslation] Using default message: "${defaultMessage}"`);
+    }
+    return defaultMessage;
+  }
+  const friendlyCode = normalizedCode.replace(/_/g, " ").toLowerCase().replace(/\b\w/g, (l) => l.toUpperCase());
+  if (enableDebug) {
+    console.log(`\u26A0\uFE0F [ErrorTranslation] No translation found, using friendly code: "${friendlyCode}"`);
+  }
+  return friendlyCode;
+}
+function translateErrorCodes(errorCodes, config) {
+  return errorCodes.map((code) => translateErrorCode(code, config));
+}
+function translateError(error, config) {
+  const { enableDebug } = config;
+  if (enableDebug) {
+    console.log(`\u{1F50D} [ErrorTranslation] Translating error:`, error);
+  }
+  const translatedCode = translateErrorCode(error.code, config);
+  if (translatedCode !== error.code.toUpperCase() && translatedCode !== error.code) {
+    if (enableDebug) {
+      console.log(`\u2705 [ErrorTranslation] Using hierarchical translation: "${translatedCode}"`);
+    }
+    if (error.field) {
+      return `${error.field}: ${translatedCode}`;
+    }
+    return translatedCode;
+  }
+  if (error.message && !error.message.includes("Error:") && error.message.length > 0 && error.message !== error.code) {
+    if (enableDebug) {
+      console.log(`\u{1F504} [ErrorTranslation] No hierarchical translation found, using API message: "${error.message}"`);
+    }
+    return error.message;
+  }
+  if (enableDebug) {
+    console.log(`\u26A0\uFE0F [ErrorTranslation] Using final fallback: "${translatedCode}"`);
+  }
+  if (error.field) {
+    return `${error.field}: ${translatedCode}`;
+  }
+  return translatedCode;
+}
+function createErrorTranslator(translateFn, options = {}) {
+  const config = {
+    translateFn,
+    currentLanguage: options.currentLanguage,
+    enableDebug: options.enableDebug || false
+  };
+  return {
+    translateErrorCode: (code) => translateErrorCode(code, config),
+    translateErrorCodes: (codes) => translateErrorCodes(codes, config),
+    translateError: (error) => translateError(error, config),
+    // Método de conveniencia para errores de API
+    translateApiError: (apiResponse) => {
+      if (apiResponse?.data?.response?.status) {
+        return translateErrorCode(apiResponse.data.response.status, config);
+      }
+      if (apiResponse?.status) {
+        return translateErrorCode(apiResponse.status, config);
+      }
+      if (apiResponse?.code) {
+        return translateErrorCode(apiResponse.code, config);
+      }
+      return "Unknown error";
+    }
+  };
+}
+
 // src/core/SessionManager.ts
 var SessionManager = class _SessionManager {
   constructor() {
@@ -818,6 +974,7 @@ var SessionManager = class _SessionManager {
       if (!response.success) {
         this.log("Token refresh failed:", response.errors);
         TokenStorage.clearTokens();
+        this.config.showNotification?.(this.getSessionExpiredMessage(), "warning");
         this.config.onSessionExpired?.();
         return false;
       }
@@ -833,6 +990,7 @@ var SessionManager = class _SessionManager {
     } catch (error) {
       this.log("Token refresh error:", error);
       TokenStorage.clearTokens();
+      this.config.showNotification?.(this.getSessionExpiredMessage(), "warning");
       this.config.onSessionExpired?.();
       return false;
     }
@@ -852,6 +1010,7 @@ var SessionManager = class _SessionManager {
         if (authError.isRefreshTokenInvalid || authError.isTokenRefreshFailed) {
           this.log("Refresh token invalid or refresh already failed, clearing session");
           TokenStorage.clearTokens();
+          this.config.showNotification?.(this.getSessionExpiredMessage(), "warning");
           this.config.onSessionExpired?.();
           return response;
         }
@@ -865,6 +1024,7 @@ var SessionManager = class _SessionManager {
         } else {
           this.log("Auth error with no valid tokens or irrecoverable error, triggering session expired");
           TokenStorage.clearTokens();
+          this.config.showNotification?.(this.getSessionExpiredMessage(), "warning");
           this.config.onSessionExpired?.();
         }
       }
@@ -947,6 +1107,18 @@ var SessionManager = class _SessionManager {
     import_crudify_browser2.default.logout();
     this.log("Session cleared completely");
   }
+  /**
+   * Obtener mensaje de sesión expirada traducido
+   */
+  getSessionExpiredMessage() {
+    if (this.config.translateFn) {
+      return translateErrorCode("SESSION_EXPIRED", {
+        translateFn: this.config.translateFn,
+        enableDebug: this.config.enableLogging
+      });
+    }
+    return "Tu sesi\xF3n ha expirado. Por favor, inicia sesi\xF3n nuevamente.";
+  }
   // Métodos privados
   log(message, ...args) {
     if (this.config.enableLogging) {
@@ -980,6 +1152,8 @@ function useSession(options = {}) {
       const config = {
         autoRestore: options.autoRestore ?? true,
         enableLogging: options.enableLogging ?? false,
+        showNotification: options.showNotification,
+        translateFn: options.translateFn,
         onSessionExpired: () => {
           setState((prev) => ({
             ...prev,
@@ -1356,21 +1530,28 @@ var useGlobalNotification = () => {
 // src/providers/SessionProvider.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
 var SessionContext = (0, import_react7.createContext)(void 0);
-function SessionProvider({
+function InnerSessionProvider({
   children,
   options = {},
   config: propConfig,
   showNotifications = false,
-  // ✅ Por defecto DESACTIVADO
   notificationOptions = {}
 }) {
+  let showNotificationFn;
+  try {
+    const { showNotification } = useGlobalNotification();
+    showNotificationFn = showNotification;
+  } catch {
+  }
   const enhancedOptions = import_react7.default.useMemo(() => ({
     ...options,
+    showNotification: showNotificationFn,
+    // TODO: Agregar translateFn cuando esté disponible
     onSessionExpired: () => {
       console.log("\u{1F6A8} SessionProvider - Session expired callback triggered");
       options.onSessionExpired?.();
     }
-  }), [options]);
+  }), [options, showNotificationFn]);
   const sessionHook = useSession(enhancedOptions);
   const resolvedConfig = (0, import_react7.useMemo)(() => {
     let publicApiKey;
@@ -1469,7 +1650,16 @@ function SessionProvider({
     defaultAutoHideDuration: notificationOptions.defaultAutoHideDuration || 6e3,
     position: notificationOptions.position || { vertical: "top", horizontal: "right" }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(GlobalNotificationProvider, { ...notificationConfig, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SessionContext.Provider, { value: contextValue, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SessionContext.Provider, { value: contextValue, children });
+}
+function SessionProvider(props) {
+  const notificationConfig = {
+    enabled: props.showNotifications,
+    maxNotifications: props.notificationOptions?.maxNotifications || 5,
+    defaultAutoHideDuration: props.notificationOptions?.defaultAutoHideDuration || 6e3,
+    position: props.notificationOptions?.position || { vertical: "top", horizontal: "right" }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(GlobalNotificationProvider, { ...notificationConfig, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(InnerSessionProvider, { ...props }) });
 }
 function useSessionContext() {
   const context = (0, import_react7.useContext)(SessionContext);
@@ -1835,161 +2025,6 @@ function handleCrudifyError(error) {
   ];
 }
 
-// src/utils/errorTranslation.ts
-var ERROR_TRANSLATION_HIERARCHY = [
-  "errors.{category}.{code}",
-  // errors.auth.INVALID_CREDENTIALS
-  "errors.{code}",
-  // errors.INVALID_CREDENTIALS
-  "login.{code}",
-  // login.INVALID_CREDENTIALS (legacy)
-  "error.{code}",
-  // error.INVALID_CREDENTIALS (singular)
-  "messages.{code}",
-  // messages.INVALID_CREDENTIALS
-  "{code}"
-  // INVALID_CREDENTIALS (direct)
-];
-var ERROR_CATEGORY_MAP = {
-  // Authentication errors
-  "INVALID_CREDENTIALS": "auth",
-  "UNAUTHORIZED": "auth",
-  "INVALID_API_KEY": "auth",
-  "USER_NOT_FOUND": "auth",
-  "USER_NOT_ACTIVE": "auth",
-  "NO_PERMISSION": "auth",
-  "SESSION_EXPIRED": "auth",
-  // Data errors
-  "ITEM_NOT_FOUND": "data",
-  "NOT_FOUND": "data",
-  "IN_USE": "data",
-  "DUPLICATE_ENTRY": "data",
-  // Validation errors
-  "FIELD_ERROR": "validation",
-  "BAD_REQUEST": "validation",
-  "INVALID_EMAIL": "validation",
-  "INVALID_CODE": "validation",
-  "REQUIRED_FIELD": "validation",
-  // System errors
-  "INTERNAL_SERVER_ERROR": "system",
-  "DATABASE_CONNECTION_ERROR": "system",
-  "INVALID_CONFIGURATION": "system",
-  "UNKNOWN_OPERATION": "system",
-  "TIMEOUT_ERROR": "system",
-  "NETWORK_ERROR": "system",
-  // Rate limiting
-  "TOO_MANY_REQUESTS": "rate_limit"
-};
-var DEFAULT_ERROR_MESSAGES = {
-  "INVALID_CREDENTIALS": "Invalid username or password",
-  "UNAUTHORIZED": "You are not authorized to perform this action",
-  "USER_NOT_FOUND": "User not found",
-  "ITEM_NOT_FOUND": "Item not found",
-  "FIELD_ERROR": "Invalid field value",
-  "INTERNAL_SERVER_ERROR": "An internal error occurred",
-  "NETWORK_ERROR": "Network connection error",
-  "TIMEOUT_ERROR": "Request timeout",
-  "UNKNOWN_OPERATION": "Unknown operation",
-  "INVALID_EMAIL": "Invalid email format",
-  "INVALID_CODE": "Invalid code",
-  "TOO_MANY_REQUESTS": "Too many requests, please try again later"
-};
-function translateErrorCode(errorCode, config) {
-  const { translateFn, currentLanguage, enableDebug } = config;
-  if (enableDebug) {
-    console.log(`\u{1F50D} [ErrorTranslation] Translating error code: ${errorCode} (lang: ${currentLanguage || "unknown"})`);
-  }
-  const normalizedCode = errorCode.toUpperCase();
-  const category = ERROR_CATEGORY_MAP[normalizedCode];
-  const translationKeys = ERROR_TRANSLATION_HIERARCHY.map((pattern) => {
-    return pattern.replace("{category}", category || "general").replace("{code}", normalizedCode);
-  });
-  if (enableDebug) {
-    console.log(`\u{1F511} [ErrorTranslation] Searching keys:`, translationKeys);
-  }
-  for (const key of translationKeys) {
-    const translated = translateFn(key);
-    if (enableDebug) {
-      console.log(`\u{1F50D} [ErrorTranslation] Checking key: "${key}" -> result: "${translated}" (same as key: ${translated === key})`);
-    }
-    if (translated && translated !== key) {
-      if (enableDebug) {
-        console.log(`\u2705 [ErrorTranslation] Found translation at key: ${key} = "${translated}"`);
-      }
-      return translated;
-    }
-  }
-  const defaultMessage = DEFAULT_ERROR_MESSAGES[normalizedCode];
-  if (defaultMessage) {
-    if (enableDebug) {
-      console.log(`\u{1F504} [ErrorTranslation] Using default message: "${defaultMessage}"`);
-    }
-    return defaultMessage;
-  }
-  const friendlyCode = normalizedCode.replace(/_/g, " ").toLowerCase().replace(/\b\w/g, (l) => l.toUpperCase());
-  if (enableDebug) {
-    console.log(`\u26A0\uFE0F [ErrorTranslation] No translation found, using friendly code: "${friendlyCode}"`);
-  }
-  return friendlyCode;
-}
-function translateErrorCodes(errorCodes, config) {
-  return errorCodes.map((code) => translateErrorCode(code, config));
-}
-function translateError(error, config) {
-  const { enableDebug } = config;
-  if (enableDebug) {
-    console.log(`\u{1F50D} [ErrorTranslation] Translating error:`, error);
-  }
-  const translatedCode = translateErrorCode(error.code, config);
-  if (translatedCode !== error.code.toUpperCase() && translatedCode !== error.code) {
-    if (enableDebug) {
-      console.log(`\u2705 [ErrorTranslation] Using hierarchical translation: "${translatedCode}"`);
-    }
-    if (error.field) {
-      return `${error.field}: ${translatedCode}`;
-    }
-    return translatedCode;
-  }
-  if (error.message && !error.message.includes("Error:") && error.message.length > 0 && error.message !== error.code) {
-    if (enableDebug) {
-      console.log(`\u{1F504} [ErrorTranslation] No hierarchical translation found, using API message: "${error.message}"`);
-    }
-    return error.message;
-  }
-  if (enableDebug) {
-    console.log(`\u26A0\uFE0F [ErrorTranslation] Using final fallback: "${translatedCode}"`);
-  }
-  if (error.field) {
-    return `${error.field}: ${translatedCode}`;
-  }
-  return translatedCode;
-}
-function createErrorTranslator(translateFn, options = {}) {
-  const config = {
-    translateFn,
-    currentLanguage: options.currentLanguage,
-    enableDebug: options.enableDebug || false
-  };
-  return {
-    translateErrorCode: (code) => translateErrorCode(code, config),
-    translateErrorCodes: (codes) => translateErrorCodes(codes, config),
-    translateError: (error) => translateError(error, config),
-    // Método de conveniencia para errores de API
-    translateApiError: (apiResponse) => {
-      if (apiResponse?.data?.response?.status) {
-        return translateErrorCode(apiResponse.data.response.status, config);
-      }
-      if (apiResponse?.status) {
-        return translateErrorCode(apiResponse.status, config);
-      }
-      if (apiResponse?.code) {
-        return translateErrorCode(apiResponse.code, config);
-      }
-      return "Unknown error";
-    }
-  };
-}
-
 // src/components/CrudifyLogin/Forms/LoginForm.tsx
 var import_jsx_runtime6 = require("react/jsx-runtime");
 var LoginForm = ({ onScreenChange, onExternalNavigate, onLoginSuccess, onError, redirectUrl = "/" }) => {

package/dist/index.mjs

@@ -589,6 +589,162 @@ _TokenStorage.ENCRYPTION_KEY = "crudify_secure_key_v1";
 _TokenStorage.storageType = "localStorage";
 var TokenStorage = _TokenStorage;
 
+// src/utils/errorTranslation.ts
+var ERROR_TRANSLATION_HIERARCHY = [
+  "errors.{category}.{code}",
+  // errors.auth.INVALID_CREDENTIALS
+  "errors.{code}",
+  // errors.INVALID_CREDENTIALS
+  "login.{code}",
+  // login.INVALID_CREDENTIALS (legacy)
+  "error.{code}",
+  // error.INVALID_CREDENTIALS (singular)
+  "messages.{code}",
+  // messages.INVALID_CREDENTIALS
+  "{code}"
+  // INVALID_CREDENTIALS (direct)
+];
+var ERROR_CATEGORY_MAP = {
+  // Authentication errors
+  "INVALID_CREDENTIALS": "auth",
+  "UNAUTHORIZED": "auth",
+  "INVALID_API_KEY": "auth",
+  "USER_NOT_FOUND": "auth",
+  "USER_NOT_ACTIVE": "auth",
+  "NO_PERMISSION": "auth",
+  "SESSION_EXPIRED": "auth",
+  // Data errors
+  "ITEM_NOT_FOUND": "data",
+  "NOT_FOUND": "data",
+  "IN_USE": "data",
+  "DUPLICATE_ENTRY": "data",
+  // Validation errors
+  "FIELD_ERROR": "validation",
+  "BAD_REQUEST": "validation",
+  "INVALID_EMAIL": "validation",
+  "INVALID_CODE": "validation",
+  "REQUIRED_FIELD": "validation",
+  // System errors
+  "INTERNAL_SERVER_ERROR": "system",
+  "DATABASE_CONNECTION_ERROR": "system",
+  "INVALID_CONFIGURATION": "system",
+  "UNKNOWN_OPERATION": "system",
+  "TIMEOUT_ERROR": "system",
+  "NETWORK_ERROR": "system",
+  // Rate limiting
+  "TOO_MANY_REQUESTS": "rate_limit"
+};
+var DEFAULT_ERROR_MESSAGES = {
+  "INVALID_CREDENTIALS": "Invalid username or password",
+  "UNAUTHORIZED": "You are not authorized to perform this action",
+  "SESSION_EXPIRED": "Your session has expired. Please log in again.",
+  "USER_NOT_FOUND": "User not found",
+  "ITEM_NOT_FOUND": "Item not found",
+  "FIELD_ERROR": "Invalid field value",
+  "INTERNAL_SERVER_ERROR": "An internal error occurred",
+  "NETWORK_ERROR": "Network connection error",
+  "TIMEOUT_ERROR": "Request timeout",
+  "UNKNOWN_OPERATION": "Unknown operation",
+  "INVALID_EMAIL": "Invalid email format",
+  "INVALID_CODE": "Invalid code",
+  "TOO_MANY_REQUESTS": "Too many requests, please try again later"
+};
+function translateErrorCode(errorCode, config) {
+  const { translateFn, currentLanguage, enableDebug } = config;
+  if (enableDebug) {
+    console.log(`\u{1F50D} [ErrorTranslation] Translating error code: ${errorCode} (lang: ${currentLanguage || "unknown"})`);
+  }
+  const normalizedCode = errorCode.toUpperCase();
+  const category = ERROR_CATEGORY_MAP[normalizedCode];
+  const translationKeys = ERROR_TRANSLATION_HIERARCHY.map((pattern) => {
+    return pattern.replace("{category}", category || "general").replace("{code}", normalizedCode);
+  });
+  if (enableDebug) {
+    console.log(`\u{1F511} [ErrorTranslation] Searching keys:`, translationKeys);
+  }
+  for (const key of translationKeys) {
+    const translated = translateFn(key);
+    if (enableDebug) {
+      console.log(`\u{1F50D} [ErrorTranslation] Checking key: "${key}" -> result: "${translated}" (same as key: ${translated === key})`);
+    }
+    if (translated && translated !== key) {
+      if (enableDebug) {
+        console.log(`\u2705 [ErrorTranslation] Found translation at key: ${key} = "${translated}"`);
+      }
+      return translated;
+    }
+  }
+  const defaultMessage = DEFAULT_ERROR_MESSAGES[normalizedCode];
+  if (defaultMessage) {
+    if (enableDebug) {
+      console.log(`\u{1F504} [ErrorTranslation] Using default message: "${defaultMessage}"`);
+    }
+    return defaultMessage;
+  }
+  const friendlyCode = normalizedCode.replace(/_/g, " ").toLowerCase().replace(/\b\w/g, (l) => l.toUpperCase());
+  if (enableDebug) {
+    console.log(`\u26A0\uFE0F [ErrorTranslation] No translation found, using friendly code: "${friendlyCode}"`);
+  }
+  return friendlyCode;
+}
+function translateErrorCodes(errorCodes, config) {
+  return errorCodes.map((code) => translateErrorCode(code, config));
+}
+function translateError(error, config) {
+  const { enableDebug } = config;
+  if (enableDebug) {
+    console.log(`\u{1F50D} [ErrorTranslation] Translating error:`, error);
+  }
+  const translatedCode = translateErrorCode(error.code, config);
+  if (translatedCode !== error.code.toUpperCase() && translatedCode !== error.code) {
+    if (enableDebug) {
+      console.log(`\u2705 [ErrorTranslation] Using hierarchical translation: "${translatedCode}"`);
+    }
+    if (error.field) {
+      return `${error.field}: ${translatedCode}`;
+    }
+    return translatedCode;
+  }
+  if (error.message && !error.message.includes("Error:") && error.message.length > 0 && error.message !== error.code) {
+    if (enableDebug) {
+      console.log(`\u{1F504} [ErrorTranslation] No hierarchical translation found, using API message: "${error.message}"`);
+    }
+    return error.message;
+  }
+  if (enableDebug) {
+    console.log(`\u26A0\uFE0F [ErrorTranslation] Using final fallback: "${translatedCode}"`);
+  }
+  if (error.field) {
+    return `${error.field}: ${translatedCode}`;
+  }
+  return translatedCode;
+}
+function createErrorTranslator(translateFn, options = {}) {
+  const config = {
+    translateFn,
+    currentLanguage: options.currentLanguage,
+    enableDebug: options.enableDebug || false
+  };
+  return {
+    translateErrorCode: (code) => translateErrorCode(code, config),
+    translateErrorCodes: (codes) => translateErrorCodes(codes, config),
+    translateError: (error) => translateError(error, config),
+    // Método de conveniencia para errores de API
+    translateApiError: (apiResponse) => {
+      if (apiResponse?.data?.response?.status) {
+        return translateErrorCode(apiResponse.data.response.status, config);
+      }
+      if (apiResponse?.status) {
+        return translateErrorCode(apiResponse.status, config);
+      }
+      if (apiResponse?.code) {
+        return translateErrorCode(apiResponse.code, config);
+      }
+      return "Unknown error";
+    }
+  };
+}
+
 // src/core/SessionManager.ts
 var SessionManager = class _SessionManager {
   constructor() {
@@ -745,6 +901,7 @@ var SessionManager = class _SessionManager {
       if (!response.success) {
         this.log("Token refresh failed:", response.errors);
         TokenStorage.clearTokens();
+        this.config.showNotification?.(this.getSessionExpiredMessage(), "warning");
         this.config.onSessionExpired?.();
         return false;
       }
@@ -760,6 +917,7 @@ var SessionManager = class _SessionManager {
     } catch (error) {
       this.log("Token refresh error:", error);
       TokenStorage.clearTokens();
+      this.config.showNotification?.(this.getSessionExpiredMessage(), "warning");
       this.config.onSessionExpired?.();
       return false;
     }
@@ -779,6 +937,7 @@ var SessionManager = class _SessionManager {
         if (authError.isRefreshTokenInvalid || authError.isTokenRefreshFailed) {
           this.log("Refresh token invalid or refresh already failed, clearing session");
           TokenStorage.clearTokens();
+          this.config.showNotification?.(this.getSessionExpiredMessage(), "warning");
           this.config.onSessionExpired?.();
           return response;
         }
@@ -792,6 +951,7 @@ var SessionManager = class _SessionManager {
         } else {
           this.log("Auth error with no valid tokens or irrecoverable error, triggering session expired");
           TokenStorage.clearTokens();
+          this.config.showNotification?.(this.getSessionExpiredMessage(), "warning");
           this.config.onSessionExpired?.();
         }
       }
@@ -874,6 +1034,18 @@ var SessionManager = class _SessionManager {
     crudify2.logout();
     this.log("Session cleared completely");
   }
+  /**
+   * Obtener mensaje de sesión expirada traducido
+   */
+  getSessionExpiredMessage() {
+    if (this.config.translateFn) {
+      return translateErrorCode("SESSION_EXPIRED", {
+        translateFn: this.config.translateFn,
+        enableDebug: this.config.enableLogging
+      });
+    }
+    return "Tu sesi\xF3n ha expirado. Por favor, inicia sesi\xF3n nuevamente.";
+  }
   // Métodos privados
   log(message, ...args) {
     if (this.config.enableLogging) {
@@ -907,6 +1079,8 @@ function useSession(options = {}) {
       const config = {
         autoRestore: options.autoRestore ?? true,
         enableLogging: options.enableLogging ?? false,
+        showNotification: options.showNotification,
+        translateFn: options.translateFn,
         onSessionExpired: () => {
           setState((prev) => ({
             ...prev,
@@ -1283,21 +1457,28 @@ var useGlobalNotification = () => {
 // src/providers/SessionProvider.tsx
 import { Fragment, jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
 var SessionContext = createContext5(void 0);
-function SessionProvider({
+function InnerSessionProvider({
   children,
   options = {},
   config: propConfig,
   showNotifications = false,
-  // ✅ Por defecto DESACTIVADO
   notificationOptions = {}
 }) {
+  let showNotificationFn;
+  try {
+    const { showNotification } = useGlobalNotification();
+    showNotificationFn = showNotification;
+  } catch {
+  }
   const enhancedOptions = React5.useMemo(() => ({
     ...options,
+    showNotification: showNotificationFn,
+    // TODO: Agregar translateFn cuando esté disponible
     onSessionExpired: () => {
       console.log("\u{1F6A8} SessionProvider - Session expired callback triggered");
       options.onSessionExpired?.();
     }
-  }), [options]);
+  }), [options, showNotificationFn]);
   const sessionHook = useSession(enhancedOptions);
   const resolvedConfig = useMemo2(() => {
     let publicApiKey;
@@ -1396,7 +1577,16 @@ function SessionProvider({
     defaultAutoHideDuration: notificationOptions.defaultAutoHideDuration || 6e3,
     position: notificationOptions.position || { vertical: "top", horizontal: "right" }
   };
-  return /* @__PURE__ */ jsx5(GlobalNotificationProvider, { ...notificationConfig, children: /* @__PURE__ */ jsx5(SessionContext.Provider, { value: contextValue, children }) });
+  return /* @__PURE__ */ jsx5(SessionContext.Provider, { value: contextValue, children });
+}
+function SessionProvider(props) {
+  const notificationConfig = {
+    enabled: props.showNotifications,
+    maxNotifications: props.notificationOptions?.maxNotifications || 5,
+    defaultAutoHideDuration: props.notificationOptions?.defaultAutoHideDuration || 6e3,
+    position: props.notificationOptions?.position || { vertical: "top", horizontal: "right" }
+  };
+  return /* @__PURE__ */ jsx5(GlobalNotificationProvider, { ...notificationConfig, children: /* @__PURE__ */ jsx5(InnerSessionProvider, { ...props }) });
 }
 function useSessionContext() {
   const context = useContext5(SessionContext);
@@ -1762,161 +1952,6 @@ function handleCrudifyError(error) {
   ];
 }
 
-// src/utils/errorTranslation.ts
-var ERROR_TRANSLATION_HIERARCHY = [
-  "errors.{category}.{code}",
-  // errors.auth.INVALID_CREDENTIALS
-  "errors.{code}",
-  // errors.INVALID_CREDENTIALS
-  "login.{code}",
-  // login.INVALID_CREDENTIALS (legacy)
-  "error.{code}",
-  // error.INVALID_CREDENTIALS (singular)
-  "messages.{code}",
-  // messages.INVALID_CREDENTIALS
-  "{code}"
-  // INVALID_CREDENTIALS (direct)
-];
-var ERROR_CATEGORY_MAP = {
-  // Authentication errors
-  "INVALID_CREDENTIALS": "auth",
-  "UNAUTHORIZED": "auth",
-  "INVALID_API_KEY": "auth",
-  "USER_NOT_FOUND": "auth",
-  "USER_NOT_ACTIVE": "auth",
-  "NO_PERMISSION": "auth",
-  "SESSION_EXPIRED": "auth",
-  // Data errors
-  "ITEM_NOT_FOUND": "data",
-  "NOT_FOUND": "data",
-  "IN_USE": "data",
-  "DUPLICATE_ENTRY": "data",
-  // Validation errors
-  "FIELD_ERROR": "validation",
-  "BAD_REQUEST": "validation",
-  "INVALID_EMAIL": "validation",
-  "INVALID_CODE": "validation",
-  "REQUIRED_FIELD": "validation",
-  // System errors
-  "INTERNAL_SERVER_ERROR": "system",
-  "DATABASE_CONNECTION_ERROR": "system",
-  "INVALID_CONFIGURATION": "system",
-  "UNKNOWN_OPERATION": "system",
-  "TIMEOUT_ERROR": "system",
-  "NETWORK_ERROR": "system",
-  // Rate limiting
-  "TOO_MANY_REQUESTS": "rate_limit"
-};
-var DEFAULT_ERROR_MESSAGES = {
-  "INVALID_CREDENTIALS": "Invalid username or password",
-  "UNAUTHORIZED": "You are not authorized to perform this action",
-  "USER_NOT_FOUND": "User not found",
-  "ITEM_NOT_FOUND": "Item not found",
-  "FIELD_ERROR": "Invalid field value",
-  "INTERNAL_SERVER_ERROR": "An internal error occurred",
-  "NETWORK_ERROR": "Network connection error",
-  "TIMEOUT_ERROR": "Request timeout",
-  "UNKNOWN_OPERATION": "Unknown operation",
-  "INVALID_EMAIL": "Invalid email format",
-  "INVALID_CODE": "Invalid code",
-  "TOO_MANY_REQUESTS": "Too many requests, please try again later"
-};
-function translateErrorCode(errorCode, config) {
-  const { translateFn, currentLanguage, enableDebug } = config;
-  if (enableDebug) {
-    console.log(`\u{1F50D} [ErrorTranslation] Translating error code: ${errorCode} (lang: ${currentLanguage || "unknown"})`);
-  }
-  const normalizedCode = errorCode.toUpperCase();
-  const category = ERROR_CATEGORY_MAP[normalizedCode];
-  const translationKeys = ERROR_TRANSLATION_HIERARCHY.map((pattern) => {
-    return pattern.replace("{category}", category || "general").replace("{code}", normalizedCode);
-  });
-  if (enableDebug) {
-    console.log(`\u{1F511} [ErrorTranslation] Searching keys:`, translationKeys);
-  }
-  for (const key of translationKeys) {
-    const translated = translateFn(key);
-    if (enableDebug) {
-      console.log(`\u{1F50D} [ErrorTranslation] Checking key: "${key}" -> result: "${translated}" (same as key: ${translated === key})`);
-    }
-    if (translated && translated !== key) {
-      if (enableDebug) {
-        console.log(`\u2705 [ErrorTranslation] Found translation at key: ${key} = "${translated}"`);
-      }
-      return translated;
-    }
-  }
-  const defaultMessage = DEFAULT_ERROR_MESSAGES[normalizedCode];
-  if (defaultMessage) {
-    if (enableDebug) {
-      console.log(`\u{1F504} [ErrorTranslation] Using default message: "${defaultMessage}"`);
-    }
-    return defaultMessage;
-  }
-  const friendlyCode = normalizedCode.replace(/_/g, " ").toLowerCase().replace(/\b\w/g, (l) => l.toUpperCase());
-  if (enableDebug) {
-    console.log(`\u26A0\uFE0F [ErrorTranslation] No translation found, using friendly code: "${friendlyCode}"`);
-  }
-  return friendlyCode;
-}
-function translateErrorCodes(errorCodes, config) {
-  return errorCodes.map((code) => translateErrorCode(code, config));
-}
-function translateError(error, config) {
-  const { enableDebug } = config;
-  if (enableDebug) {
-    console.log(`\u{1F50D} [ErrorTranslation] Translating error:`, error);
-  }
-  const translatedCode = translateErrorCode(error.code, config);
-  if (translatedCode !== error.code.toUpperCase() && translatedCode !== error.code) {
-    if (enableDebug) {
-      console.log(`\u2705 [ErrorTranslation] Using hierarchical translation: "${translatedCode}"`);
-    }
-    if (error.field) {
-      return `${error.field}: ${translatedCode}`;
-    }
-    return translatedCode;
-  }
-  if (error.message && !error.message.includes("Error:") && error.message.length > 0 && error.message !== error.code) {
-    if (enableDebug) {
-      console.log(`\u{1F504} [ErrorTranslation] No hierarchical translation found, using API message: "${error.message}"`);
-    }
-    return error.message;
-  }
-  if (enableDebug) {
-    console.log(`\u26A0\uFE0F [ErrorTranslation] Using final fallback: "${translatedCode}"`);
-  }
-  if (error.field) {
-    return `${error.field}: ${translatedCode}`;
-  }
-  return translatedCode;
-}
-function createErrorTranslator(translateFn, options = {}) {
-  const config = {
-    translateFn,
-    currentLanguage: options.currentLanguage,
-    enableDebug: options.enableDebug || false
-  };
-  return {
-    translateErrorCode: (code) => translateErrorCode(code, config),
-    translateErrorCodes: (codes) => translateErrorCodes(codes, config),
-    translateError: (error) => translateError(error, config),
-    // Método de conveniencia para errores de API
-    translateApiError: (apiResponse) => {
-      if (apiResponse?.data?.response?.status) {
-        return translateErrorCode(apiResponse.data.response.status, config);
-      }
-      if (apiResponse?.status) {
-        return translateErrorCode(apiResponse.status, config);
-      }
-      if (apiResponse?.code) {
-        return translateErrorCode(apiResponse.code, config);
-      }
-      return "Unknown error";
-    }
-  };
-}
-
 // src/components/CrudifyLogin/Forms/LoginForm.tsx
 import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
 var LoginForm = ({ onScreenChange, onExternalNavigate, onLoginSuccess, onError, redirectUrl = "/" }) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocios/crudify-ui",
-  "version": "3.0.48",
+  "version": "3.0.52",
   "description": "Biblioteca de componentes UI para Crudify",
   "author": "Nocios",
   "license": "MIT",
@@ -25,7 +25,7 @@
     "@mui/icons-material": "^7.1.0",
     "@mui/material": "^7.1.0",
     "@mui/x-data-grid": "^8.5.1",
-    "@nocios/crudify-browser": "^2.0.4",
+    "@nocios/crudify-browser": "^2.0.5",
     "@types/uuid": "^10.0.0",
     "crypto-js": "^4.2.0",
     "i18next-browser-languagedetector": "^8.1.0",