@stytch/stytch-js

Note

This repository is no longer used for active development. Please make future PRs in the new js-sdk-turbo repository. We will continue to fix bugs and security vulnerabilities in this repository until this version of the SDK is sunsetted.

Stytch SDK as an ES Module

Use the Stytch SDK as an ES module. You might want to use this library if you want to use the SDK with a Javascript bundler, but aren't using the Stytch React library. If you want to use the SDK with plain HTML, include https://js.stytch.com/stytch.js as a source directly, like we do here.

Installation

npm install @stytch/stytch-js

Usage

loadStytch

This function returns a Promise that resolves with a newly created window.Stytch once the SDK has loaded. If you call loadStytch in a server environment - for example during server-side rendering - it will resolve to null.

import {loadStytch} from '@stytch/stytch-js';

const Stytch = await loadStytch();

Stytch('public-token-test-xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx')
  .mount({
    elementId: "#magic-link",
    loginOrSignupView: {
      products: ['emailMagicLinks', 'oauth'],
      emailMagicLinksOptions: {
        loginRedirectURL: "https://example.com/authenticate",
        loginExpirationMinutes: 30,
        signupRedirectURL: "https://example.com/authenticate",
        signupExpirationMinutes: 30,
        createUserAsPending: true,
      },
      oauthOptions: {
        providers: [{ type: 'google' }, { type: 'microsoft' }, { type: 'apple' }],
        loginRedirectURL: "https://example.com/authenticate",
        signupRedirectURL: "https://example.com/authenticate",
      }
    }
  });

For more information on how to use the Stytch SDK, please refer to the docs.

See Also

• For usage with React: see the @stytch/stytch-react library and sample app
• For usage with Next.js: see the sample app

Changelog

[2.0.3] - 2020-9-5

• Added type definitions for Apple OAuth

[2.0.2] - 2020-8-25

• Added type definitions for the OAuth product