chore(deps): update dependency supertokens-auth-react to v0.47.1

[renovate]

This PR contains the following updates:

Package	Change	Age	Adoption	Passing	Confidence
supertokens-auth-react	0.39.1 -> 0.47.1

---

Warning

Some dependencies could not be looked up. Check the Dependency Dashboard for more information.

---

Release Notes

supertokens/supertokens-auth-react (supertokens-auth-react)

v0.47.1

Compare Source

Fixes

• Fixed an issue where we showed the "continue with passwordless" button during sign-in even if email-based passwordless was disabled by the tenant configuration.

v0.47.0

Compare Source

Breaking changes

Redesigned the pre-built UI with a modern monochrome aesthetic, creating a cleaner and more unified visual experience. Please double check any custom styles you added still looks good with the new UI.

Details

• Changed a lot of the default styles to fit the new UI
• --palette-textTitle changed from rgb(34, 34, 34) to rgb(0, 0, 0)
• --palette-textLabel changed from rgb(34, 34, 34) to rgb(0, 0, 0)
• --palette-textInput changed from rgb(34, 34, 34) to rgb(0, 0, 0)
• --palette-textPrimary changed from rgb(101, 101, 101) to rgb(128, 128, 128)
• --palette-textLink changed from rgb(0, 118, 255) to rgb(0, 122, 255)
• --palette-textGray changed from rgb(128, 128, 128) to rgb(54, 54, 54)
• Adjusted the layout of the provider buttons. Now:
  • The logo is aligned to the left, and the text is centered within the entire button, enhancing visual balance and consistency across different button text lengths.
  • The button now has a fixed height of 40px.
  • We add an animation to the button when hovering over it if the text is too long.
• Changed the Email Icon used in the "Verify Email" UI
• Changed the SMS Icon used in the "Link sent to phone" UI
• Changed the button arrow icons
• Updated some translation strings to fit the new UI
  • EMAIL_VERIFICATION_SEND_TITLE
  • PWLESS_LINK_SENT_RESEND_DESC_END_EMAIL

v0.46.0

Compare Source

Breaking changes

• The prebuilt UI now clears the login attempt info if the stored data doesn't contain all the required properties. This should help migration from a custom UI to the prebuilt UI.
• Changed redirectToFactor to accept an object instead of multiple arguments.
• Changed redirectToFactorChooser to accept an object instead of multiple arguments.
• Made MFA related screens do a success redirection if MFA is already completed and the stepUp query param is not set to true.
  • redirectToFactorChooser now accepts a stepUp option to set the stepUp query param.
  • redirectToFactor now accepts a stepUp option to set the stepUp query param.

Fixes

• Fixed an issue where the Session recipe was not allowed in the pre-built UI list (it's still a no-op, but it shouldn't be a type issue)

v0.45.1

Compare Source

Changes

• Now we only update the session context if the object changes by value. This optimization should help reduce unnecessary re-renders.

v0.45.0

Compare Source

Breaking changes

• Updated the font and font-weights in the default styles
• We no longer load the Rubik font by default

Fixes

• Now the error prop should be updated in override components.

v0.44.0

Compare Source

• Removes the default maxAgeInSeconds value (previously 300 seconds) in EmailVerification Claim. If the claim value is true and maxAgeInSeconds is not provided, it will not be refreshed.

v0.43.1

Compare Source

• Fixes to e2e test

v0.43.0

Compare Source

Changes

• Updated SAML third-party provider to use logo based on the provider name

v0.42.3

Compare Source

Changes

• Now we only update the session context if the object changes by value. This optimization should help reduce unnecessary re-renders.

v0.42.2

Compare Source

Changes

• Updating publish script to update to the lib on chromatic

v0.42.1

Compare Source

Changes

• Re-built docs folder

v0.42.0

Compare Source

Breaking changes

• Removed ThirdPartyEmailPassword and ThirdPartyPasswordless recipes.

• EmailPassword recipe:

  • Removed embeddable components: SignInUp, SignInAndUpTheme
  • Removed overridable components: EmailPasswordSignIn, EmailPasswordSignInFooter, EmailPasswordSignInHeader, EmailPasswordSignUp, EmailPasswordSignUpFooter, EmailPasswordSignUpHeader
  • Moved useShadowDom, defaultToSignUp, privacyPolicyLink, termsOfServiceLink from the config to the root configuration passed to SuperTokens.init.

• Passwordless recipe:

  • Removed embeddable components: SignInUp
  • Removed overrideable components: PasswordlessSignInUpHeader_Override, PasswordlessSignInUpFooter_Override
  • Removed the guessInternationPhoneNumberFromInputPhoneNumber configurable callback, since now the user sets if they are entering email or a phone number explicitly
  • Moved useShadowDom, privacyPolicyLink, termsOfServiceLink from the config to the root configuration passed to SuperTokens.init.
  • Changed the UX of the contactinfo entry form for EMAIL_OR_PHONE
  • Added defaultToEmail configuration option, which decides if the contact info input form starts in the email or phone state if the contactMethod is set to EMAIL_OR_PHONE

• ThirdParty recipe:

  • Removed embeddable components: SignInAndUp
  • Removed overridable components: ThirdPartySignInAndUpHeader, ThirdPartySignUpFooter
  • Moved useShadowDom, privacyPolicyLink, termsOfServiceLink from the config to the root configuration passed to SuperTokens.init.

• Removed SESSION_ALREADY_EXISTS event from auth recipes and moved it into the Session recipe

• Added new keys to data-supertokens props of several elements

• Updated some styles to work with the updated UI structure

• Renamed translation strings to reflect the new component/UI structure:

  • EMAIL_PASSWORD_SIGN_IN_FORGOT_PW_LINK instead of EMAIL_PASSWORD_SIGN_IN_FOOTER_FORGOT_PW_LINK
  • AUTH_PAGE_HEADER_TITLE_SIGN_IN_AND_UP instead of PWLESS_SIGN_IN_UP_HEADER_TITLE and THIRD_PARTY_SIGN_IN_AND_UP_HEADER_TITLE
  • AUTH_PAGE_HEADER_TITLE_SIGN_IN instead of EMAIL_PASSWORD_SIGN_IN_HEADER_TITLE
  • AUTH_PAGE_HEADER_SUBTITLE_SIGN_UP_START instead of EMAIL_PASSWORD_SIGN_IN_HEADER_SUBTITLE_START
  • AUTH_PAGE_HEADER_SUBTITLE_SIGN_UP_SIGN_IN_LINK instead of EMAIL_PASSWORD_SIGN_IN_HEADER_SUBTITLE_SIGN_UP_LINK
  • AUTH_PAGE_HEADER_SUBTITLE_SIGN_UP_END instead of EMAIL_PASSWORD_SIGN_IN_HEADER_SUBTITLE_END
  • AUTH_PAGE_HEADER_TITLE_SIGN_UP instead of EMAIL_PASSWORD_SIGN_UP_HEADER_TITLE
  • AUTH_PAGE_HEADER_SUBTITLE_SIGN_IN_START instead of EMAIL_PASSWORD_SIGN_UP_HEADER_SUBTITLE_START
  • AUTH_PAGE_HEADER_SUBTITLE_SIGN_IN_SIGN_UP_LINK instead of EMAIL_PASSWORD_SIGN_UP_HEADER_SUBTITLE_SIGN_IN_LINK
  • AUTH_PAGE_HEADER_SUBTITLE_SIGN_IN_END instead of EMAIL_PASSWORD_SIGN_UP_HEADER_SUBTITLE_END
  • AUTH_PAGE_FOOTER_START instead of EMAIL_PASSWORD_SIGN_UP_FOOTER_START, PWLESS_SIGN_IN_UP_FOOTER_START and THIRD_PARTY_SIGN_IN_UP_FOOTER_START
  • AUTH_PAGE_FOOTER_TOS instead of: EMAIL_PASSWORD_SIGN_UP_FOOTER_TOS, PWLESS_SIGN_IN_UP_FOOTER_TOS and THIRD_PARTY_SIGN_IN_UP_FOOTER_TOS
  • AUTH_PAGE_FOOTER_AND instead of EMAIL_PASSWORD_SIGN_UP_FOOTER_AND, PWLESS_SIGN_IN_UP_FOOTER_AND and THIRD_PARTY_SIGN_IN_UP_FOOTER_AND
  • AUTH_PAGE_FOOTER_PP instead of EMAIL_PASSWORD_SIGN_UP_FOOTER_PP, PWLESS_SIGN_IN_UP_FOOTER_PP and THIRD_PARTY_SIGN_IN_UP_FOOTER_PP
  • AUTH_PAGE_FOOTER_END instead of EMAIL_PASSWORD_SIGN_UP_FOOTER_END, PWLESS_SIGN_IN_UP_FOOTER_END and THIRD_PARTY_SIGN_IN_UP_FOOTER_END

Changes

• Added overrideable components:
  • General: AuthPageComponentList, AuthPageHeader, AuthPageFooter.
    • These can be overridden by using AuthRecipeComponentsOverrideContextProvider
  • Passwordless: PasswordlessContinueWithPasswordless_Override
• Added new embeddable components:
  • General: AuthPage and AuthPageTheme
  • EmailPassword: SignInTheme, SignUpTheme
• Added a new style prop to the root level config

Migration guide

Removed recipes

• If you were using ThirdPartyEmailPassword, you should now init ThirdParty and EmailPassword recipes separately. The config for the individual recipes are mostly the same, except the syntax may be different. Check our recipe guides for ThirdParty and EmailPassword for more information.

• If you were using ThirdPartyPasswordless, you should now init ThirdParty and Passwordless recipes separately. The config for the individual recipes are mostly the same, except the syntax may be different. Check our recipe guides for ThirdParty and Passwordless for more information.

Moved configuration options

Several configuration options (useShadowDom, defaultToSignUp, privacyPolicyLink, termsOfServiceLink) were moved to the root configuration (the one passed directly to SuperTokens.init) out of recipe specific configs. The function of these props remain identical, the only necessary migration is moving them:

Before:

SuperTokens.init({
    appInfo: {
        // appInfo
    },
    recipeList: [
        EmailPassword.init({
            useShadowDom: false,
            signInAndUpFeature: {
                defaultToSignUp: true,
                signUpForm: {
                    privacyPolicyLink: "http://example.com",
                    termsOfServiceLink: "http://example.com",
                },
            },
        }),
        Session.init(),
    ],
});

After:

SuperTokens.init({
    appInfo: {
        // appInfo
    },
    useShadowDom: false,
    defaultToSignUp: true,
    privacyPolicyLink: "http://example.com",
    termsOfServiceLink: "http://example.com",
    recipeList: [EmailPassword.init(), Session.init()],
});

Removed embeddable components

The auth page related embeddable components (SignInAndUp, SignInUp) and the related theme components were removed. We instead recommend you to use the new AuthPage component with the appropriate pre-built UI objects and factorsIds set. For more information check the following guide

Before:

import { SignInAndUp } from "supertokens-auth-react/recipe/thirdpartyemailpassword/prebuiltui";

const Component = () => {
    const navigate = useNavigate();

    return <SignInAndUp navigate={navigate} />;
};

After:

import { PasswordlessPreBuiltUI } from "supertokens-auth-react/recipe/passwordless/prebuiltui";
import { AuthPage } from "supertokens-auth-react/ui";

const Component = () => {
    const navigate = useNavigate();

    return <AuthPage preBuiltUIList={[PasswordlessPreBuiltUI]} factors={["otp-phone"]} navigate={navigate} />;
};

Updated styles

Some parts of our default styles have been changed, including some changes to the data-supertokens props added to elements. Since customizations can take many forms we cannot give you exact guidance on how/what needs to change. In almost all cases, no updates should be required, but please check that your custom styles still work as you expect.

v0.41.1

Compare Source

Fixes

• Custom inputComponents (in sign in/up form fields) now get reference-stable callbacks.

v0.41.0

Compare Source

Breaking changes

The shouldDoInterceptionBasedOnUrl function now returns true:

• If sessionTokenBackendDomain is a valid subdomain of the URL's domain. This aligns with the behavior of browsers when sending cookies to subdomains.
• Even if the ports of the URL you are querying are different compared to the apiDomain's port ot the sessionTokenBackendDomain port (as long as the hostname is the same, or a subdomain of the sessionTokenBackendDomain): #​217

v0.40.1

Compare Source

CI changes

• Changed an internal test script to fix a dependency issue in CI

v0.40.0

Compare Source

Breaking Changes

• onFailureRedirection is no longer allowed to return relative paths.
• We now throw an error if onFailureRedirection returns the current URL or path when:
  • redirecting away from the auth page (websiteBasePath, usually /auth) when a session already exists,
  • redirecting after sign in/up,
  • redirecting after successful email verification,
  • redirecting after a successful MFA factor completion.

Changes

• We now redirect to the factor chooser screen if the MFA claim validator fails even if there is no available next factor. This will always show an access denied screen, which should help debugging.
• clearOnSubmit now only clears the field value if the request returned an error. This is because the form navigates on success, making clearing the field unnecessary (which can lead to confusing UX if the navigation takes too long).
• Fixed an issue where SessionAuth contents popped in before navigating away if a claim validator failed:
  • Now we ony set the context if onFailureRedirection returned the current URL.
  • Now we ony call the navigation function if onFailureRedirection returned something different than the current URL.
• Made the name property optional in custom provider configs for usage with usesDynamicLoginMethods, where the tenant configuration is expected to set the name dynamically.
  • Note, that not setting the name will make the UI crash if the usesDynamicLoginMethods is set to false or if the tenant configuration doesn't include a provider list.

---

Configuration

📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 Automerge: Enabled.

♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

🔕 Ignore: Close this PR and you won't be reminded about these updates again.

---

• If you want to rebase/retry this PR, check this box

---

This PR was generated by Mend Renovate. View the repository job log.

[replay-io]

Status	Complete ↗︎
Commit	42cc501
Results	✅ 23 Passed check favicon.png (Replay 1, Replay 2, Replay 3, Replay 4) check robots.txt (Replay 1, Replay 2, Replay 3, Replay 4) Check that a specific blog post is prerendered (Replay 1, Replay 2, Replay 3) Check that about is prerendered Check that homepage is prerendered (Replay 1, Replay 2) Check that meta-tags are rendering the correct dynamic data Check that rehydration works for page not wrapped in Set (Replay 1, Replay 2, Replay 3) Check that rehydration works for page with Cell in Set (Replay 1, Replay 2, Replay 3) Check that rehydration works for page with code split chunks (Replay 1, Replay 2, Replay 3) Check that you can navigate from home page to specific blog post (Replay 1, Replay 2, Replay 3) Fragments (Replay 1, Replay 2) Loads Cell mocks when Cell is nested in another story (Replay 1, Replay 2) Loads Cell stories (Replay 1, Replay 2) Loads MDX Stories (Replay 1, Replay 2) Mocks current user, and updates UI while dev server is running (Replay 1, Replay 2) prerender with broken gql query RBAC: Admin user should be able to delete contacts (Replay 1, Replay 2) RBAC: Should not be able to delete contact as non-admin user (Replay 1, Replay 2, Replay 3, Replay 4, Replay 5, Replay 6, Replay 7, Replay 8) requireAuth graphql checks (Replay 1, Replay 2) Smoke test with dev server (Replay 1, Replay 2) Smoke test with rw serve (Replay 1, Replay 2) useAuth hook, auth redirects checks (Replay 1, Replay 2, Replay 3, Replay 4) Waterfall prerendering (nested cells)