@stytch/react 19.4.3 → 19.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stytch/react",
-  "version": "19.4.3",
+  "version": "19.5.0",
   "description": "Stytch's official React Library",
   "main": "./dist/index.js",
   "module": "./dist/index.esm.js",
@@ -32,10 +32,12 @@
     "user"
   ],
   "devDependencies": {
-    "@babel/runtime": "7.26.10",
+    "@babel/runtime": "7.27.0",
+    "@stytch/internal-react-shared": "0.0.0",
+    "@stytch/internal-test-utils": "0.0.0",
     "@stytch/internal-tsconfigs": "0.0.0",
     "@stytch/js-utils": "0.0.1",
-    "@stytch/vanilla-js": "5.22.1",
+    "@stytch/vanilla-js": "5.22.7",
     "@testing-library/react": "14.0.0",
     "@types/jest": "29.5.14",
     "eslint-config-custom": "0.0.1",

package/dist/StytchB2BContext-081081ee.d.ts

@@ -1,165 +0,0 @@
-/// <reference types="react" />
-import React from 'react';
-import { ReactNode } from "react";
-import { Member, MemberSession, Organization, StytchB2BUIClient } from '@stytch/vanilla-js/b2b';
-import { StytchB2BHeadlessClient, StytchProjectConfigurationInput } from '@stytch/vanilla-js/b2b/headless';
-import { PermissionsMap } from '@stytch/core/public';
-/**
- * The Stytch Client object passed in to <StytchProvider /> in your application root.
- */
-type StytchB2BClient<TProjectConfiguration extends StytchProjectConfigurationInput> = StytchB2BHeadlessClient<TProjectConfiguration> | StytchB2BUIClient<TProjectConfiguration>;
-type SWRMember = {
-    /**
-     * Either the active {@link Member} object, or null if the member is not logged in.
-     */
-    member: Member | null;
-    /**
-     * If true, indicates that the value returned is from the application cache and a state refresh is in progress.
-     */
-    fromCache: boolean;
-};
-type SWRMemberSession = {
-    /**
-     * Either the active {@link MemberSession} object, or null if the member is not logged in.
-     */
-    session: MemberSession | null;
-    /**
-     * If true, indicates that the value returned is from the application cache and a state refresh is in progress.
-     */
-    fromCache: boolean;
-};
-type SWROrganization = {
-    /**
-     * Either the active {@link Organization} object, or null if the member is not logged in.
-     */
-    organization: Organization | null;
-    /**
-     * If true, indicates that the value returned is from the application cache and a state refresh is in progress.
-     */
-    fromCache: boolean;
-};
-declare const useIsMounted__INTERNAL: () => boolean;
-declare const isUIClient: <TProjectConfiguration extends Partial<import("@stytch/core/public").StytchProjectConfiguration>>(client: StytchB2BClient<TProjectConfiguration>) => client is StytchB2BUIClient<TProjectConfiguration>;
-/**
- * Returns the active Member.
- * Check the fromCache property to determine if the member data is from persistent storage.
- * @example
- * const {member} = useStytchMember();
- * return (<h1>Welcome, {member.name}</h1>);
- * @returns A {@link SWRUser}
- */
-declare const useStytchMember: () => SWRMember;
-/**
- * Returns the active member's Stytch member session.
- * @example
- * const { session } = useStytchMemberSession();
- * useEffect(() => {
- *   if (!session) {
- *     router.replace('/login')
- *   }
- * }, [session]);
- * @returns A {@link SWRMemberSession}
- */
-declare const useStytchMemberSession: () => SWRMemberSession;
-/**
- * Returns the active Stytch organization.
- * @example
- * const { organization } = useStytchOrganization();
- * return organization ? <p>Welcome to {organization.organization_name}</p> : <p>Log in to continue!</p>;
- * @returns A {@link SWROrganization}
- */
-declare const useStytchOrganization: () => SWROrganization;
-type SWRIsAuthorized = {
-    /**
-     * Whether the logged-in member is allowed to perform the specified action on the specified resource.
-     */
-    isAuthorized: boolean;
-    /**
-     * If true, indicates that the value returned is from the application cache and a state refresh is in progress.
-     */
-    fromCache: boolean;
-};
-/**
- * Determines whether the logged-in member is allowed to perform the specified action on the specified resource.
- * Returns `true` if the member can perform the action, `false` otherwise.
- *
- * If the member is not logged in, this method will always return false.
- * If the resource or action provided are not valid for the configured RBAC policy, this method will return false.
- *
- * Remember - authorization checks for sensitive actions should always occur on the backend as well.
- * @example
- * const isAuthorized = useStytchIsAuthorized<Permissions>('documents', 'edit');
- * return <button disabled={!isAuthorized}>Edit</button>
- */
-declare const useStytchIsAuthorized: (resourceId: string, action: string) => SWRIsAuthorized;
-/**
- * Returns the Stytch B2B client stored in the Stytch context.
- *
- * @example
- * const stytch = useStytchB2BClient();
- * useEffect(() => {
- *   stytch.magicLinks.authenticate('...')
- * }, [stytch]);
- */
-declare const useStytchB2BClient: <TProjectConfiguration extends Partial<import("@stytch/core/public").StytchProjectConfiguration> = Stytch.DefaultProjectConfiguration>() => StytchB2BHeadlessClient<TProjectConfiguration>;
-declare const withStytchB2BClient: <T extends object, TProjectConfiguration extends Partial<import("@stytch/core/public").StytchProjectConfiguration>>(Component: React.ComponentType<T & {
-    stytch: StytchB2BHeadlessClient<TProjectConfiguration>;
-}>) => React.ComponentType<T>;
-declare const withStytchMember: <T extends object>(Component: React.ComponentType<T & {
-    stytchMember: Member | null;
-    stytchMemberIsFromCache: boolean;
-}>) => React.ComponentType<T>;
-declare const withStytchMemberSession: <T extends object>(Component: React.ComponentType<T & {
-    stytchMemberSession: MemberSession | null;
-    stytchMemberSessionIsFromCache: boolean;
-}>) => React.ComponentType<T>;
-declare const withStytchOrganization: <T extends object>(Component: React.ComponentType<T & {
-    stytchOrganization: Organization | null;
-    stytchOrganizationIsFromCache: boolean;
-}>) => React.ComponentType<T>;
-/**
- * Wrap your component with this HOC in order to receive the permissions for the logged-in member.
- * Evaluates all permissions granted to the logged-in member.
- * Returns a Record<RoleId, Record<Action, boolean>> response indicating the member's permissions.
- * Each boolean will be `true` if the member can perform the action, `false` otherwise.
- *
- * If the member is not logged in, all values will be false.
- *
- * Remember - authorization checks for sensitive actions should always occur on the backend as well.
- * @example
- * type Permissions = {
- *   document: 'create' | 'read' | 'write
- *   image: 'create' | 'read'
- * }
- *
- * const MyComponent = (props) => {
- *   const canEditDocuments = props.stytchPermissions.document.edit;
- *   const canReadImages = props.stytchPermissions.image.read;
- * }
- * return withStytchPermissions<Permissions>(MyComponent)
- */
-declare const withStytchPermissions: <Permissions_1 extends Record<string, string>, T extends object>(Component: React.ComponentType<T & {
-    stytchPermissions: PermissionsMap<Permissions_1>;
-}>) => React.ComponentType<T>;
-type StytchB2BProviderProps<TProjectConfiguration extends StytchProjectConfigurationInput = Stytch.DefaultProjectConfiguration> = {
-    /**
-     * A Stytch client instance {@link StytchB2BHeadlessClient}
-     */
-    stytch: StytchB2BClient<TProjectConfiguration>;
-    children?: ReactNode;
-};
-/**
- * The Stytch Context Provider.
- * Wrap your application with this component in the root file in order to use Stytch everywhere in your app.
- * @example
- * const stytch = new StytchB2BHeadlessClient('public-token-<find yours in the stytch dashboard>')
- *
- * ReactDOM.render(
- *   <StytchB2BProvider stytch={stytch}>
- *     <App />
- *   </StytchProvider>,
- *   document.getElementById('root'),
- * )
- */
-declare const StytchB2BProvider: <TProjectConfiguration extends Partial<import("@stytch/core/public").StytchProjectConfiguration> = Stytch.DefaultProjectConfiguration>({ stytch, children, }: StytchB2BProviderProps<TProjectConfiguration>) => JSX.Element;
-export { useIsMounted__INTERNAL, isUIClient, useStytchMember, useStytchMemberSession, useStytchOrganization, useStytchIsAuthorized, useStytchB2BClient, withStytchB2BClient, withStytchMember, withStytchMemberSession, withStytchOrganization, withStytchPermissions, StytchB2BProviderProps, StytchB2BProvider };

package/dist/StytchB2BContext-865b6947.d.ts

@@ -1,165 +0,0 @@
-/// <reference types="react" />
-import React from 'react';
-import { ReactNode } from "react";
-import { Member, MemberSession, Organization, StytchB2BUIClient } from '@stytch/vanilla-js/b2b';
-import { StytchB2BHeadlessClient, StytchProjectConfigurationInput } from '@stytch/vanilla-js/b2b/headless';
-import { PermissionsMap } from '@stytch/core/public';
-/**
- * The Stytch Client object passed in to <StytchProvider /> in your application root.
- */
-type StytchB2BClient<TProjectConfiguration extends StytchProjectConfigurationInput> = StytchB2BHeadlessClient<TProjectConfiguration> | StytchB2BUIClient<TProjectConfiguration>;
-type SWRMember = {
-    /**
-     * Either the active {@link Member} object, or null if the member is not logged in.
-     */
-    member: Member | null;
-    /**
-     * If true, indicates that the value returned is from the application cache and a state refresh is in progress.
-     */
-    fromCache: boolean;
-};
-type SWRMemberSession = {
-    /**
-     * Either the active {@link MemberSession} object, or null if the member is not logged in.
-     */
-    session: MemberSession | null;
-    /**
-     * If true, indicates that the value returned is from the application cache and a state refresh is in progress.
-     */
-    fromCache: boolean;
-};
-type SWROrganization = {
-    /**
-     * Either the active {@link Organization} object, or null if the member is not logged in.
-     */
-    organization: Organization | null;
-    /**
-     * If true, indicates that the value returned is from the application cache and a state refresh is in progress.
-     */
-    fromCache: boolean;
-};
-declare const useIsMounted__INTERNAL: () => boolean;
-declare const isUIClient: <TProjectConfiguration extends Partial<import("@stytch/core/public").StytchProjectConfiguration>>(client: StytchB2BClient<TProjectConfiguration>) => client is StytchB2BUIClient<TProjectConfiguration>;
-/**
- * Returns the active Member.
- * Check the fromCache property to determine if the member data is from persistent storage.
- * @example
- * const {member} = useStytchMember();
- * return (<h1>Welcome, {member.name}</h1>);
- * @returns A {@link SWRUser}
- */
-declare const useStytchMember: () => SWRMember;
-/**
- * Returns the active member's Stytch member session.
- * @example
- * const { session } = useStytchMemberSession();
- * useEffect(() => {
- *   if (!session) {
- *     router.replace('/login')
- *   }
- * }, [session]);
- * @returns A {@link SWRMemberSession}
- */
-declare const useStytchMemberSession: () => SWRMemberSession;
-/**
- * Returns the active Stytch organization.
- * @example
- * const { organization } = useStytchOrganization();
- * return organization ? <p>Welcome to {organization.organization_name}</p> : <p>Log in to continue!</p>;
- * @returns A {@link SWROrganization}
- */
-declare const useStytchOrganization: () => SWROrganization;
-type SWRIsAuthorized = {
-    /**
-     * Whether the logged-in member is allowed to perform the specified action on the specified resource.
-     */
-    isAuthorized: boolean;
-    /**
-     * If true, indicates that the value returned is from the application cache and a state refresh is in progress.
-     */
-    fromCache: boolean;
-};
-/**
- * Determines whether the logged-in member is allowed to perform the specified action on the specified resource.
- * Returns `true` if the member can perform the action, `false` otherwise.
- *
- * If the member is not logged in, this method will always return false.
- * If the resource or action provided are not valid for the configured RBAC policy, this method will return false.
- *
- * Remember - authorization checks for sensitive actions should always occur on the backend as well.
- * @example
- * const isAuthorized = useStytchIsAuthorized<Permissions>('documents', 'edit');
- * return <button disabled={!isAuthorized}>Edit</button>
- */
-declare const useStytchIsAuthorized: (resourceId: string, action: string) => SWRIsAuthorized;
-/**
- * Returns the Stytch B2B client stored in the Stytch context.
- *
- * @example
- * const stytch = useStytchB2BClient();
- * useEffect(() => {
- *   stytch.magicLinks.authenticate('...')
- * }, [stytch]);
- */
-declare const useStytchB2BClient: <TProjectConfiguration extends Partial<import("@stytch/core/public").StytchProjectConfiguration> = Stytch.DefaultProjectConfiguration>() => StytchB2BHeadlessClient<TProjectConfiguration>;
-declare const withStytchB2BClient: <T extends object, TProjectConfiguration extends Partial<import("@stytch/core/public").StytchProjectConfiguration>>(Component: React.ComponentType<T & {
-    stytch: StytchB2BHeadlessClient<TProjectConfiguration>;
-}>) => React.ComponentType<T>;
-declare const withStytchMember: <T extends object>(Component: React.ComponentType<T & {
-    stytchMember: Member | null;
-    stytchMemberIsFromCache: boolean;
-}>) => React.ComponentType<T>;
-declare const withStytchMemberSession: <T extends object>(Component: React.ComponentType<T & {
-    stytchMemberSession: MemberSession | null;
-    stytchMemberSessionIsFromCache: boolean;
-}>) => React.ComponentType<T>;
-declare const withStytchOrganization: <T extends object>(Component: React.ComponentType<T & {
-    stytchOrganization: Organization | null;
-    stytchOrganizationIsFromCache: boolean;
-}>) => React.ComponentType<T>;
-/**
- * Wrap your component with this HOC in order to receive the permissions for the logged-in member.
- * Evaluates all permissions granted to the logged-in member.
- * Returns a Record<RoleId, Record<Action, boolean>> response indicating the member's permissions.
- * Each boolean will be `true` if the member can perform the action, `false` otherwise.
- *
- * If the member is not logged in, all values will be false.
- *
- * Remember - authorization checks for sensitive actions should always occur on the backend as well.
- * @example
- * type Permissions = {
- *   document: 'create' | 'read' | 'write
- *   image: 'create' | 'read'
- * }
- *
- * const MyComponent = (props) => {
- *   const canEditDocuments = props.stytchPermissions.document.edit;
- *   const canReadImages = props.stytchPermissions.image.read;
- * }
- * return withStytchPermissions<Permissions>(MyComponent)
- */
-declare const withStytchPermissions: <Permissions_1 extends Record<string, string>, T extends object>(Component: React.ComponentType<T & {
-    stytchPermissions: PermissionsMap<Permissions_1>;
-}>) => React.ComponentType<T>;
-type StytchB2BProviderProps<TProjectConfiguration extends StytchProjectConfigurationInput = Stytch.DefaultProjectConfiguration> = {
-    /**
-     * A Stytch client instance {@link StytchB2BHeadlessClient}
-     */
-    stytch: StytchB2BClient<TProjectConfiguration>;
-    children?: ReactNode;
-};
-/**
- * The Stytch Context Provider.
- * Wrap your application with this component in the root file in order to use Stytch everywhere in your app.
- * @example
- * const stytch = new StytchB2BHeadlessClient('public-token-<find yours in the stytch dashboard>')
- *
- * ReactDOM.render(
- *   <StytchB2BProvider stytch={stytch}>
- *     <App />
- *   </StytchProvider>,
- *   document.getElementById('root'),
- * )
- */
-declare const StytchB2BProvider: <TProjectConfiguration extends Partial<import("@stytch/core/public").StytchProjectConfiguration> = Stytch.DefaultProjectConfiguration>({ stytch, children, }: StytchB2BProviderProps<TProjectConfiguration>) => JSX.Element;
-export { useIsMounted__INTERNAL, isUIClient, useStytchMember, useStytchMemberSession, useStytchOrganization, useStytchIsAuthorized, useStytchB2BClient, withStytchB2BClient, withStytchMember, withStytchMemberSession, withStytchOrganization, withStytchPermissions, StytchB2BProviderProps, StytchB2BProvider };

package/dist/StytchB2BContext-865b6947.js

@@ -1,235 +0,0 @@
-'use strict';
-
-var React = require('react');
-var invariant = require('./invariant-ae5a5bce.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-const initialMember = {
-    member: null,
-    fromCache: false,
-};
-const initialMemberSession = {
-    session: null,
-    fromCache: false,
-};
-const initialOrganization = {
-    organization: null,
-    fromCache: false,
-};
-const StytchB2BContext = React.createContext({ isMounted: false });
-const StytchMemberContext = React.createContext(initialMember);
-const StytchMemberSessionContext = React.createContext(initialMemberSession);
-const StytchOrganizationContext = React.createContext(initialOrganization);
-const useIsMounted__INTERNAL = () => React.useContext(StytchB2BContext).isMounted;
-const isUIClient = (client) => {
-    return client.mount !== undefined;
-};
-/**
- * Returns the active Member.
- * Check the fromCache property to determine if the member data is from persistent storage.
- * @example
- * const {member} = useStytchMember();
- * return (<h1>Welcome, {member.name}</h1>);
- * @returns A {@link SWRUser}
- */
-const useStytchMember = () => {
-    invariant.invariant(useIsMounted__INTERNAL(), invariant.noProviderError('useStytchMember', 'StytchB2BProvider'));
-    return React.useContext(StytchMemberContext);
-};
-/**
- * Returns the active member's Stytch member session.
- * @example
- * const { session } = useStytchMemberSession();
- * useEffect(() => {
- *   if (!session) {
- *     router.replace('/login')
- *   }
- * }, [session]);
- * @returns A {@link SWRMemberSession}
- */
-const useStytchMemberSession = () => {
-    invariant.invariant(useIsMounted__INTERNAL(), invariant.noProviderError('useStytchMemberSession', 'StytchB2BProvider'));
-    return React.useContext(StytchMemberSessionContext);
-};
-/**
- * Returns the active Stytch organization.
- * @example
- * const { organization } = useStytchOrganization();
- * return organization ? <p>Welcome to {organization.organization_name}</p> : <p>Log in to continue!</p>;
- * @returns A {@link SWROrganization}
- */
-const useStytchOrganization = () => {
-    invariant.invariant(useIsMounted__INTERNAL(), invariant.noProviderError('useStytchOrganization', 'StytchB2BProvider'));
-    return React.useContext(StytchOrganizationContext);
-};
-/**
- * Determines whether the logged-in member is allowed to perform the specified action on the specified resource.
- * Returns `true` if the member can perform the action, `false` otherwise.
- *
- * If the member is not logged in, this method will always return false.
- * If the resource or action provided are not valid for the configured RBAC policy, this method will return false.
- *
- * Remember - authorization checks for sensitive actions should always occur on the backend as well.
- * @example
- * const isAuthorized = useStytchIsAuthorized<Permissions>('documents', 'edit');
- * return <button disabled={!isAuthorized}>Edit</button>
- */
-const useStytchIsAuthorized = (resourceId, action) => {
-    invariant.invariant(useIsMounted__INTERNAL(), invariant.noProviderError('useStytchIsAuthorized', 'StytchB2BProvider'));
-    const client = useStytchB2BClient();
-    const { session } = useStytchMemberSession();
-    const [isAuthorized, setIsAuthorized] = invariant.useAsyncState({
-        fromCache: true,
-        isAuthorized: client.rbac.isAuthorizedSync(resourceId, action),
-    });
-    React.useEffect(() => {
-        client.rbac.isAuthorized(resourceId, action).then((isAuthorized) => setIsAuthorized({
-            fromCache: false,
-            isAuthorized,
-        }));
-    }, [client, session === null || session === void 0 ? void 0 : session.roles, resourceId, action, setIsAuthorized]);
-    return isAuthorized;
-};
-/**
- * Returns the Stytch B2B client stored in the Stytch context.
- *
- * @example
- * const stytch = useStytchB2BClient();
- * useEffect(() => {
- *   stytch.magicLinks.authenticate('...')
- * }, [stytch]);
- */
-const useStytchB2BClient = () => {
-    const ctx = React.useContext(StytchB2BContext);
-    invariant.invariant(ctx.isMounted, invariant.noProviderError('useStytchB2BClient', 'StytchB2BProvider'));
-    return ctx.client;
-};
-const withStytchB2BClient = (Component) => {
-    const WithStytch = (props) => {
-        invariant.invariant(useIsMounted__INTERNAL(), invariant.noProviderError('withStytchB2BClient', 'StytchB2BProvider'));
-        return React__default["default"].createElement(Component, Object.assign({}, props, { stytch: useStytchB2BClient() }));
-    };
-    WithStytch.displayName = `withStytch(${Component.displayName || Component.name || 'Component'})`;
-    return WithStytch;
-};
-const withStytchMember = (Component) => {
-    const WithStytchUser = (props) => {
-        invariant.invariant(useIsMounted__INTERNAL(), invariant.noProviderError('withStytchMember', 'StytchB2BProvider'));
-        const { member, fromCache } = useStytchMember();
-        return React__default["default"].createElement(Component, Object.assign({}, props, { stytchMember: member, stytchMemberIsFromCache: fromCache }));
-    };
-    WithStytchUser.displayName = `withStytchUser(${Component.displayName || Component.name || 'Component'})`;
-    return WithStytchUser;
-};
-const withStytchMemberSession = (Component) => {
-    const WithStytchSession = (props) => {
-        invariant.invariant(useIsMounted__INTERNAL(), invariant.noProviderError('withStytchMemberSession', 'StytchB2BProvider'));
-        const { session, fromCache } = useStytchMemberSession();
-        return React__default["default"].createElement(Component, Object.assign({}, props, { stytchMemberSession: session, stytchMemberSessionIsFromCache: fromCache }));
-    };
-    WithStytchSession.displayName = `withStytchSession(${Component.displayName || Component.name || 'Component'})`;
-    return WithStytchSession;
-};
-const withStytchOrganization = (Component) => {
-    const WithStytchOrganization = (props) => {
-        invariant.invariant(useIsMounted__INTERNAL(), invariant.noProviderError('withStytchOrganization', 'StytchB2BProvider'));
-        const { organization, fromCache } = useStytchOrganization();
-        return React__default["default"].createElement(Component, Object.assign({}, props, { stytchOrganization: organization, stytchOrganizationIsFromCache: fromCache }));
-    };
-    WithStytchOrganization.displayName = `withStytchOrganization(${Component.displayName || Component.name || 'Component'})`;
-    return WithStytchOrganization;
-};
-/**
- * Wrap your component with this HOC in order to receive the permissions for the logged-in member.
- * Evaluates all permissions granted to the logged-in member.
- * Returns a Record<RoleId, Record<Action, boolean>> response indicating the member's permissions.
- * Each boolean will be `true` if the member can perform the action, `false` otherwise.
- *
- * If the member is not logged in, all values will be false.
- *
- * Remember - authorization checks for sensitive actions should always occur on the backend as well.
- * @example
- * type Permissions = {
- *   document: 'create' | 'read' | 'write
- *   image: 'create' | 'read'
- * }
- *
- * const MyComponent = (props) => {
- *   const canEditDocuments = props.stytchPermissions.document.edit;
- *   const canReadImages = props.stytchPermissions.image.read;
- * }
- * return withStytchPermissions<Permissions>(MyComponent)
- */
-const withStytchPermissions = (Component) => {
-    const WithStytchPermissions = (props) => {
-        invariant.invariant(useIsMounted__INTERNAL(), invariant.noProviderError('useRBACPermissions', 'StytchB2BProvider'));
-        const client = useStytchB2BClient();
-        const { session } = useStytchMemberSession();
-        const [permissions, setPermissions] = invariant.useAsyncState({ loaded: false, value: null });
-        React.useEffect(() => {
-            client.rbac
-                .allPermissions()
-                .then((permissions) => setPermissions({ loaded: true, value: permissions }));
-        }, [client, session === null || session === void 0 ? void 0 : session.roles, setPermissions]);
-        if (!permissions.loaded) {
-            return null;
-        }
-        return React__default["default"].createElement(Component, Object.assign({}, props, { stytchPermissions: permissions.value }));
-    };
-    WithStytchPermissions.displayName = `withStytchPermissions(${Component.displayName || Component.name || 'Component'})`;
-    return WithStytchPermissions;
-};
-/**
- * The Stytch Context Provider.
- * Wrap your application with this component in the root file in order to use Stytch everywhere in your app.
- * @example
- * const stytch = new StytchB2BHeadlessClient('public-token-<find yours in the stytch dashboard>')
- *
- * ReactDOM.render(
- *   <StytchB2BProvider stytch={stytch}>
- *     <App />
- *   </StytchProvider>,
- *   document.getElementById('root'),
- * )
- */
-const StytchB2BProvider = ({ stytch, children, }) => {
-    invariant.invariant(!useIsMounted__INTERNAL(), invariant.B2BProviderMustBeUniqueError);
-    invariant.invariant(typeof window !== 'undefined', invariant.noSSRError);
-    const ctx = React.useMemo(() => ({ client: stytch, isMounted: true }), [stytch]);
-    const [{ member, session, organization }, setClientState] = invariant.useAsyncState({
-        session: stytch.session.getInfo(),
-        member: stytch.self.getInfo(),
-        organization: stytch.organization.getInfo(),
-    });
-    React.useEffect(() => stytch.onStateChange(() => {
-        setClientState((oldState) => {
-            const newState = {
-                session: stytch.session.getInfo(),
-                member: stytch.self.getInfo(),
-                organization: stytch.organization.getInfo(),
-            };
-            return invariant.mergeWithStableProps(oldState, newState);
-        });
-    }), [setClientState, stytch]);
-    return (React__default["default"].createElement(StytchB2BContext.Provider, { value: ctx },
-        React__default["default"].createElement(StytchOrganizationContext.Provider, { value: organization },
-            React__default["default"].createElement(StytchMemberContext.Provider, { value: member },
-                React__default["default"].createElement(StytchMemberSessionContext.Provider, { value: session }, children)))));
-};
-
-exports.StytchB2BProvider = StytchB2BProvider;
-exports.isUIClient = isUIClient;
-exports.useIsMounted__INTERNAL = useIsMounted__INTERNAL;
-exports.useStytchB2BClient = useStytchB2BClient;
-exports.useStytchIsAuthorized = useStytchIsAuthorized;
-exports.useStytchMember = useStytchMember;
-exports.useStytchMemberSession = useStytchMemberSession;
-exports.useStytchOrganization = useStytchOrganization;
-exports.withStytchB2BClient = withStytchB2BClient;
-exports.withStytchMember = withStytchMember;
-exports.withStytchMemberSession = withStytchMemberSession;
-exports.withStytchOrganization = withStytchOrganization;
-exports.withStytchPermissions = withStytchPermissions;

package/dist/invariant-568a7633.d.ts

@@ -1,27 +0,0 @@
-import { Dispatch, SetStateAction } from "react";
-declare const noProviderError: (item: string, provider?: string) => string;
-declare const providerMustBeUniqueError = "You cannot render a <StytchProvider> inside another <StytchProvider>.";
-declare const B2BProviderMustBeUniqueError = "You cannot render a <StytchB2BProvider> inside another <StytchB2BProvider>.";
-declare const noSSRError = "The @stytch/react library is not meant for use with serverside environments like NextJS.\nUse the @stytch/nextjs library instead - \nnpm remove @stytch/react && npm install @stytch/nextjs\n";
-declare const noHeadlessClientError = "Tried to create a Stytch Login UI element using the Stytch Headless SDK.\nYou must use the UI SDK to use UI elements.\nPlease make sure you are importing from @stytch/vanilla-js and not from the @stytch/vanilla-js/headless.";
-// useState can cause memory leaks if it is set after the component unmounted. For example, if it is
-// set after `await`, or in a `then`, `catch`, or `finally`, or in a setTimout/setInterval.
-declare const useAsyncState: <T>(initialState: T | (() => T)) => [
-    T,
-    Dispatch<SetStateAction<T>>
-];
-/**
- * Returns a version of `newValue` whose properties that are deeply equal to
- * those in `oldValue` are replaced with those from `oldValue`. This provides a
- * limited form of "structural sharing" that provides a stable reference for
- * unchanged slices of the object.
- *
- * If `oldValue` and `newValue` are referentially equal, the same value is
- * returned.
- *
- * @param oldValue The old value
- * @param newValue The new value
- */
-declare const mergeWithStableProps: <T extends Record<string, unknown>, U extends Record<string, unknown> = T>(oldValue: U, newValue: T) => T;
-declare function invariant(cond: any, message: string): asserts cond;
-export { noProviderError, providerMustBeUniqueError, B2BProviderMustBeUniqueError, noSSRError, noHeadlessClientError, useAsyncState, mergeWithStableProps, invariant };

package/dist/invariant-ae5a5bce.d.ts

@@ -1,27 +0,0 @@
-import { Dispatch, SetStateAction } from "react";
-declare const noProviderError: (item: string, provider?: string) => string;
-declare const providerMustBeUniqueError = "You cannot render a <StytchProvider> inside another <StytchProvider>.";
-declare const B2BProviderMustBeUniqueError = "You cannot render a <StytchB2BProvider> inside another <StytchB2BProvider>.";
-declare const noSSRError = "The @stytch/react library is not meant for use with serverside environments like NextJS.\nUse the @stytch/nextjs library instead - \nnpm remove @stytch/react && npm install @stytch/nextjs\n";
-declare const noHeadlessClientError = "Tried to create a Stytch Login UI element using the Stytch Headless SDK.\nYou must use the UI SDK to use UI elements.\nPlease make sure you are importing from @stytch/vanilla-js and not from the @stytch/vanilla-js/headless.";
-// useState can cause memory leaks if it is set after the component unmounted. For example, if it is
-// set after `await`, or in a `then`, `catch`, or `finally`, or in a setTimout/setInterval.
-declare const useAsyncState: <T>(initialState: T | (() => T)) => [
-    T,
-    Dispatch<SetStateAction<T>>
-];
-/**
- * Returns a version of `newValue` whose properties that are deeply equal to
- * those in `oldValue` are replaced with those from `oldValue`. This provides a
- * limited form of "structural sharing" that provides a stable reference for
- * unchanged slices of the object.
- *
- * If `oldValue` and `newValue` are referentially equal, the same value is
- * returned.
- *
- * @param oldValue The old value
- * @param newValue The new value
- */
-declare const mergeWithStableProps: <T extends Record<string, unknown>, U extends Record<string, unknown> = T>(oldValue: U, newValue: T) => T;
-declare function invariant(cond: any, message: string): asserts cond;
-export { noProviderError, providerMustBeUniqueError, B2BProviderMustBeUniqueError, noSSRError, noHeadlessClientError, useAsyncState, mergeWithStableProps, invariant };