anima-ds-nucleus 1.0.17 → 1.0.18

package/src/components/Views/LoginForm/LoginForm.stories.jsx

@@ -7,13 +7,59 @@ export default {
   tags: ['autodocs'],
   decorators: [
     (Story) => (
-      <I18nProvider>
-        <Story />
+      <I18nProvider language="es-AR">
+        <div style={{ padding: '2rem', maxWidth: '500px', margin: '0 auto' }}>
+          <Story />
+        </div>
       </I18nProvider>
     ),
   ],
+  argTypes: {
+    variant: {
+      control: 'select',
+      options: ['hexa-login', undefined],
+      description: 'Variante del formulario de login',
+    },
+    loading: {
+      control: 'boolean',
+      description: 'Estado de carga del formulario',
+    },
+    showSocialLogin: {
+      control: 'boolean',
+      description: 'Mostrar botones de login social',
+    },
+    showDivider: {
+      control: 'boolean',
+      description: 'Mostrar divisor antes de los botones sociales',
+    },
+    generalError: {
+      control: 'text',
+      description: 'Mensaje de error general',
+    },
+  },
+};
+
+// Variante Hexa Login (principal)
+export const HexaLogin = {
+  args: {
+    variant: 'hexa-login',
+    onSubmit: (data) => {
+      console.log('Login data:', data);
+      alert('Login submitted!');
+    },
+    onForgotPassword: () => {
+      alert('Forgot password clicked');
+    },
+    onGoogleLogin: () => {
+      alert('Google login clicked');
+    },
+    onMicrosoftLogin: () => {
+      alert('Microsoft login clicked');
+    },
+  },
 };
 
+// Variante por defecto
 export const Default = {
   args: {
     onSubmit: (data) => {
@@ -23,33 +69,165 @@ export const Default = {
   },
 };
 
+// Con estado de carga
+export const Loading = {
+  args: {
+    variant: 'hexa-login',
+    loading: true,
+    onSubmit: (data) => {
+      console.log('Login data:', data);
+    },
+    onGoogleLogin: () => {
+      alert('Google login clicked');
+    },
+    onMicrosoftLogin: () => {
+      alert('Microsoft login clicked');
+    },
+  },
+};
+
+// Con error general (string)
+export const WithError = {
+  args: {
+    variant: 'hexa-login',
+    generalError: 'Credenciales incorrectas',
+    onSubmit: (data) => {
+      console.log('Login data:', data);
+    },
+    onGoogleLogin: () => {
+      alert('Google login clicked');
+    },
+    onMicrosoftLogin: () => {
+      alert('Microsoft login clicked');
+    },
+  },
+};
+
+// Con error general (boolean - muestra textos i18n)
+export const WithErrorBoolean = {
+  args: {
+    variant: 'hexa-login',
+    generalError: true,
+    onSubmit: (data) => {
+      console.log('Login data:', data);
+    },
+    onGoogleLogin: () => {
+      alert('Google login clicked');
+    },
+    onMicrosoftLogin: () => {
+      alert('Microsoft login clicked');
+    },
+  },
+};
+
+// Con error general personalizado
+export const WithCustomError = {
+  args: {
+    variant: 'hexa-login',
+    generalError: true,
+    generalErrorTitle: 'Error de autenticación',
+    generalErrorSubtitle: 'Verifica tus credenciales e intenta nuevamente.',
+    onSubmit: (data) => {
+      console.log('Login data:', data);
+    },
+    onGoogleLogin: () => {
+      alert('Google login clicked');
+    },
+    onMicrosoftLogin: () => {
+      alert('Microsoft login clicked');
+    },
+  },
+};
+
+// Sin login social
+export const WithoutSocialLogin = {
+  args: {
+    variant: 'hexa-login',
+    showSocialLogin: false,
+    showDivider: false,
+    onSubmit: (data) => {
+      console.log('Login data:', data);
+      alert('Login submitted!');
+    },
+    onForgotPassword: () => {
+      alert('Forgot password clicked');
+    },
+  },
+};
+
+// Con labels personalizados
+export const CustomLabels = {
+  args: {
+    variant: 'hexa-login',
+    labels: {
+      emailLabel: 'Correo electrónico',
+      passwordLabel: 'Contraseña',
+      rememberMeLabel: 'Recordar sesión',
+      forgotPasswordLabel: '¿Olvidaste tu contraseña?',
+      continueWithLabel: 'O continúa con',
+      googleLabel: 'Google',
+      microsoftLabel: 'Microsoft',
+    },
+    onSubmit: (data) => {
+      console.log('Login data:', data);
+      alert('Login submitted!');
+    },
+    onGoogleLogin: () => {
+      alert('Google login clicked');
+    },
+    onMicrosoftLogin: () => {
+      alert('Microsoft login clicked');
+    },
+  },
+};
+
+// Versión en español
 export const Spanish = {
   decorators: [
     (Story) => (
       <I18nProvider language="es-AR">
-        <Story />
+        <div style={{ padding: '2rem', maxWidth: '500px', margin: '0 auto' }}>
+          <Story />
+        </div>
       </I18nProvider>
     ),
   ],
   args: {
+    variant: 'hexa-login',
     onSubmit: (data) => {
       console.log('Login data:', data);
     },
+    onGoogleLogin: () => {
+      alert('Google login clicked');
+    },
+    onMicrosoftLogin: () => {
+      alert('Microsoft login clicked');
+    },
   },
 };
 
+// Versión en portugués
 export const Portuguese = {
   decorators: [
     (Story) => (
       <I18nProvider language="pt-BR">
-        <Story />
+        <div style={{ padding: '2rem', maxWidth: '500px', margin: '0 auto' }}>
+          <Story />
+        </div>
       </I18nProvider>
     ),
   ],
   args: {
+    variant: 'hexa-login',
     onSubmit: (data) => {
       console.log('Login data:', data);
     },
+    onGoogleLogin: () => {
+      alert('Google login clicked');
+    },
+    onMicrosoftLogin: () => {
+      alert('Microsoft login clicked');
+    },
   },
 };
 

package/src/i18n/config.js

@@ -95,6 +95,12 @@ const resources = {
       'alert.error': 'Error',
       'alert.warning': 'Advertencia',
       'alert.info': 'Información',
+      
+      // Errors
+      'errors.invalidCredentials': 'Correo o contraseña incorrectos.',
+      'errors.tryAgain': 'Intentá nuevamente.',
+      'form.tryAgain': 'Por favor, intentá nuevamente.',
+      'form.loggingIn': 'Ingresando...',
     },
   },
   'pt-BR': {
@@ -190,6 +196,12 @@ const resources = {
       'alert.error': 'Erro',
       'alert.warning': 'Aviso',
       'alert.info': 'Informação',
+      
+      // Errors
+      'errors.invalidCredentials': 'E-mail ou senha incorretos.',
+      'errors.tryAgain': 'Tente novamente.',
+      'form.tryAgain': 'Por favor, tente novamente.',
+      'form.loggingIn': 'Entrando...',
     },
   },
 };

package/src/index.js

@@ -71,6 +71,7 @@ export { TagList } from './components/DataDisplay/TagList/TagList';
 // Views
 export { LoginForm } from './components/Views/LoginForm/LoginForm';
 export { ChangePasswordForm } from './components/Views/ChangePasswordForm/ChangePasswordForm';
+export { ForgotPassword } from './components/Views/ForgotPassword/ForgotPassword';
 export { Chat } from './components/Views/Chat/Chat';
 
 // Providers