@nocios/crudify-ui 1.0.46 → 1.0.48

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -3,17 +3,95 @@ import { default as default2 } from "@nocios/crudify-browser";
3
3
  export * from "@nocios/crudify-browser";
4
4
 
5
5
  // src/components/CrudifyLogin/index.tsx
6
- import { useState as useState5, useMemo as useMemo2 } from "react";
7
- import { useTranslation as useTranslation5 } from "react-i18next";
6
+ import { useState as useState5, useMemo as useMemo3 } from "react";
8
7
  import { Paper, Box as Box5, Typography as Typography5 } from "@mui/material";
9
8
 
9
+ // src/components/CrudifyLogin/context/I18nProvider.tsx
10
+ import { createContext, useContext, useMemo } from "react";
11
+ import { jsx } from "react/jsx-runtime";
12
+ var I18nContext = createContext(null);
13
+ var defaultTranslations = {
14
+ "login.logoAlt": "Logo",
15
+ "login.usernameOrEmailLabel": "Username or Email",
16
+ "login.usernameOrEmailPlaceholder": "Enter your username or email",
17
+ "login.passwordLabel": "Password",
18
+ "login.passwordPlaceholder": "Enter your password",
19
+ "login.forgotPasswordLink": "Forgot your password?",
20
+ "login.loginButton": "Login",
21
+ "login.noAccountPrompt": "Don't have an account?",
22
+ "login.signUpLink": "Sign up",
23
+ "login.usernameRequired": "Username or email is required",
24
+ "login.passwordRequired": "Password is required",
25
+ "forgotPassword.title": "Reset Password",
26
+ "forgotPassword.description": "Enter your email and we'll send you a code to reset your password.",
27
+ "forgotPassword.emailLabel": "Email",
28
+ "forgotPassword.emailPlaceholder": "Enter your email",
29
+ "forgotPassword.emailRequired": "Email is required",
30
+ "forgotPassword.invalidEmail": "Enter a valid email",
31
+ "forgotPassword.sendButton": "Send Code",
32
+ "resetPassword.title": "New Password",
33
+ "resetPassword.description": "Enter your new password.",
34
+ "resetPassword.newPasswordLabel": "New Password",
35
+ "resetPassword.newPasswordPlaceholder": "Enter your new password",
36
+ "resetPassword.confirmPasswordLabel": "Confirm Password",
37
+ "resetPassword.confirmPasswordPlaceholder": "Confirm your new password",
38
+ "resetPassword.passwordRequired": "Password is required",
39
+ "resetPassword.confirmPasswordRequired": "Confirm your password",
40
+ "resetPassword.passwordsNotMatch": "Passwords don't match",
41
+ "resetPassword.resetButton": "Reset Password",
42
+ "checkCode.title": "Verify Code",
43
+ "checkCode.description": "Enter the 6-digit code we sent to your email.",
44
+ "checkCode.codeLabel": "Verification Code",
45
+ "checkCode.codePlaceholder": "Enter the 6-digit code",
46
+ "checkCode.codeRequired": "Code is required",
47
+ "checkCode.invalidCode": "Code must be 6 digits",
48
+ "checkCode.verifyButton": "Verify Code",
49
+ "error.unknown": "An unknown error occurred"
50
+ };
51
+ var getNestedValue = (obj, path) => {
52
+ return path.split(".").reduce((current, key) => {
53
+ return current && typeof current === "object" ? current[key] : void 0;
54
+ }, obj);
55
+ };
56
+ var I18nProvider = ({ children, translations = {}, language = "en" }) => {
57
+ console.log("I18nProvider received translations:", translations);
58
+ console.log("I18nProvider language:", language);
59
+ const t = useMemo(() => {
60
+ return (key, variables) => {
61
+ const mergedTranslations = { ...defaultTranslations, ...translations };
62
+ let value = getNestedValue(mergedTranslations, key) || key;
63
+ console.log(`Translation for "${key}":`, value);
64
+ if (variables && typeof value === "string") {
65
+ Object.entries(variables).forEach(([varKey, varValue]) => {
66
+ value = value.replace(new RegExp(`{{${varKey}}}`, "g"), varValue);
67
+ });
68
+ }
69
+ return typeof value === "string" ? value : key;
70
+ };
71
+ }, [translations]);
72
+ const contextValue = useMemo(
73
+ () => ({
74
+ t,
75
+ language
76
+ }),
77
+ [t, language]
78
+ );
79
+ return /* @__PURE__ */ jsx(I18nContext.Provider, { value: contextValue, children });
80
+ };
81
+ var useTranslation = () => {
82
+ const context = useContext(I18nContext);
83
+ if (!context) {
84
+ throw new Error("useTranslation must be used within I18nProvider");
85
+ }
86
+ return context;
87
+ };
88
+
10
89
  // src/components/CrudifyLogin/Forms/LoginForm.tsx
11
- import { useTranslation } from "react-i18next";
12
90
  import { useState, useEffect as useEffect2, useRef } from "react";
13
91
  import { Typography, TextField, Button, Box, CircularProgress, Alert, Link } from "@mui/material";
14
92
 
15
93
  // src/components/CrudifyLogin/hooks/useCrudifyLogin.ts
16
- import { useMemo, useEffect } from "react";
94
+ import { useMemo as useMemo2, useEffect } from "react";
17
95
  import crudify from "@nocios/crudify-browser";
18
96
 
19
97
  // src/components/CrudifyLogin/utils/cookies.ts
@@ -24,7 +102,7 @@ var getCookie = (name) => {
24
102
 
25
103
  // src/components/CrudifyLogin/hooks/useCrudifyLogin.ts
26
104
  var useCrudifyLogin = (config, _options = {}) => {
27
- const finalConfig = useMemo(() => {
105
+ const finalConfig = useMemo2(() => {
28
106
  const publicApiKey = config.publicApiKey || getCookie("publicApiKey") || null;
29
107
  const rawEnv = config.env || getCookie("environment") || "prod";
30
108
  const env = ["dev", "stg", "prod"].includes(rawEnv) ? rawEnv : "prod";
@@ -53,7 +131,7 @@ var useCrudifyLogin = (config, _options = {}) => {
53
131
  console.error("Error initializing crudify:", error);
54
132
  }
55
133
  }, [finalConfig.publicApiKey, finalConfig.env]);
56
- const crudifyMethods = useMemo(() => {
134
+ const crudifyMethods = useMemo2(() => {
57
135
  if (!finalConfig.publicApiKey) {
58
136
  return null;
59
137
  }
@@ -175,7 +253,7 @@ var secureSessionStorage = new SecureStorage("sessionStorage");
175
253
  var secureLocalStorage = new SecureStorage("localStorage");
176
254
 
177
255
  // src/components/CrudifyLogin/Forms/LoginForm.tsx
178
- import { Fragment, jsx, jsxs } from "react/jsx-runtime";
256
+ import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
179
257
  var LoginForm = ({ config, onNavigate, onLoginSuccess, onError, redirectUrl = "/" }) => {
180
258
  const [username, setUsername] = useState("");
181
259
  const [password, setPassword] = useState("");
@@ -312,7 +390,7 @@ var LoginForm = ({ config, onNavigate, onLoginSuccess, onError, redirectUrl = "/
312
390
  sx: { width: "100%", display: "flex", flexDirection: "column", gap: 2 },
313
391
  children: [
314
392
  /* @__PURE__ */ jsxs(Box, { sx: { mb: 1 }, children: [
315
- /* @__PURE__ */ jsx(
393
+ /* @__PURE__ */ jsx2(
316
394
  Typography,
317
395
  {
318
396
  variant: "body2",
@@ -322,7 +400,7 @@ var LoginForm = ({ config, onNavigate, onLoginSuccess, onError, redirectUrl = "/
322
400
  children: t("login.usernameOrEmailLabel")
323
401
  }
324
402
  ),
325
- /* @__PURE__ */ jsx(
403
+ /* @__PURE__ */ jsx2(
326
404
  TextField,
327
405
  {
328
406
  fullWidth: true,
@@ -342,7 +420,7 @@ var LoginForm = ({ config, onNavigate, onLoginSuccess, onError, redirectUrl = "/
342
420
  )
343
421
  ] }),
344
422
  /* @__PURE__ */ jsxs(Box, { sx: { mb: 1 }, children: [
345
- /* @__PURE__ */ jsx(
423
+ /* @__PURE__ */ jsx2(
346
424
  Typography,
347
425
  {
348
426
  variant: "body2",
@@ -352,7 +430,7 @@ var LoginForm = ({ config, onNavigate, onLoginSuccess, onError, redirectUrl = "/
352
430
  children: t("login.passwordLabel")
353
431
  }
354
432
  ),
355
- /* @__PURE__ */ jsx(
433
+ /* @__PURE__ */ jsx2(
356
434
  TextField,
357
435
  {
358
436
  fullWidth: true,
@@ -370,26 +448,25 @@ var LoginForm = ({ config, onNavigate, onLoginSuccess, onError, redirectUrl = "/
370
448
  }
371
449
  )
372
450
  ] }),
373
- config.loginActions?.includes("forgotPassword") && /* @__PURE__ */ jsx(Box, { sx: { display: "flex", justifyContent: "flex-end", alignItems: "center" }, children: /* @__PURE__ */ jsx(Link, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login/forgotPassword"), variant: "body2", color: "secondary", children: t("login.forgotPasswordLink") }) }),
374
- /* @__PURE__ */ jsx(Button, { disabled: loading, type: "submit", fullWidth: true, variant: "contained", color: "primary", sx: { mt: 1, mb: 2 }, children: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 20 }) : t("login.loginButton") })
451
+ config.loginActions?.includes("forgotPassword") && /* @__PURE__ */ jsx2(Box, { sx: { display: "flex", justifyContent: "flex-end", alignItems: "center" }, children: /* @__PURE__ */ jsx2(Link, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login/forgotPassword"), variant: "body2", color: "secondary", children: t("login.forgotPasswordLink") }) }),
452
+ /* @__PURE__ */ jsx2(Button, { disabled: loading, type: "submit", fullWidth: true, variant: "contained", color: "primary", sx: { mt: 1, mb: 2 }, children: loading ? /* @__PURE__ */ jsx2(CircularProgress, { size: 20 }) : t("login.loginButton") })
375
453
  ]
376
454
  }
377
455
  ),
378
- /* @__PURE__ */ jsx(Box, { children: errors.length > 0 && errors.map((error, index) => /* @__PURE__ */ jsx(Alert, { variant: "filled", sx: { mt: 2 }, severity: "error", children: /* @__PURE__ */ jsx("div", { children: error }) }, index)) }),
456
+ /* @__PURE__ */ jsx2(Box, { children: errors.length > 0 && errors.map((error, index) => /* @__PURE__ */ jsx2(Alert, { variant: "filled", sx: { mt: 2 }, severity: "error", children: /* @__PURE__ */ jsx2("div", { children: error }) }, index)) }),
379
457
  config.loginActions?.includes("createUser") && /* @__PURE__ */ jsxs(Typography, { variant: "body2", align: "center", sx: { color: "text.secondary", mt: 3 }, children: [
380
458
  t("login.noAccountPrompt"),
381
459
  " ",
382
- /* @__PURE__ */ jsx(Link, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/public/users/create"), fontWeight: "medium", color: "secondary", children: t("login.signUpLink") })
460
+ /* @__PURE__ */ jsx2(Link, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/public/users/create"), fontWeight: "medium", color: "secondary", children: t("login.signUpLink") })
383
461
  ] })
384
462
  ] });
385
463
  };
386
464
  var LoginForm_default = LoginForm;
387
465
 
388
466
  // src/components/CrudifyLogin/Forms/ForgotPasswordForm.tsx
389
- import { useTranslation as useTranslation2 } from "react-i18next";
390
467
  import { useState as useState2 } from "react";
391
468
  import { Typography as Typography2, TextField as TextField2, Button as Button2, Box as Box2, CircularProgress as CircularProgress2, Alert as Alert2, Link as Link2 } from "@mui/material";
392
- import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
469
+ import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
393
470
  var ForgotPasswordForm = ({ config, onNavigate, onError }) => {
394
471
  const [email, setEmail] = useState2("");
395
472
  const [loading, setLoading] = useState2(false);
@@ -397,7 +474,7 @@ var ForgotPasswordForm = ({ config, onNavigate, onError }) => {
397
474
  const [helperTextEmail, setHelperTextEmail] = useState2(null);
398
475
  const [emailSent, setEmailSent] = useState2(false);
399
476
  const [codeAlreadyExists, setCodeAlreadyExists] = useState2(false);
400
- const { t } = useTranslation2();
477
+ const { t } = useTranslation();
401
478
  const { crudify: crudify3 } = useCrudifyLogin(config);
402
479
  const validateEmail = (email2) => {
403
480
  const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
@@ -454,25 +531,25 @@ var ForgotPasswordForm = ({ config, onNavigate, onError }) => {
454
531
  };
455
532
  if (emailSent) {
456
533
  return /* @__PURE__ */ jsxs2(Box2, { sx: { textAlign: "center" }, children: [
457
- /* @__PURE__ */ jsx2(Alert2, { severity: "success", sx: { mb: 3 }, children: t("forgotPassword.emailSentMessage") }),
458
- /* @__PURE__ */ jsx2(Typography2, { variant: "body2", sx: { mb: 2 }, children: t("forgotPassword.checkEmailInstructions") }),
459
- /* @__PURE__ */ jsx2(Link2, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login/checkCode"), variant: "body2", color: "primary", children: t("forgotPassword.enterCodeLink") }),
460
- /* @__PURE__ */ jsx2(Box2, { sx: { mt: 2 }, children: /* @__PURE__ */ jsx2(Link2, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") }) })
534
+ /* @__PURE__ */ jsx3(Alert2, { severity: "success", sx: { mb: 3 }, children: t("forgotPassword.emailSentMessage") }),
535
+ /* @__PURE__ */ jsx3(Typography2, { variant: "body2", sx: { mb: 2 }, children: t("forgotPassword.checkEmailInstructions") }),
536
+ /* @__PURE__ */ jsx3(Link2, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login/checkCode"), variant: "body2", color: "primary", children: t("forgotPassword.enterCodeLink") }),
537
+ /* @__PURE__ */ jsx3(Box2, { sx: { mt: 2 }, children: /* @__PURE__ */ jsx3(Link2, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") }) })
461
538
  ] });
462
539
  }
463
540
  if (codeAlreadyExists) {
464
541
  return /* @__PURE__ */ jsxs2(Box2, { sx: { textAlign: "center" }, children: [
465
- /* @__PURE__ */ jsx2(Alert2, { severity: "info", sx: { mb: 3 }, children: t("forgotPassword.codeAlreadyExistsMessage") }),
466
- /* @__PURE__ */ jsx2(Link2, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login/checkCode"), variant: "body2", color: "primary", children: t("forgotPassword.enterCodeLink") }),
467
- /* @__PURE__ */ jsx2(Box2, { sx: { mt: 2 }, children: /* @__PURE__ */ jsx2(Link2, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") }) })
542
+ /* @__PURE__ */ jsx3(Alert2, { severity: "info", sx: { mb: 3 }, children: t("forgotPassword.codeAlreadyExistsMessage") }),
543
+ /* @__PURE__ */ jsx3(Link2, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login/checkCode"), variant: "body2", color: "primary", children: t("forgotPassword.enterCodeLink") }),
544
+ /* @__PURE__ */ jsx3(Box2, { sx: { mt: 2 }, children: /* @__PURE__ */ jsx3(Link2, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") }) })
468
545
  ] });
469
546
  }
470
547
  return /* @__PURE__ */ jsxs2(Fragment2, { children: [
471
- /* @__PURE__ */ jsx2(Typography2, { variant: "h5", component: "h1", sx: { mb: 3, textAlign: "center" }, children: t("forgotPassword.title") }),
472
- /* @__PURE__ */ jsx2(Typography2, { variant: "body2", sx: { mb: 3, textAlign: "center", color: "text.secondary" }, children: t("forgotPassword.instructions") }),
548
+ /* @__PURE__ */ jsx3(Typography2, { variant: "h5", component: "h1", sx: { mb: 3, textAlign: "center" }, children: t("forgotPassword.title") }),
549
+ /* @__PURE__ */ jsx3(Typography2, { variant: "body2", sx: { mb: 3, textAlign: "center", color: "text.secondary" }, children: t("forgotPassword.instructions") }),
473
550
  /* @__PURE__ */ jsxs2(Box2, { component: "form", noValidate: true, onSubmit: handleFormSubmit, children: [
474
551
  /* @__PURE__ */ jsxs2(Box2, { sx: { mb: 2 }, children: [
475
- /* @__PURE__ */ jsx2(
552
+ /* @__PURE__ */ jsx3(
476
553
  Typography2,
477
554
  {
478
555
  variant: "body2",
@@ -482,7 +559,7 @@ var ForgotPasswordForm = ({ config, onNavigate, onError }) => {
482
559
  children: t("forgotPassword.emailLabel")
483
560
  }
484
561
  ),
485
- /* @__PURE__ */ jsx2(
562
+ /* @__PURE__ */ jsx3(
486
563
  TextField2,
487
564
  {
488
565
  fullWidth: true,
@@ -500,19 +577,18 @@ var ForgotPasswordForm = ({ config, onNavigate, onError }) => {
500
577
  }
501
578
  )
502
579
  ] }),
503
- /* @__PURE__ */ jsx2(Button2, { disabled: loading, type: "submit", fullWidth: true, variant: "contained", color: "primary", sx: { mt: 2, mb: 2 }, children: loading ? /* @__PURE__ */ jsx2(CircularProgress2, { size: 20 }) : t("forgotPassword.sendCodeButton") }),
504
- /* @__PURE__ */ jsx2(Box2, { sx: { textAlign: "center" }, children: /* @__PURE__ */ jsx2(Link2, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") }) })
580
+ /* @__PURE__ */ jsx3(Button2, { disabled: loading, type: "submit", fullWidth: true, variant: "contained", color: "primary", sx: { mt: 2, mb: 2 }, children: loading ? /* @__PURE__ */ jsx3(CircularProgress2, { size: 20 }) : t("forgotPassword.sendCodeButton") }),
581
+ /* @__PURE__ */ jsx3(Box2, { sx: { textAlign: "center" }, children: /* @__PURE__ */ jsx3(Link2, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") }) })
505
582
  ] }),
506
- errors.length > 0 && /* @__PURE__ */ jsx2(Box2, { sx: { mt: 2 }, children: errors.map((error, index) => /* @__PURE__ */ jsx2(Alert2, { variant: "filled", severity: "error", children: error }, index)) })
583
+ errors.length > 0 && /* @__PURE__ */ jsx3(Box2, { sx: { mt: 2 }, children: errors.map((error, index) => /* @__PURE__ */ jsx3(Alert2, { variant: "filled", severity: "error", children: error }, index)) })
507
584
  ] });
508
585
  };
509
586
  var ForgotPasswordForm_default = ForgotPasswordForm;
510
587
 
511
588
  // src/components/CrudifyLogin/Forms/ResetPasswordForm.tsx
512
- import { useTranslation as useTranslation3 } from "react-i18next";
513
589
  import { useState as useState3, useEffect as useEffect3 } from "react";
514
590
  import { Typography as Typography3, TextField as TextField3, Button as Button3, Box as Box3, CircularProgress as CircularProgress3, Alert as Alert3, Link as Link3 } from "@mui/material";
515
- import { Fragment as Fragment3, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
591
+ import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
516
592
  var ResetPasswordForm = ({ config, onNavigate, onError, searchParams }) => {
517
593
  const [newPassword, setNewPassword] = useState3("");
518
594
  const [confirmPassword, setConfirmPassword] = useState3("");
@@ -525,7 +601,7 @@ var ResetPasswordForm = ({ config, onNavigate, onError, searchParams }) => {
525
601
  const [validatingCode, setValidatingCode] = useState3(true);
526
602
  const [codeValidated, setCodeValidated] = useState3(false);
527
603
  const [resetSuccess, setResetSuccess] = useState3(false);
528
- const { t } = useTranslation3();
604
+ const { t } = useTranslation();
529
605
  const { crudify: crudify3 } = useCrudifyLogin(config);
530
606
  useEffect3(() => {
531
607
  const validateCode = async (emailToValidate, codeToValidate) => {
@@ -640,32 +716,32 @@ var ResetPasswordForm = ({ config, onNavigate, onError, searchParams }) => {
640
716
  };
641
717
  if (validatingCode) {
642
718
  return /* @__PURE__ */ jsxs3(Box3, { sx: { textAlign: "center", py: 4 }, children: [
643
- /* @__PURE__ */ jsx3(CircularProgress3, { size: 40 }),
644
- /* @__PURE__ */ jsx3(Typography3, { variant: "body2", sx: { mt: 2 }, children: t("resetPassword.validatingCode") })
719
+ /* @__PURE__ */ jsx4(CircularProgress3, { size: 40 }),
720
+ /* @__PURE__ */ jsx4(Typography3, { variant: "body2", sx: { mt: 2 }, children: t("resetPassword.validatingCode") })
645
721
  ] });
646
722
  }
647
723
  if (resetSuccess) {
648
724
  return /* @__PURE__ */ jsxs3(Box3, { sx: { textAlign: "center" }, children: [
649
- /* @__PURE__ */ jsx3(Alert3, { severity: "success", sx: { mb: 3 }, children: t("resetPassword.successMessage") }),
650
- /* @__PURE__ */ jsx3(Typography3, { variant: "body2", sx: { mb: 3 }, children: t("resetPassword.successInstructions") }),
651
- /* @__PURE__ */ jsx3(Button3, { variant: "contained", color: "primary", onClick: () => onNavigate?.("/login"), fullWidth: true, children: t("resetPassword.goToLoginButton") })
725
+ /* @__PURE__ */ jsx4(Alert3, { severity: "success", sx: { mb: 3 }, children: t("resetPassword.successMessage") }),
726
+ /* @__PURE__ */ jsx4(Typography3, { variant: "body2", sx: { mb: 3 }, children: t("resetPassword.successInstructions") }),
727
+ /* @__PURE__ */ jsx4(Button3, { variant: "contained", color: "primary", onClick: () => onNavigate?.("/login"), fullWidth: true, children: t("resetPassword.goToLoginButton") })
652
728
  ] });
653
729
  }
654
730
  if (!codeValidated) {
655
731
  return /* @__PURE__ */ jsxs3(Box3, { sx: { textAlign: "center" }, children: [
656
- /* @__PURE__ */ jsx3(Alert3, { severity: "error", sx: { mb: 3 }, children: t("resetPassword.codeExpiredOrInvalid") }),
732
+ /* @__PURE__ */ jsx4(Alert3, { severity: "error", sx: { mb: 3 }, children: t("resetPassword.codeExpiredOrInvalid") }),
657
733
  /* @__PURE__ */ jsxs3(Box3, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: [
658
- /* @__PURE__ */ jsx3(Button3, { variant: "contained", color: "primary", onClick: () => onNavigate?.("/login/forgotPassword"), fullWidth: true, children: t("resetPassword.requestNewCodeButton") }),
659
- /* @__PURE__ */ jsx3(Link3, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") })
734
+ /* @__PURE__ */ jsx4(Button3, { variant: "contained", color: "primary", onClick: () => onNavigate?.("/login/forgotPassword"), fullWidth: true, children: t("resetPassword.requestNewCodeButton") }),
735
+ /* @__PURE__ */ jsx4(Link3, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") })
660
736
  ] })
661
737
  ] });
662
738
  }
663
739
  return /* @__PURE__ */ jsxs3(Fragment3, { children: [
664
- /* @__PURE__ */ jsx3(Typography3, { variant: "h5", component: "h1", sx: { mb: 3, textAlign: "center" }, children: t("resetPassword.title") }),
665
- /* @__PURE__ */ jsx3(Typography3, { variant: "body2", sx: { mb: 3, textAlign: "center", color: "text.secondary" }, children: t("resetPassword.instructions") }),
740
+ /* @__PURE__ */ jsx4(Typography3, { variant: "h5", component: "h1", sx: { mb: 3, textAlign: "center" }, children: t("resetPassword.title") }),
741
+ /* @__PURE__ */ jsx4(Typography3, { variant: "body2", sx: { mb: 3, textAlign: "center", color: "text.secondary" }, children: t("resetPassword.instructions") }),
666
742
  /* @__PURE__ */ jsxs3(Box3, { component: "form", noValidate: true, onSubmit: handleFormSubmit, onKeyDown: handleKeyDown, children: [
667
743
  /* @__PURE__ */ jsxs3(Box3, { sx: { mb: 2 }, children: [
668
- /* @__PURE__ */ jsx3(
744
+ /* @__PURE__ */ jsx4(
669
745
  Typography3,
670
746
  {
671
747
  variant: "body2",
@@ -675,7 +751,7 @@ var ResetPasswordForm = ({ config, onNavigate, onError, searchParams }) => {
675
751
  children: t("resetPassword.newPasswordLabel")
676
752
  }
677
753
  ),
678
- /* @__PURE__ */ jsx3(
754
+ /* @__PURE__ */ jsx4(
679
755
  TextField3,
680
756
  {
681
757
  fullWidth: true,
@@ -694,7 +770,7 @@ var ResetPasswordForm = ({ config, onNavigate, onError, searchParams }) => {
694
770
  )
695
771
  ] }),
696
772
  /* @__PURE__ */ jsxs3(Box3, { sx: { mb: 2 }, children: [
697
- /* @__PURE__ */ jsx3(
773
+ /* @__PURE__ */ jsx4(
698
774
  Typography3,
699
775
  {
700
776
  variant: "body2",
@@ -704,7 +780,7 @@ var ResetPasswordForm = ({ config, onNavigate, onError, searchParams }) => {
704
780
  children: t("resetPassword.confirmPasswordLabel")
705
781
  }
706
782
  ),
707
- /* @__PURE__ */ jsx3(
783
+ /* @__PURE__ */ jsx4(
708
784
  TextField3,
709
785
  {
710
786
  fullWidth: true,
@@ -722,19 +798,18 @@ var ResetPasswordForm = ({ config, onNavigate, onError, searchParams }) => {
722
798
  }
723
799
  )
724
800
  ] }),
725
- /* @__PURE__ */ jsx3(Button3, { disabled: loading, type: "submit", fullWidth: true, variant: "contained", color: "primary", sx: { mt: 2, mb: 2 }, children: loading ? /* @__PURE__ */ jsx3(CircularProgress3, { size: 20 }) : t("resetPassword.resetPasswordButton") }),
726
- /* @__PURE__ */ jsx3(Box3, { sx: { textAlign: "center" }, children: /* @__PURE__ */ jsx3(Link3, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") }) })
801
+ /* @__PURE__ */ jsx4(Button3, { disabled: loading, type: "submit", fullWidth: true, variant: "contained", color: "primary", sx: { mt: 2, mb: 2 }, children: loading ? /* @__PURE__ */ jsx4(CircularProgress3, { size: 20 }) : t("resetPassword.resetPasswordButton") }),
802
+ /* @__PURE__ */ jsx4(Box3, { sx: { textAlign: "center" }, children: /* @__PURE__ */ jsx4(Link3, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") }) })
727
803
  ] }),
728
- errors.length > 0 && /* @__PURE__ */ jsx3(Box3, { sx: { mt: 2 }, children: errors.map((error, index) => /* @__PURE__ */ jsx3(Alert3, { variant: "filled", severity: "error", children: error }, index)) })
804
+ errors.length > 0 && /* @__PURE__ */ jsx4(Box3, { sx: { mt: 2 }, children: errors.map((error, index) => /* @__PURE__ */ jsx4(Alert3, { variant: "filled", severity: "error", children: error }, index)) })
729
805
  ] });
730
806
  };
731
807
  var ResetPasswordForm_default = ResetPasswordForm;
732
808
 
733
809
  // src/components/CrudifyLogin/Forms/CheckCodeForm.tsx
734
- import { useTranslation as useTranslation4 } from "react-i18next";
735
810
  import { useState as useState4, useEffect as useEffect4 } from "react";
736
811
  import { Typography as Typography4, TextField as TextField4, Button as Button4, Box as Box4, CircularProgress as CircularProgress4, Alert as Alert4, Link as Link4 } from "@mui/material";
737
- import { Fragment as Fragment4, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
812
+ import { Fragment as Fragment4, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
738
813
  var CheckCodeForm = ({ config, onNavigate, onError }) => {
739
814
  const [email, setEmail] = useState4("");
740
815
  const [code, setCode] = useState4("");
@@ -742,7 +817,7 @@ var CheckCodeForm = ({ config, onNavigate, onError }) => {
742
817
  const [errors, setErrors] = useState4([]);
743
818
  const [helperTextEmail, setHelperTextEmail] = useState4(null);
744
819
  const [helperTextCode, setHelperTextCode] = useState4(null);
745
- const { t } = useTranslation4();
820
+ const { t } = useTranslation();
746
821
  const { crudify: crudify3 } = useCrudifyLogin(config);
747
822
  useEffect4(() => {
748
823
  const timer = setTimeout(() => {
@@ -818,11 +893,11 @@ var CheckCodeForm = ({ config, onNavigate, onError }) => {
818
893
  }
819
894
  };
820
895
  return /* @__PURE__ */ jsxs4(Fragment4, { children: [
821
- /* @__PURE__ */ jsx4(Typography4, { variant: "h5", component: "h1", sx: { mb: 3, textAlign: "center" }, children: t("checkCode.title") }),
822
- /* @__PURE__ */ jsx4(Typography4, { variant: "body2", sx: { mb: 3, textAlign: "center", color: "text.secondary" }, children: t("checkCode.instructions") }),
896
+ /* @__PURE__ */ jsx5(Typography4, { variant: "h5", component: "h1", sx: { mb: 3, textAlign: "center" }, children: t("checkCode.title") }),
897
+ /* @__PURE__ */ jsx5(Typography4, { variant: "body2", sx: { mb: 3, textAlign: "center", color: "text.secondary" }, children: t("checkCode.instructions") }),
823
898
  /* @__PURE__ */ jsxs4(Box4, { component: "form", noValidate: true, onSubmit: handleFormSubmit, onKeyDown: handleKeyDown, children: [
824
899
  /* @__PURE__ */ jsxs4(Box4, { sx: { mb: 2 }, children: [
825
- /* @__PURE__ */ jsx4(
900
+ /* @__PURE__ */ jsx5(
826
901
  Typography4,
827
902
  {
828
903
  variant: "body2",
@@ -832,7 +907,7 @@ var CheckCodeForm = ({ config, onNavigate, onError }) => {
832
907
  children: t("checkCode.emailLabel")
833
908
  }
834
909
  ),
835
- /* @__PURE__ */ jsx4(
910
+ /* @__PURE__ */ jsx5(
836
911
  TextField4,
837
912
  {
838
913
  fullWidth: true,
@@ -851,7 +926,7 @@ var CheckCodeForm = ({ config, onNavigate, onError }) => {
851
926
  )
852
927
  ] }),
853
928
  /* @__PURE__ */ jsxs4(Box4, { sx: { mb: 2 }, children: [
854
- /* @__PURE__ */ jsx4(
929
+ /* @__PURE__ */ jsx5(
855
930
  Typography4,
856
931
  {
857
932
  variant: "body2",
@@ -861,7 +936,7 @@ var CheckCodeForm = ({ config, onNavigate, onError }) => {
861
936
  children: t("checkCode.codeLabel")
862
937
  }
863
938
  ),
864
- /* @__PURE__ */ jsx4(
939
+ /* @__PURE__ */ jsx5(
865
940
  TextField4,
866
941
  {
867
942
  fullWidth: true,
@@ -878,20 +953,20 @@ var CheckCodeForm = ({ config, onNavigate, onError }) => {
878
953
  }
879
954
  )
880
955
  ] }),
881
- /* @__PURE__ */ jsx4(Button4, { disabled: loading, type: "submit", fullWidth: true, variant: "contained", color: "primary", sx: { mt: 2, mb: 2 }, children: loading ? /* @__PURE__ */ jsx4(CircularProgress4, { size: 20 }) : t("checkCode.verifyButton") }),
956
+ /* @__PURE__ */ jsx5(Button4, { disabled: loading, type: "submit", fullWidth: true, variant: "contained", color: "primary", sx: { mt: 2, mb: 2 }, children: loading ? /* @__PURE__ */ jsx5(CircularProgress4, { size: 20 }) : t("checkCode.verifyButton") }),
882
957
  /* @__PURE__ */ jsxs4(Box4, { sx: { textAlign: "center", display: "flex", flexDirection: "column", gap: 1 }, children: [
883
- /* @__PURE__ */ jsx4(Link4, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login/forgotPassword"), variant: "body2", color: "primary", children: t("checkCode.resendCodeLink") }),
884
- /* @__PURE__ */ jsx4(Link4, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") })
958
+ /* @__PURE__ */ jsx5(Link4, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login/forgotPassword"), variant: "body2", color: "primary", children: t("checkCode.resendCodeLink") }),
959
+ /* @__PURE__ */ jsx5(Link4, { sx: { cursor: "pointer" }, onClick: () => onNavigate?.("/login"), variant: "body2", color: "secondary", children: t("common.backToLogin") })
885
960
  ] })
886
961
  ] }),
887
- errors.length > 0 && /* @__PURE__ */ jsx4(Box4, { sx: { mt: 2 }, children: errors.map((error, index) => /* @__PURE__ */ jsx4(Alert4, { variant: "filled", severity: "error", children: error }, index)) })
962
+ errors.length > 0 && /* @__PURE__ */ jsx5(Box4, { sx: { mt: 2 }, children: errors.map((error, index) => /* @__PURE__ */ jsx5(Alert4, { variant: "filled", severity: "error", children: error }, index)) })
888
963
  ] });
889
964
  };
890
965
  var CheckCodeForm_default = CheckCodeForm;
891
966
 
892
967
  // src/components/CrudifyLogin/index.tsx
893
- import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
894
- var CrudifyLogin = ({
968
+ import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
969
+ var CrudifyLoginInternal = ({
895
970
  config: providedConfig,
896
971
  onNavigate,
897
972
  onLoginSuccess,
@@ -900,10 +975,10 @@ var CrudifyLogin = ({
900
975
  redirectUrl = "/",
901
976
  autoReadFromCookies = true
902
977
  }) => {
903
- const { t } = useTranslation5();
978
+ const { t } = useTranslation();
904
979
  const [currentScreen, setCurrentScreen] = useState5(initialScreen);
905
980
  const [searchParams, setSearchParams] = useState5();
906
- const finalConfig = useMemo2(() => {
981
+ const finalConfig = useMemo3(() => {
907
982
  let cookieConfig = {};
908
983
  if (autoReadFromCookies) {
909
984
  try {
@@ -972,16 +1047,16 @@ var CrudifyLogin = ({
972
1047
  };
973
1048
  switch (currentScreen) {
974
1049
  case "forgotPassword":
975
- return /* @__PURE__ */ jsx5(ForgotPasswordForm_default, { ...commonProps });
1050
+ return /* @__PURE__ */ jsx6(ForgotPasswordForm_default, { ...commonProps });
976
1051
  case "checkCode":
977
- return /* @__PURE__ */ jsx5(CheckCodeForm_default, { ...commonProps });
1052
+ return /* @__PURE__ */ jsx6(CheckCodeForm_default, { ...commonProps });
978
1053
  case "resetPassword":
979
- return /* @__PURE__ */ jsx5(ResetPasswordForm_default, { ...commonProps, searchParams });
1054
+ return /* @__PURE__ */ jsx6(ResetPasswordForm_default, { ...commonProps, searchParams });
980
1055
  default:
981
- return /* @__PURE__ */ jsx5(LoginForm_default, { ...commonProps, onLoginSuccess });
1056
+ return /* @__PURE__ */ jsx6(LoginForm_default, { ...commonProps, onLoginSuccess });
982
1057
  }
983
1058
  };
984
- return /* @__PURE__ */ jsx5(
1059
+ return /* @__PURE__ */ jsx6(
985
1060
  Box5,
986
1061
  {
987
1062
  sx: {
@@ -1005,7 +1080,7 @@ var CrudifyLogin = ({
1005
1080
  background: finalConfig.colors?.bgColor || "#fff"
1006
1081
  },
1007
1082
  children: [
1008
- /* @__PURE__ */ jsx5(Box5, { sx: { display: "flex", justifyContent: "center", mb: 3 }, children: /* @__PURE__ */ jsx5(
1083
+ /* @__PURE__ */ jsx6(Box5, { sx: { display: "flex", justifyContent: "center", mb: 3 }, children: /* @__PURE__ */ jsx6(
1009
1084
  "img",
1010
1085
  {
1011
1086
  src: finalConfig.logo || "/nocios-default.png",
@@ -1021,7 +1096,7 @@ var CrudifyLogin = ({
1021
1096
  }
1022
1097
  }
1023
1098
  ) }),
1024
- finalConfig.appName && /* @__PURE__ */ jsx5(
1099
+ finalConfig.appName && /* @__PURE__ */ jsx6(
1025
1100
  Typography5,
1026
1101
  {
1027
1102
  variant: "h6",
@@ -1041,6 +1116,11 @@ var CrudifyLogin = ({
1041
1116
  }
1042
1117
  );
1043
1118
  };
1119
+ var CrudifyLogin = ({ translations, language = "en", config = {}, ...props }) => {
1120
+ console.log("CrudifyLogin received translations:", translations);
1121
+ console.log("CrudifyLogin received language:", language);
1122
+ return /* @__PURE__ */ jsx6(I18nProvider, { translations, language, children: /* @__PURE__ */ jsx6(CrudifyLoginInternal, { config, ...props }) });
1123
+ };
1044
1124
  var CrudifyLogin_default = CrudifyLogin;
1045
1125
 
1046
1126
  // src/hooks/useUserProfile.ts
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nocios/crudify-ui",
3
- "version": "1.0.46",
3
+ "version": "1.0.48",
4
4
  "description": "Biblioteca de componentes UI para Crudify",
5
5
  "author": "Nocios",
6
6
  "license": "MIT",