@stytch/nextjs 12.0.0 → 13.0.0

package/dist/b2b/index.headless.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.headless.js","sourceRoot":"","sources":["../../src/b2b/index.headless.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,kEAAgD"}

package/dist/b2b/index.js

@@ -1,250 +1,14 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-const noProviderError = (item, provider = 'StytchProvider') => `${item} can only be used inside <${provider}>.`;
-const noHeadlessClientError = `Tried to create a Stytch Login UI element using the Stytch Headless SDK.
-You must use the UI SDK to use UI elements.
-Please make sure you are importing createStytchHeadlessClient from @stytch/nextjs/ui and not from @stytch/nextjs/headless.`;
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function invariant(cond, message) {
-    if (!cond)
-        throw new Error(message);
-}
-
-// 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.
-const useAsyncState = (initialState) => {
-    const isMounted = React.useRef(true);
-    const [state, setState] = React.useState(initialState);
-    React.useEffect(() => {
-        isMounted.current = true;
-        return () => {
-            isMounted.current = false;
-        };
-    }, []);
-    const setStateAction = React.useCallback((newState) => {
-        isMounted.current && setState(newState);
-    }, []);
-    return [state, setStateAction];
-};
-
-const SSRStubKey = Symbol('__stytch_SSRStubKey');
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const isStytchSSRProxy = (proxy) => {
-    return !!proxy[SSRStubKey];
-};
-
-const initialMember = {
-    member: null,
-    fromCache: false,
-    isInitialized: false,
-};
-const initialMemberSession = {
-    session: null,
-    fromCache: false,
-    isInitialized: false,
-};
-const StytchContext = React.createContext({ isMounted: false });
-const StytchMemberContext = React.createContext(initialMember);
-const StytchMemberSessionContext = React.createContext(initialMemberSession);
-const useIsMounted__INTERNAL = () => React.useContext(StytchContext).isMounted;
-const isUIClient = (client) => {
-    return client.mount !== undefined;
-};
-/**
- * Returns the active member.
- * The Stytch SDKs are used for client-side authentication and session management.
- * Check the isInitialized property to determine if the SDK has completed initialization.
- * Check the fromCache property to determine if the session data is from persistent storage.
- * See Next's {@link https://nextjs.org/docs/authentication#authenticating-statically-generated-pages documentation} for more.
- * @example
- * const {member, isInitialized, fromCache} = useStytchMember();
- * if (!isInitialized) {
- *     return <p>Loading...</p>;
- * }
- * return (<h1>Welcome, {member.name}</h1>);
- */
-const useStytchMember = () => {
-    invariant(useIsMounted__INTERNAL(), noProviderError('useStytchMember', 'StytchB2BProvider'));
-    return React.useContext(StytchMemberContext);
-};
-/**
- * Returns the member's active Stytch member session.
- * The Stytch SDKs are used for client-side authentication and session management.
- * Check the isInitialized property to determine if the SDK has completed initialization.
- * Check the fromCache property to determine if the session data is from persistent storage.
- * See Next's {@link https://nextjs.org/docs/authentication#authenticating-statically-generated-pages documentation} for more.
- * @example
- * const {session, isInitialized, fromCache} = useStytchMemberSession();
- * useEffect(() => {
- *   if (!isInitialized) {
- *     return;
- *   }
- *   if (!session) {
- *     router.replace('/login')
- *   }
- * }, [session, isInitialized]);
- */
-const useStytchMemberSession = () => {
-    invariant(useIsMounted__INTERNAL(), noProviderError('useStytchMemberSession', 'StytchB2BProvider'));
-    return React.useContext(StytchMemberSessionContext);
-};
-/**
- * Returns the Stytch client stored in the Stytch context.
- *
- * @example
- * const stytch = useStytch();
- * useEffect(() => {
- *   stytch.magicLinks.authenticate('...')
- * }, [stytch]);
- */
-const useStytchB2BClient = () => {
-    const ctx = React.useContext(StytchContext);
-    invariant(ctx.isMounted, noProviderError('useStytchB2BClient', 'StytchB2BProvider'));
-    return ctx.client;
-};
-const withStytchB2BClient = (Component) => {
-    const WithStytch = (props) => {
-        invariant(useIsMounted__INTERNAL(), 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(useIsMounted__INTERNAL(), noProviderError('withStytchMember', 'StytchB2BProvider'));
-        const { member, isInitialized, fromCache } = useStytchMember();
-        return (React__default['default'].createElement(Component, Object.assign({}, props, { stytchMember: member, stytchMemberIsInitialized: isInitialized, stytchMemberIsFromCache: fromCache })));
-    };
-    WithStytchUser.displayName = `withStytchMember(${Component.displayName || Component.name || 'Component'})`;
-    return WithStytchUser;
-};
-const withStytchMemberSession = (Component) => {
-    const WithStytchSession = (props) => {
-        invariant(useIsMounted__INTERNAL(), noProviderError('withStytchMemberSession', 'StytchB2BProvider'));
-        const { session, isInitialized, fromCache } = useStytchMemberSession();
-        return (React__default['default'].createElement(Component, Object.assign({}, props, { stytchMemberSession: session, stytchMemberSessionIsInitialized: isInitialized, stytchMemberSessionIsFromCache: fromCache })));
-    };
-    WithStytchSession.displayName = `withStytchMemberSession(${Component.displayName || Component.name || 'Component'})`;
-    return WithStytchSession;
-};
-/**
- * The Stytch Context Provider.
- * Wrap your application with this component in `_app.js` in order to use Stytch everywhere in your app.
- * @example
- * const stytch = createStytchB2BHeadlessClient('public-token-<find yours in the stytch dashboard>')
- *
- * return (
- *   <StytchB2BProvider stytch={stytch}>
- *     <App />
- *   </StytchB2BProvider>
- * )
- */
-const StytchB2BProvider = ({ stytch, children }) => {
-    const ctx = React.useMemo(() => ({ client: stytch, isMounted: true }), [stytch]);
-    const [member, setMember] = useAsyncState(initialMember);
-    const [session, setMemberSession] = useAsyncState(initialMemberSession);
-    React.useEffect(() => {
-        if (isStytchSSRProxy(stytch)) {
-            return;
-        }
-        setMember({
-            member: stytch.member.getSync(),
-            fromCache: true,
-            isInitialized: true,
-        });
-        setMemberSession({
-            session: stytch.session.getSync(),
-            fromCache: true,
-            isInitialized: true,
-        });
-        const unsubscribeMember = stytch.member.onChange((member) => setMember({ member, fromCache: false, isInitialized: true }));
-        const unsubscribeMemberSession = stytch.session.onChange((session) => setMemberSession({ session, fromCache: false, isInitialized: true }));
-        return () => {
-            unsubscribeMember();
-            unsubscribeMemberSession();
-        };
-    }, [stytch, setMember, setMemberSession]);
-    const finalMemberSession = !!session.session === !!member.member ? session : initialMemberSession;
-    const finalMember = !!session.session === !!member.member ? member : initialMember;
-    return (React__default['default'].createElement(StytchContext.Provider, { value: ctx },
-        React__default['default'].createElement(StytchMemberContext.Provider, { value: finalMember },
-            React__default['default'].createElement(StytchMemberSessionContext.Provider, { value: finalMemberSession }, children))));
-};
-
-/**
- * The Stytch B2B UI component.
- * This component can only be used with a {@link StytchB2BUIClient} client constructor
- * passed into the {@link StytchB2BProvider}
- *
- * See the {@link https://stytch.com/docs/b2b/sdks/javascript-sdk online reference}
- *
- * @example
- * <StytchB2B
- *   config={{
- *     authFlowType: "Organization",
- *     emailMagicLinksOptions: {
- *       loginRedirectURL: 'https://example.com/authenticate',
- *       signupRedirectURL: 'https://example.com/authenticate',
- *     },
- *     ssoOptions: {
- *       loginRedirectURL: 'https://example.com/authenticate',
- *       signupRedirectURL: 'https://example.com/authenticate',
- *     },
- *     sessionOptions: {
- *       sessionDurationMinutes: 60,
- *     }
- *   }}
- *   styles={{
- *     fontFamily: '"Helvetica New", Helvetica, sans-serif',
- *     primaryColor: '#0577CA',
- *     width: '321px',
- *   }}
- *   callbacks={{
- *     onEvent: (event) => console.log(event)
- *   }}
- * />
- * @param props {@link StytchB2BProps}
- */
-const StytchB2B = ({ styles, callbacks, config }) => {
-    invariant(useIsMounted__INTERNAL(), noProviderError('<StytchB2B />'));
-    const stytchClient = useStytchB2BClient();
-    const containerEl = React.useRef(null);
-    React.useLayoutEffect(() => {
-        if (!isUIClient(stytchClient)) {
-            throw Error(noHeadlessClientError);
-        }
-        if (!containerEl.current) {
-            return;
-        }
-        if (!containerEl.current.id) {
-            const randId = Math.floor(Math.random() * 1e6);
-            containerEl.current.id = `stytch-b2b-ui-${randId}`;
-        }
-        stytchClient.mount({
-            callbacks,
-            config,
-            elementId: `#${containerEl.current.id}`,
-            styles,
-        });
-    }, [stytchClient, styles, callbacks]);
-    return React__default['default'].createElement("div", { ref: containerEl });
-};
-
-exports.StytchB2B = StytchB2B;
-exports.StytchB2BProvider = StytchB2BProvider;
-exports.useStytchB2BClient = useStytchB2BClient;
-exports.useStytchMember = useStytchMember;
-exports.useStytchMemberSession = useStytchMemberSession;
-exports.withStytchB2BClient = withStytchB2BClient;
-exports.withStytchMember = withStytchMember;
-exports.withStytchMemberSession = withStytchMemberSession;
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StytchB2B = exports.withStytchMember = exports.withStytchMemberSession = exports.withStytchB2BClient = exports.useStytchMember = exports.useStytchMemberSession = exports.useStytchB2BClient = exports.StytchB2BProvider = void 0;
+var StytchB2BContext_1 = require("./StytchB2BContext");
+Object.defineProperty(exports, "StytchB2BProvider", { enumerable: true, get: function () { return StytchB2BContext_1.StytchB2BProvider; } });
+Object.defineProperty(exports, "useStytchB2BClient", { enumerable: true, get: function () { return StytchB2BContext_1.useStytchB2BClient; } });
+Object.defineProperty(exports, "useStytchMemberSession", { enumerable: true, get: function () { return StytchB2BContext_1.useStytchMemberSession; } });
+Object.defineProperty(exports, "useStytchMember", { enumerable: true, get: function () { return StytchB2BContext_1.useStytchMember; } });
+Object.defineProperty(exports, "withStytchB2BClient", { enumerable: true, get: function () { return StytchB2BContext_1.withStytchB2BClient; } });
+Object.defineProperty(exports, "withStytchMemberSession", { enumerable: true, get: function () { return StytchB2BContext_1.withStytchMemberSession; } });
+Object.defineProperty(exports, "withStytchMember", { enumerable: true, get: function () { return StytchB2BContext_1.withStytchMember; } });
+var Stytch_1 = require("./Stytch");
+Object.defineProperty(exports, "StytchB2B", { enumerable: true, get: function () { return Stytch_1.StytchB2B; } });
+//# sourceMappingURL=index.js.map

package/dist/b2b/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/b2b/index.ts"],"names":[],"mappings":";;;AAAA,uDAQ4B;AAP1B,qHAAA,iBAAiB,OAAA;AACjB,sHAAA,kBAAkB,OAAA;AAClB,0HAAA,sBAAsB,OAAA;AACtB,mHAAA,eAAe,OAAA;AACf,uHAAA,mBAAmB,OAAA;AACnB,2HAAA,uBAAuB,OAAA;AACvB,oHAAA,gBAAgB,OAAA;AAElB,mCAAqC;AAA5B,mGAAA,SAAS,OAAA"}

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

@@ -1,17 +1 @@
-import { StytchB2BUIClient } from "@stytch/vanilla-js/b2b";
-/**
- * Creates a Stytch UI client object to call the Stytch APIs and render Stytch UI components.
- * The Stytch client is not available serverside.
- * If you do not use Stytch UI components, use {@link createStytchB2BHeadlessClient} to reduce your bundle size.
- * @example
- * const stytch = createStytchB2BUIClient('public-token-<find yours in the stytch dashboard>')
- *
- * return (
- *   <StytchB2BProvider stytch={stytch}>
- *     <App />
- *   </StytchB2BProvider>
- * )
- * @returns A {@link StytchB2BUIClient}
- */
-declare const createStytchB2BUIClient: (_PUBLIC_TOKEN: string, options?: import("core/dist/public").StytchClientOptions | undefined) => StytchB2BUIClient;
-export { createStytchB2BUIClient };
+export * from './createStytchB2BUIClient';

package/dist/b2b/index.ui.js

@@ -1,66 +1,18 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var b2b = require('@stytch/vanilla-js/b2b');
-
-const cannotInvokeMethodOnServerError = (path) => `[Stytch] Invalid serverside function call to ${path}.
-The Stytch Javascript SDK is intended to ony be used on the client side.
-Make sure to wrap your API calls in a hook to ensure they are executed on the client.
-\`\`\`
-const myComponent = () => {
-  const stytch = useStytch();
-  // This will error out on the server.
-  stytch.magicLinks.authenticate(...);
-  useEffect(() => {
-    // This will work well
-    stytch.magicLinks.authenticate(...);
-  }, []);
-}
-\`\`\`
-
-If you want to make API calls from server environments, please use the Stytch Node Library
-https://www.npmjs.com/package/stytch.
-`;
-
-const SSRStubKey = Symbol('__stytch_SSRStubKey');
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const createProxy = (path) => {
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
-    const noop = () => { };
-    return new Proxy(noop, {
-        get(target, p) {
-            if (p === SSRStubKey) {
-                return true;
-            }
-            return createProxy(path + '.' + String(p));
-        },
-        apply() {
-            throw new Error(cannotInvokeMethodOnServerError(path));
-        },
-    });
-};
-const createStytchSSRProxy = () => createProxy('stytch');
-
-/**
- * Creates a Stytch UI client object to call the Stytch APIs and render Stytch UI components.
- * The Stytch client is not available serverside.
- * If you do not use Stytch UI components, use {@link createStytchB2BHeadlessClient} to reduce your bundle size.
- * @example
- * const stytch = createStytchB2BUIClient('public-token-<find yours in the stytch dashboard>')
- *
- * return (
- *   <StytchB2BProvider stytch={stytch}>
- *     <App />
- *   </StytchB2BProvider>
- * )
- * @returns A {@link StytchB2BUIClient}
- */
-const createStytchB2BUIClient = (...args) => {
-    if (typeof window === 'undefined') {
-        return createStytchSSRProxy();
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
     }
-    return new b2b.StytchB2BUIClient(...args);
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
-
-exports.createStytchB2BUIClient = createStytchB2BUIClient;
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./createStytchB2BUIClient"), exports);
+//# sourceMappingURL=index.ui.js.map

package/dist/b2b/index.ui.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.ui.js","sourceRoot":"","sources":["../../src/b2b/index.ui.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,4DAA0C"}

package/dist/createStytchHeadlessClient.d.ts

@@ -0,0 +1,15 @@
+import { StytchHeadlessClient } from '@stytch/vanilla-js/headless';
+/**
+ * Creates a Headless Stytch client object to call the stytch APIs.
+ * The Stytch client is not available serverside.
+ * @example
+ * const stytch = createStytchHeadlessClient('public-token-<find yours in the stytch dashboard>')
+ *
+ * return (
+ *   <StytchProvider stytch={stytch}>
+ *     <App />
+ *   </StytchProvider>
+ * )
+ * @returns A {@link StytchHeadlessClient}
+ */
+export declare const createStytchHeadlessClient: (_PUBLIC_TOKEN: string, options?: import("packages/core/dist/public").StytchClientOptions | undefined) => StytchHeadlessClient;

package/dist/createStytchHeadlessClient.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createStytchHeadlessClient = void 0;
+const headless_1 = require("@stytch/vanilla-js/headless");
+const StytchSSRProxy_1 = require("./StytchSSRProxy");
+/**
+ * Creates a Headless Stytch client object to call the stytch APIs.
+ * The Stytch client is not available serverside.
+ * @example
+ * const stytch = createStytchHeadlessClient('public-token-<find yours in the stytch dashboard>')
+ *
+ * return (
+ *   <StytchProvider stytch={stytch}>
+ *     <App />
+ *   </StytchProvider>
+ * )
+ * @returns A {@link StytchHeadlessClient}
+ */
+const createStytchHeadlessClient = (...args) => {
+    if (typeof window === 'undefined') {
+        return (0, StytchSSRProxy_1.createStytchSSRProxy)();
+    }
+    return new headless_1.StytchHeadlessClient(...args);
+};
+exports.createStytchHeadlessClient = createStytchHeadlessClient;
+//# sourceMappingURL=createStytchHeadlessClient.js.map

package/dist/createStytchHeadlessClient.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createStytchHeadlessClient.js","sourceRoot":"","sources":["../src/createStytchHeadlessClient.ts"],"names":[],"mappings":";;;AAAA,0DAAmE;AACnE,qDAAwD;AAExD;;;;;;;;;;;;GAYG;AACI,MAAM,0BAA0B,GAAG,CACxC,GAAG,IAAwD,EACrC,EAAE;IACxB,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;QACjC,OAAO,IAAA,qCAAoB,GAAE,CAAC;KAC/B;IACD,OAAO,IAAI,+BAAoB,CAAC,GAAG,IAAI,CAAC,CAAC;AAC3C,CAAC,CAAC;AAPW,QAAA,0BAA0B,8BAOrC"}

package/dist/createStytchUIClient.d.ts

@@ -0,0 +1,16 @@
+import { StytchUIClient } from '@stytch/vanilla-js';
+/**
+ * Creates a Stytch UI client object to call the Stytch APIs and render Stytch UI components.
+ * The Stytch client is not available serverside.
+ * If you do not use Stytch UI components, use {@link createStytchHeadlessClient} to reduce your bundle size.
+ * @example
+ * const stytch = createStytchUIClient('public-token-<find yours in the stytch dashboard>')
+ *
+ * return (
+ *   <StytchProvider stytch={stytch}>
+ *     <App />
+ *   </StytchProvider>
+ * )
+ * @returns A {@link StytchUIClient}
+ */
+export declare const createStytchUIClient: (_PUBLIC_TOKEN: string, options?: import("packages/core/dist/public").StytchClientOptions | undefined) => StytchUIClient;

package/dist/createStytchUIClient.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createStytchUIClient = void 0;
+const vanilla_js_1 = require("@stytch/vanilla-js");
+const StytchSSRProxy_1 = require("./StytchSSRProxy");
+/**
+ * Creates a Stytch UI client object to call the Stytch APIs and render Stytch UI components.
+ * The Stytch client is not available serverside.
+ * If you do not use Stytch UI components, use {@link createStytchHeadlessClient} to reduce your bundle size.
+ * @example
+ * const stytch = createStytchUIClient('public-token-<find yours in the stytch dashboard>')
+ *
+ * return (
+ *   <StytchProvider stytch={stytch}>
+ *     <App />
+ *   </StytchProvider>
+ * )
+ * @returns A {@link StytchUIClient}
+ */
+const createStytchUIClient = (...args) => {
+    if (typeof window === 'undefined') {
+        return (0, StytchSSRProxy_1.createStytchSSRProxy)();
+    }
+    return new vanilla_js_1.StytchUIClient(...args);
+};
+exports.createStytchUIClient = createStytchUIClient;
+//# sourceMappingURL=createStytchUIClient.js.map

package/dist/createStytchUIClient.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createStytchUIClient.js","sourceRoot":"","sources":["../src/createStytchUIClient.ts"],"names":[],"mappings":";;;AAAA,mDAAoD;AACpD,qDAAwD;AAExD;;;;;;;;;;;;;GAaG;AACI,MAAM,oBAAoB,GAAG,CAAC,GAAG,IAAkD,EAAkB,EAAE;IAC5G,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;QACjC,OAAO,IAAA,qCAAoB,GAAE,CAAC;KAC/B;IACD,OAAO,IAAI,2BAAc,CAAC,GAAG,IAAI,CAAC,CAAC;AACrC,CAAC,CAAC;AALW,QAAA,oBAAoB,wBAK/B"}