Feature/release 2

packages/auth0-acul-js/.eslintrc.json

@@ -28,13 +28,11 @@
         "singleQuote": true
       }
     ],
-    "@typescript-eslint/consistent-type-definitions": ["error", "interface"],
     "@typescript-eslint/no-floating-promises": "error",
     "@typescript-eslint/explicit-function-return-type": "error",
     "@typescript-eslint/no-non-null-assertion": "error",
     "@typescript-eslint/no-misused-promises": "error",
     "@typescript-eslint/no-explicit-any": "error",
-    "@typescript-eslint/strict-boolean-expressions": "error",
     "@typescript-eslint/no-unsafe-member-access": "error",
     "@typescript-eslint/ban-ts-comment": "error",
     "@typescript-eslint/no-unsafe-assignment": "error",

packages/auth0-acul-js/CHANGELOG.md

@@ -0,0 +1,49 @@
+
+## [[email protected]](https://github.com/auth0/auth0-react/tree/v0.1.0) (2024-02-06)
+
+**Added**
+
+Support for the following screens:
+
+1. [login](https://auth0.github.io/universal-login/classes/Classes.Login.html)
+2. [signup](https://auth0.github.io/universal-login/classes/Classes.Signup.html)
+3. [reset-password-email](https://auth0.github.io/universal-login/classes/Classes.ResetPasswordEmail.html)
+4. [reset-password-request](https://auth0.github.io/universal-login/classes/Classes.ResetPasswordRequest.html)
+5. [reset-password](https://auth0.github.io/universal-login/classes/Classes.ResetPassword.html)
+6. [reset-password-error](https://auth0.github.io/universal-login/classes/Classes.ResetPasswordError.html)
+7. [reset-password-success](https://auth0.github.io/universal-login/classes/Classes.ResetPasswordSuccess.html)
+
+**Breaking Changes**
+
+- **Flattened Screen-Related Properties**: We have simplified the structure of screen-related properties by removing the methods and replacing them with direct properties.
+
+  Example:
+  - The previous `loginIdInstance.transaction.geErrors` method has been replaced with the new `loginIdInstance.transaction.errors` property.
+
+  **Code Example:**
+  ```javascript
+  import LoginId from "@auth0/auth0-acul-js/login-id";
+  const loginIdManager = new LoginId();
+  // Old method
+  loginIdInstance.transaction.geErrors(); 
+  // New property
+  loginIdInstance.transaction.errors;
+
+## [[email protected]](https://github.com/auth0/auth0-react/tree/v0.1.0) (2024-12-09)
+
+**Added**
+
+Support for the following screens:
+
+1. [login-id](https://auth0.github.io/universal-login/classes/Classes.LoginId.html)
+2. [login-Password](https://auth0.github.io/universal-login/classes/Classes.LoginPassword.html)
+3. [signup-id](https://auth0.github.io/universal-login/classes/Classes.SignupId.html)
+4. [signup-password](https://auth0.github.io/universal-login/classes/Classes.SignupPassword.html)
+5. [login-passwordless-email-code](https://auth0.github.io/universal-login/classes/Classes.LoginPasswordlessEmailCode.html)
+6. [login-passwordless-sms-otp](https://auth0.github.io/universal-login/classes/Classes.LoginPasswordlessSmsOtp.html)
+7. [passkey-enrollment](https://auth0.github.io/universal-login/classes/Classes.PasskeyEnrollment.html)
+8. [passkey-enrollment-local](https://auth0.github.io/universal-login/classes/Classes.PasskeyEnrollmentLocal.html)
+9. [phone-identifier-enrollment](https://auth0.github.io/universal-login/classes/Classes.PhoneIdentifierEnrollment.html)
+10. [phone-identifier-challenge](https://auth0.github.io/universal-login/classes/Classes.PhoneIdentifierChallenge.html)
+11. [email-identifier-challenge](https://auth0.github.io/universal-login/classes/Classes.EmailIdentifierChallenge.html)
+12. [interstitial-captcha](https://auth0.github.io/universal-login/classes/Classes.InterstitialCaptcha.html)

packages/auth0-acul-js/FAQ.md

@@ -20,6 +20,13 @@ import  PhoneIdentifierChallengeScreen  from '@auth0/auth0-acul-js/phone-identif
 import  PhoneIdentifierEnrolmentScreen  from '@auth0/auth0-acul-js/phone-identifier-enrollment';
 import  EmailIdentifierChallengeScreen  from '@auth0/auth0-acul-js/email-identifier-challenge';
 import  InterstitialCaptchaScreen  from '@auth0/auth0-acul-js/interstitial-captcha';
+import  Login  from '@auth0/auth0-acul-js/login';
+import  Signup  from '@auth0/auth0-acul-js/signup';
+import  ResetPassword from '@auth0/auth0-acul-js/reset-password';
+import  ResetPasswordRequest from '@auth0/auth0-acul-js/reset-password-request';
+import  ResetPasswordEmail from '@auth0/auth0-acul-js/reset-password-email';
+import  ResetPasswordSuccess from '@auth0/auth0-acul-js/reset-password-success';
+import  ResetPasswordError from '@auth0/auth0-acul-js/reset-password-error';
 
 ```
 
@@ -28,7 +35,7 @@ import  InterstitialCaptchaScreen  from '@auth0/auth0-acul-js/interstitial-captc
 The SDK provides multiple ways to detect and view errors during the process:
 
 1. **Screen-Specific Errors**  
-   Each screen includes a `transaction.getErrors()` method, which returns a list of errors specific to that screen. These errors are generated after the final validation of the request, helping you identify issues that need attention.
+   Each screen includes a `transaction.errors` property, which returns a list of errors specific to that screen. These errors are generated after the final validation of the request, helping you identify issues that need attention.
 
 2. **Submit Handler Errors**  
    The SDK may throw errors if invalid parameters are passed to the submit handler. These errors occur when validation fails and can be caught during the submission process.

packages/auth0-acul-js/README.md

@@ -82,7 +82,7 @@ Let’s look at an example for adding logic to the `login-id` screen.
 
   // Trigger the login method on button click
   loginIdManager.login({
-    username: <USERNAME_FIELD_VALUE>
+    username: "testUser"
   });
 ``` 
 
@@ -111,7 +111,7 @@ const selectedConnection = alternateConnections[0];
 console.log(`Selected connection: ${selectedConnection.name}`);
 
 // Proceed with social login using the selected connection
-loginIdManager.continueWithFederatedLogin({
+loginIdManager.socialLogin({
   connection: selectedConnection.name,
 })
 ```
@@ -123,28 +123,34 @@ Get up and running quickly with our boilerplate starter template: [Link](https:/
 ##  API reference
 ### Screens
 
-1. [login-id](https://auth0.github.io/universal-login/classes/Classes.LoginId.html)
-2. [login-Password](https://auth0.github.io/universal-login/classes/Classes.LoginPassword.html)
-3. [signup-id](https://auth0.github.io/universal-login/classes/Classes.SignupId.html)
-4. [signup-password](https://auth0.github.io/universal-login/classes/Classes.SignupPassword.html)
+1. [login](https://auth0.github.io/universal-login/classes/Classes.Login.html)
+2. [login-id](https://auth0.github.io/universal-login/classes/Classes.LoginId.html)
+3. [login-Password](https://auth0.github.io/universal-login/classes/Classes.LoginPassword.html)
+4. [signup-id](https://auth0.github.io/universal-login/classes/Classes.SignupId.html)
+5. [signup-password](https://auth0.github.io/universal-login/classes/Classes.SignupPassword.html)
 <details>
   <summary>Explore more screens...</summary>
 
-  5. [login-passwordless-email-code](https://auth0.github.io/universal-login/classes/Classes.LoginPasswordlessEmailCode.html)
-  6. [login-passwordless-sms-otp](https://auth0.github.io/universal-login/classes/Classes.LoginPasswordlessSmsOtp.html)
-  7. [passkey-enrollment](https://auth0.github.io/universal-login/classes/Classes.PasskeyEnrollment.html)
-  8. [passkey-enrollment-local](https://auth0.github.io/universal-login/classes/Classes.PasskeyEnrollmentLocal.html)
-  9. [phone-identifier-enrollment](https://auth0.github.io/universal-login/classes/Classes.PhoneIdentifierEnrollment.html)
-  10. [phone-identifier-challenge](https://auth0.github.io/universal-login/classes/Classes.PhoneIdentifierChallenge.html)
-  11. [email-identifier-challenge](https://auth0.github.io/universal-login/classes/Classes.EmailIdentifierChallenge.html)
-  12. [interstitial-captcha](https://auth0.github.io/universal-login/classes/Classes.InterstitialCaptcha.html)
+  6. [login-passwordless-email-code](https://auth0.github.io/universal-login/classes/Classes.LoginPasswordlessEmailCode.html)
+  7. [login-passwordless-sms-otp](https://auth0.github.io/universal-login/classes/Classes.LoginPasswordlessSmsOtp.html)
+  8. [passkey-enrollment](https://auth0.github.io/universal-login/classes/Classes.PasskeyEnrollment.html)
+  9. [passkey-enrollment-local](https://auth0.github.io/universal-login/classes/Classes.PasskeyEnrollmentLocal.html)
+  10. [phone-identifier-enrollment](https://auth0.github.io/universal-login/classes/Classes.PhoneIdentifierEnrollment.html)
+  11. [phone-identifier-challenge](https://auth0.github.io/universal-login/classes/Classes.PhoneIdentifierChallenge.html)
+  12. [email-identifier-challenge](https://auth0.github.io/universal-login/classes/Classes.EmailIdentifierChallenge.html)
+  13. [interstitial-captcha](https://auth0.github.io/universal-login/classes/Classes.InterstitialCaptcha.html)
+  14. [reset-password-email](https://auth0.github.io/universal-login/classes/Classes.ResetPasswordEmail.html)
+  15. [reset-password-request](https://auth0.github.io/universal-login/classes/Classes.ResetPasswordRequest.html)
+  16. [reset-password](https://auth0.github.io/universal-login/classes/Classes.ResetPassword.html)
+  17. [reset-password-error](https://auth0.github.io/universal-login/classes/Classes.ResetPasswordError.html)
+  18. [reset-password-success](https://auth0.github.io/universal-login/classes/Classes.ResetPasswordSuccess.html)
+  19. [signup](https://auth0.github.io/universal-login/classes/Classes.Signup.html)
 </details>
 
 
 
 
 
-
 ##  Feedback
 
 ### Contributing

packages/auth0-acul-js/examples/login.md

@@ -0,0 +1,174 @@
+# Login Screen Examples
+
+## Basic Login with Username/Password
+
+```typescript
+import Login from '@auth0/auth0-acul-js/login';
+
+const loginManager = new Login();
+
+// Handle form submission
+const handleSubmit = async (e: React.FormEvent) => {
+  e.preventDefault();
+
+  try {
+    await loginManager.login({
+      username: '[email protected]',
+      password: 'myPassword123'
+    });
+  } catch (error) {
+    console.error('Login failed:', error);
+  }
+};
+```
+
+## Login with Social Provider
+
+```typescript
+import Login from '@auth0/auth0-acul-js/login';
+
+const loginManager = new Login();
+
+// Handle social login
+const handleSocialLogin = async (connection: string) => {
+  try {
+    await loginManager.socialLogin({
+      connection: connection // e.g. 'google-oauth2'
+    });
+  } catch (error) {
+    console.error('Social login failed:', error);
+  }
+};
+```
+
+## React Component Example with TailwindCSS
+
+```tsx
+import React, { useState } from 'react';
+import Login from '@auth0/auth0-acul-js/login';
+
+const LoginScreen: React.FC = () => {
+  const [username, setUsername] = useState('');
+  const [password, setPassword] = useState('');
+  const [error, setError] = useState('');
+
+  const loginManager = new Login();
+  const { transaction } = loginManager;
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setError('');
+
+    try {
+      await loginManager.login({
+        username,
+        password
+      });
+    } catch (error) {
+      setError('Login failed. Please check your credentials.');
+    }
+  };
+
+  const handleSocialLogin = async (connection: string) => {
+    try {
+      await loginManager.socialLogin({ connection });
+    } catch (error) {
+      setError('Social login failed. Please try again.');
+    }
+  };
+
+  return (
+    <div className="min-h-screen bg-gray-100 flex flex-col justify-center py-12 sm:px-6 lg:px-8">
+      <div className="sm:mx-auto sm:w-full sm:max-w-md">
+        <h2 className="mt-6 text-center text-3xl font-extrabold text-gray-900">
+          Sign in to your account
+        </h2>
+      </div>
+
+      <div className="mt-8 sm:mx-auto sm:w-full sm:max-w-md">
+        <div className="bg-white py-8 px-4 shadow sm:rounded-lg sm:px-10">
+          <form className="space-y-6" onSubmit={handleSubmit}>
+            <div>
+              <label htmlFor="username" className="block text-sm font-medium text-gray-700">
+                Username or Email
+              </label>
+              <div className="mt-1">
+                <input
+                  id="username"
+                  name="username"
+                  type="text"
+                  required
+                  value={username}
+                  onChange={(e) => setUsername(e.target.value)}
+                  className="appearance-none block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-blue-500 focus:border-blue-500"
+                />
+              </div>
+            </div>
+
+            <div>
+              <label htmlFor="password" className="block text-sm font-medium text-gray-700">
+                Password
+              </label>
+              <div className="mt-1">
+                <input
+                  id="password"
+                  name="password"
+                  type="password"
+                  required
+                  value={password}
+                  onChange={(e) => setPassword(e.target.value)}
+                  className="appearance-none block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-blue-500 focus:border-blue-500"
+                />
+              </div>
+            </div>
+
+            {error && (
+              <div className="text-red-600 text-sm">
+                {error}
+              </div>
+            )}
+
+            <div>
+              <button
+                type="submit"
+                className="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
+              >
+                Sign in
+              </button>
+            </div>
+          </form>
+
+          {transaction.alternateConnections && transaction.alternateConnections.length > 0 && (
+            <div className="mt-6">
+              <div className="relative">
+                <div className="absolute inset-0 flex items-center">
+                  <div className="w-full border-t border-gray-300" />
+                </div>
+                <div className="relative flex justify-center text-sm">
+                  <span className="px-2 bg-white text-gray-500">
+                    Or continue with
+                  </span>
+                </div>
+              </div>
+
+              <div className="mt-6 grid grid-cols-3 gap-3">
+                {transaction.alternateConnections.map((connection) => (
+                  <button
+                    key={connection.name}
+                    onClick={() => handleSocialLogin(connection.name)}
+                    className="w-full inline-flex justify-center py-2 px-4 border border-gray-300 rounded-md shadow-sm bg-white text-sm font-medium text-gray-500 hover:bg-gray-50"
+                  >
+                    {connection.name}
+                  </button>
+                ))}
+              </div>
+            </div>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default LoginScreen;
+```

packages/auth0-acul-js/examples/reset-password-email.md

@@ -0,0 +1,5 @@
+import ResetPasswordEmail from '@auth0/auth0-acul-js/reset-password-email';
+
+const resetPasswordEmail = new ResetPasswordEmail();
+
+resetPasswordEmail.resendEmail();

packages/auth0-acul-js/examples/reset-password-error.md

@@ -0,0 +1,8 @@
+import ResetPasswordError from '@auth0/auth0-acul-js/reset-password-error';
+
+const resetPasswordError = new ResetPasswordError();
+
+const { screen } = resetPasswordError;
+const data = screen.data;
+
+console.log(data);