@stytch/vanilla-js 5.17.2 → 5.18.0

package/dist/ui/b2b/GlobalContextProvider.d.ts

@@ -1,84 +1,8 @@
 import React from 'react';
 import { StytchB2BUIClient } from '../../b2b/StytchB2BUIClient';
-import { StringLiteralFromEnum } from '@stytch/core';
-import { AuthFlowType, Callbacks, DiscoveredOrganization, OrganizationBySlugMatch, PrimaryRequired, SSOActiveConnection, StytchB2BUIConfig, StytchProjectConfigurationInput } from '@stytch/core/public';
-import { MfaState } from './MfaState';
+import { Callbacks, StytchB2BUIConfig, StytchProjectConfigurationInput } from '@stytch/core/public';
 import { Action } from './reducer';
-export declare enum AppScreens {
-    Main = "Main",
-    EmailConfirmation = "Email Confirmation",
-    LoggedIn = "Logged In",
-    Discovery = "Discovery",
-    Error = "Error",
-    PasswordEmailForm = "Password Email",
-    PasswordAuthenticate = "Password Authenticate",
-    PasswordResetForm = "Password Reset Form",
-    PasswordResetVerifyConfirmation = "Password Reset Verify Confirmation",
-    PasswordForgotForm = "Password Forgot Form",
-    PasswordSetNewConfirmation = "Password Set New Confirmation",
-    MFAEnrollmentSelection = "MFA Enrollment Selection",
-    RecoveryCodeEntry = "Recovery Code Entry",
-    RecoveryCodeSave = "Recovery Code Save",
-    SMSOTPEnrollment = "SMS OTP Enrollment",
-    SMSOTPEntry = "SMS OTP Entry",
-    TOTPEnrollmentManual = "TOTP Enrollment Manual",
-    TOTPEnrollmentQRCode = "TOTP Enrollment QR Code",
-    TOTPEntry = "TOTP Entry",
-    EmailMethodSelection = "Email Method Selection",
-    EmailOTPEntry = "Email OTP Entry",
-    SSODiscoveryEmail = "SSO Discovery Email",
-    SSODiscoveryFallback = "SSO Discovery Fallback",
-    SSODiscoveryMenu = "SSO Discovery Menu",
-    IDPConsent = "IDP Consent"
-}
-export declare enum ErrorType {
-    Default = 0,
-    EmailMagicLink = 1,
-    Organization = 2,
-    CannotJoinOrgDueToAuthPolicy = 3,
-    AdBlockerDetected = 4
-}
-export type EmailState = {
-    userSuppliedEmail: string;
-};
-export type DiscoveryState = {
-    email: string;
-    discoveredOrganizations: DiscoveredOrganization[];
-};
-export type PasswordState = {
-    email: string;
-};
-export type OtpState = {
-    codeExpiration: Date | null;
-};
-export type SSODiscoveryState = {
-    connections: SSOActiveConnection[];
-};
-export type FormState = {
-    emailState: EmailState;
-    discoveryState: DiscoveryState;
-    passwordState: PasswordState;
-    otpState: OtpState;
-    ssoDiscoveryState: SSODiscoveryState;
-};
-export type FlowState = {
-    type: StringLiteralFromEnum<AuthFlowType>;
-    organization: null | OrganizationBySlugMatch;
-};
-type PrimaryAuthState = {
-    primaryAuthMethods?: PrimaryRequired['allowed_auth_methods'];
-    email?: string;
-    emailVerified?: boolean;
-};
-export type AppState = {
-    screen: AppScreens;
-    screenHistory: AppScreens[];
-    formState: FormState;
-    flowState: FlowState;
-    mfa: MfaState;
-    primary: PrimaryAuthState;
-    errorType: ErrorType;
-};
+import { AppState } from './types/AppState';
 export type AppContext<TProjectConfiguration extends StytchProjectConfigurationInput> = {
     client: StytchB2BUIClient<TProjectConfiguration>;
     config: StytchB2BUIConfig;
@@ -102,4 +26,3 @@ export declare const useGlobalReducer: () => [AppState, React.Dispatch<Action>];
 export declare const useConfig: () => StytchB2BUIConfig;
 export declare const useErrorCallback: () => (error: import("@stytch/core/public").StytchSDKUIError) => void;
 export declare const useEventCallback: () => (event: import("@stytch/core/public").StytchEvent<Partial<import("@stytch/core/public").StytchProjectConfiguration>>) => void;
-export {};

package/dist/ui/b2b/MfaState.d.ts

@@ -1,6 +1,6 @@
 import { B2BMFAProducts } from '@stytch/core/public';
 import { CountryCode } from '@stytch/core';
-import { AppScreens } from './GlobalContextProvider';
+import { AppScreens } from './types/AppScreens';
 export interface MfaState {
     primaryInfo: {
         enrolledMfaMethods: B2BMFAProducts[];

package/dist/ui/b2b/generateProductComponentsOrdering.d.ts

@@ -1,6 +1,6 @@
 import { StringLiteralFromEnum } from '@stytch/core';
 import { B2BProducts } from '@stytch/core/public';
-import { FlowState } from './GlobalContextProvider';
+import { FlowState } from './types/AppState';
 export declare enum Component {
     EmailForm = "EmailForm",
     EmailDiscoveryForm = "EmailDiscoveryForm",

package/dist/ui/b2b/mfa.d.ts

@@ -1,7 +1,7 @@
 import { CountryCode, StringLiteralFromEnum } from '@stytch/core';
 import { B2BAuthenticateResponseWithMFA, B2BMFAProducts, B2BSMSSendResponse, B2BTOTPCreateResponse, StytchProjectConfigurationInput } from '@stytch/core/public';
 import { Optional } from '../../utils/Optional';
-import { AppState } from './GlobalContextProvider';
+import { AppState } from './types/AppState';
 type PrimaryAuthenticateSuccessAction = {
     type: 'primary_authenticate_success';
     response: B2BAuthenticateResponseWithMFA<StytchProjectConfigurationInput>;

package/dist/ui/b2b/reducer.d.ts

@@ -1,5 +1,7 @@
 import { DiscoveredOrganization, OrganizationBySlugMatch, SSOActiveConnection } from '@stytch/core/public';
-import { AppScreens, AppState, ErrorType } from './GlobalContextProvider';
+import { AppState } from './types/AppState';
+import { ErrorType } from './types/ErrorType';
+import { AppScreens } from './types/AppScreens';
 import { MfaAction } from './mfa';
 export type Action = {
     type: 'transition';

package/dist/ui/b2b/types/AppScreens.d.ts

@@ -0,0 +1,27 @@
+export declare enum AppScreens {
+    Main = "Main",
+    EmailConfirmation = "Email Confirmation",
+    LoggedIn = "Logged In",
+    Discovery = "Discovery",
+    Error = "Error",
+    PasswordEmailForm = "Password Email",
+    PasswordAuthenticate = "Password Authenticate",
+    PasswordResetForm = "Password Reset Form",
+    PasswordResetVerifyConfirmation = "Password Reset Verify Confirmation",
+    PasswordForgotForm = "Password Forgot Form",
+    PasswordSetNewConfirmation = "Password Set New Confirmation",
+    MFAEnrollmentSelection = "MFA Enrollment Selection",
+    RecoveryCodeEntry = "Recovery Code Entry",
+    RecoveryCodeSave = "Recovery Code Save",
+    SMSOTPEnrollment = "SMS OTP Enrollment",
+    SMSOTPEntry = "SMS OTP Entry",
+    TOTPEnrollmentManual = "TOTP Enrollment Manual",
+    TOTPEnrollmentQRCode = "TOTP Enrollment QR Code",
+    TOTPEntry = "TOTP Entry",
+    EmailMethodSelection = "Email Method Selection",
+    EmailOTPEntry = "Email OTP Entry",
+    SSODiscoveryEmail = "SSO Discovery Email",
+    SSODiscoveryFallback = "SSO Discovery Fallback",
+    SSODiscoveryMenu = "SSO Discovery Menu",
+    IDPConsent = "IDP Consent"
+}

package/dist/ui/b2b/types/AppState.d.ts

@@ -0,0 +1,47 @@
+import { StringLiteralFromEnum } from '@stytch/core';
+import { AuthFlowType, DiscoveredOrganization, OrganizationBySlugMatch, PrimaryRequired, SSOActiveConnection } from '@stytch/core/public';
+import { MfaState } from '../MfaState';
+import { AppScreens } from './AppScreens';
+import { ErrorType } from './ErrorType';
+export type EmailState = {
+    userSuppliedEmail: string;
+};
+export type DiscoveryState = {
+    email: string;
+    discoveredOrganizations: DiscoveredOrganization[];
+};
+export type PasswordState = {
+    email: string;
+};
+export type OtpState = {
+    codeExpiration: Date | null;
+};
+export type SSODiscoveryState = {
+    connections: SSOActiveConnection[];
+};
+export type FormState = {
+    emailState: EmailState;
+    discoveryState: DiscoveryState;
+    passwordState: PasswordState;
+    otpState: OtpState;
+    ssoDiscoveryState: SSODiscoveryState;
+};
+export type FlowState = {
+    type: StringLiteralFromEnum<AuthFlowType>;
+    organization: null | OrganizationBySlugMatch;
+};
+type PrimaryAuthState = {
+    primaryAuthMethods?: PrimaryRequired['allowed_auth_methods'];
+    email?: string;
+    emailVerified?: boolean;
+};
+export type AppState = {
+    screen: AppScreens;
+    screenHistory: AppScreens[];
+    formState: FormState;
+    flowState: FlowState;
+    mfa: MfaState;
+    primary: PrimaryAuthState;
+    errorType: ErrorType;
+};
+export {};

package/dist/ui/b2b/types/ErrorType.d.ts

@@ -0,0 +1,7 @@
+export declare enum ErrorType {
+    Default = 0,
+    EmailMagicLink = 1,
+    Organization = 2,
+    CannotJoinOrgDueToAuthPolicy = 3,
+    AdBlockerDetected = 4
+}

package/dist/ui/components/Confirmation.d.ts

@@ -1,2 +1,7 @@
 import * as React from 'react';
-export declare const Confirmation: () => React.JSX.Element;
+type ConfirmationProps = {
+    header?: string;
+    text?: string;
+};
+export declare const Confirmation: ({ header, text }: ConfirmationProps) => React.JSX.Element;
+export {};

package/dist/ui/components/IDPConsent.d.ts

@@ -1,4 +1,5 @@
 import React, { PropsWithChildren } from 'react';
+import { OAuthAuthorizeParams } from '../../utils/idpHelpers';
 import { OAuthAuthorizeStartOptions, OAuthAuthorizeStartResponse, OAuthAuthorizeSubmitOptions, OIDCClientPublic } from '../../IDPClient';
 import { BootstrapData } from '@stytch/core';
 import { StytchEvent, StytchSDKUIError } from '@stytch/core/public';
@@ -19,7 +20,9 @@ interface IDPConsentState {
         consent_granted: boolean;
     }): Promise<void>;
 }
-export declare const useIDPState: ({ oauthAuthorizeStart, oauthAuthorizeSubmit, onError, onEvent, }: {
+export declare const useIDPState: ({ initialError, initialParams, oauthAuthorizeStart, oauthAuthorizeSubmit, onError, onEvent, }: {
+    initialError: string | null;
+    initialParams: OAuthAuthorizeParams;
     oauthAuthorizeStart(data: OAuthAuthorizeStartOptions): Promise<OAuthAuthorizeStartResponse & {
         grantable_scope: string;
         ungrantable_scope: string;

package/dist/ui/components/IDPLogout.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import { OAuthLogoutParams } from '../../utils/idpHelpers';
+import { OAuthLogoutStartOptions, OAuthLogoutStartResponse } from '../../IDPClient';
+import { StytchSDKUIError } from '@stytch/core/public';
+import { BootstrapData } from '@stytch/core';
+type LogoutState = {
+    loading: boolean;
+    preflight: boolean;
+    error: string | null;
+    denied: boolean;
+    consent_required: boolean;
+    redirect_uri: string;
+};
+interface IDPLogoutState {
+    state: LogoutState;
+    submit({ consent_granted }: {
+        consent_granted: boolean;
+    }): Promise<void>;
+}
+export declare const useLogoutState: ({ initialError, initialParams, oauthLogoutStart, revokeSession, onError, }: {
+    initialError: string | null;
+    initialParams: OAuthLogoutParams;
+    oauthLogoutStart(data: OAuthLogoutStartOptions): Promise<OAuthLogoutStartResponse>;
+    revokeSession(): Promise<unknown>;
+    onError(error: StytchSDKUIError): void;
+}) => IDPLogoutState;
+type Props = IDPLogoutState & {
+    bootstrap: BootstrapData;
+    bootstrapNotLoaded: boolean;
+};
+export declare const IDPLogout: ({ state, submit, bootstrap, bootstrapNotLoaded }: Props) => React.JSX.Element;
+export {};

package/dist/utils/idpHelpers.d.ts

@@ -11,7 +11,7 @@ export declare const fallbackConsentManifestGenerator: ({ scopes, clientName, rb
     header: string;
     items: IDPConsentItem[];
 }[];
-export type IDPSearchParams = {
+export type OAuthAuthorizeParams = {
     client_id: string;
     redirect_uri: string;
     response_type: string;
@@ -20,7 +20,31 @@ export type IDPSearchParams = {
     state?: string;
     nonce?: string;
 };
-export declare const parseOAuthAuthorizeParams: (searchParams: string) => {
+export type OAuthLogoutParams = {
+    client_id: string;
+    post_logout_redirect_uri: string;
+    id_token_hint?: string;
+    state?: string;
+};
+export type IDPFlowParams = {
+    type: 'Authorize';
+    params: OAuthAuthorizeParams;
+} | {
+    type: 'Logout';
+    params: OAuthLogoutParams;
+};
+export declare const parseOAuthAuthorizeParams: (params: URLSearchParams) => {
+    error: string | null;
+    result: OAuthAuthorizeParams;
+};
+export declare const parseOAuthLogoutParams: (params: URLSearchParams) => {
+    error: string | null;
+    result: OAuthLogoutParams;
+};
+/**
+ * Parse generic IDP parameters and determine if it is an Authorize or Logout request.
+ */
+export declare const parseIDPParams: (searchParams: string) => {
     error: string | null;
-    params: IDPSearchParams;
+    flow: IDPFlowParams;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stytch/vanilla-js",
-  "version": "5.17.2",
+  "version": "5.18.0",
   "description": "Stytch's official Javascript Client Library",
   "main": "./dist/index.js",
   "module": "./dist/index.esm.js",
@@ -62,15 +62,15 @@
     "@rollup/plugin-node-resolve": "15.2.3",
     "@rollup/plugin-replace": "5.0.5",
     "@rollup/plugin-typescript": "11.1.6",
-    "@storybook/addon-essentials": "8.3.2",
-    "@storybook/addon-interactions": "8.3.2",
-    "@storybook/addon-links": "8.3.2",
-    "@storybook/addon-themes": "8.3.2",
-    "@storybook/blocks": "8.3.2",
-    "@storybook/preact": "8.3.2",
-    "@storybook/preact-vite": "8.3.2",
-    "@storybook/test": "8.3.2",
-    "@storybook/test-runner": "0.19.1",
+    "@storybook/addon-essentials": "8.5.8",
+    "@storybook/addon-interactions": "8.5.8",
+    "@storybook/addon-links": "8.5.8",
+    "@storybook/addon-themes": "8.5.8",
+    "@storybook/blocks": "8.5.8",
+    "@storybook/preact": "8.5.8",
+    "@storybook/preact-vite": "8.5.8",
+    "@storybook/test": "8.5.8",
+    "@storybook/test-runner": "0.21.2",
     "@stytch/js-utils": "0.0.0",
     "@testing-library/preact": "3.2.4",
     "@testing-library/user-event": "14.2.1",
@@ -100,12 +100,12 @@
     "react-test-renderer": "17.0.0",
     "rollup": "4.22.4",
     "rollup-plugin-sizes": "1.0.6",
-    "storybook": "8.3.2",
+    "storybook": "8.5.8",
     "styled-components": "5.3.5",
     "swr": "2.1.1",
     "typescript": "5.3.3",
     "uuid": "8.3.2",
-    "vite": "5.4.12",
+    "vite": "6.1.1",
     "wait-on": "7.2.0"
   },
   "homepage": "https://stytch.com/docs/sdks/javascript-sdk",