@stytch/nextjs 16.0.0 → 17.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/dist/b2b/index.d.ts +30 -2
  3. package/dist/b2b/index.esm.d.ts +30 -2
  4. package/dist/b2b/index.esm.js +57 -6
  5. package/dist/b2b/index.headless.esm.js +83 -43
  6. package/dist/b2b/index.headless.js +83 -43
  7. package/dist/b2b/index.js +58 -5
  8. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,24 @@
1
1
  # @stytch/nextjs
2
2
 
3
+ ## 17.0.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 223e30e: Add `useStytchOrganization` hook for B2B
8
+
9
+ ### Patch Changes
10
+
11
+ - Updated dependencies [223e30e]
12
+ - @stytch/vanilla-js@4.2.0
13
+
14
+ ## 16.0.1
15
+
16
+ ### Patch Changes
17
+
18
+ - e6832cb: Fix an issue where `fromCache` would not update to `false` after cached data was refreshed
19
+ - Updated dependencies [e6832cb]
20
+ - @stytch/vanilla-js@4.1.1
21
+
3
22
  ## 16.0.0
4
23
 
5
24
  ### Patch Changes
package/dist/b2b/index.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import React from "react";
3
3
  import { ReactNode } from "react";
4
- import { Member, MemberSession, StytchB2BUIClient } from "@stytch/vanilla-js/b2b";
4
+ import { Member, MemberSession, Organization, StytchB2BUIClient } from "@stytch/vanilla-js/b2b";
5
5
  import { StytchB2BHeadlessClient } from "@stytch/vanilla-js/b2b/headless";
6
6
  import { PermissionsMap } from "@stytch/core/public";
7
7
  import { Callbacks, StyleConfig, StytchB2BUIConfig } from "@stytch/vanilla-js";
@@ -28,6 +28,15 @@ type SWRMemberSession = {
28
28
  fromCache: boolean;
29
29
  isInitialized: true;
30
30
  };
31
+ type SWROrganization = {
32
+ organization: null;
33
+ fromCache: false;
34
+ isInitialized: false;
35
+ } | {
36
+ organization: Organization | null;
37
+ fromCache: boolean;
38
+ isInitialized: true;
39
+ };
31
40
  /**
32
41
  * Returns the active member.
33
42
  * The Stytch SDKs are used for client-side authentication and session management.
@@ -60,6 +69,20 @@ declare const useStytchMember: () => SWRMember;
60
69
  * }, [session, isInitialized]);
61
70
  */
62
71
  declare const useStytchMemberSession: () => SWRMemberSession;
72
+ /**
73
+ * Returns the active Stytch organization.
74
+ * The Stytch SDKs are used for client-side authentication and session management.
75
+ * Check the isInitialized property to determine if the SDK has completed initialization.
76
+ * Check the fromCache property to determine if the session data is from persistent storage.
77
+ * See Next's {@link https://nextjs.org/docs/authentication#authenticating-statically-generated-pages documentation} for more.
78
+ * @example
79
+ * const {organization, isInitialized, fromCache} = useStytchOrganization();
80
+ * if (!isInitialized) {
81
+ * return <p>Loading...</p>;
82
+ * }
83
+ * return (<p>Welcome to {organization.organization_name}</p>);
84
+ */
85
+ declare const useStytchOrganization: () => SWROrganization;
63
86
  type SWRIsAuthorized = {
64
87
  isAuthorized: boolean;
65
88
  fromCache: boolean;
@@ -101,6 +124,11 @@ declare const withStytchMemberSession: <T extends object>(Component: React.Compo
101
124
  stytchMemberSessionIsInitialized: boolean;
102
125
  stytchMemberSessionIsFromCache: boolean;
103
126
  }>) => React.ComponentType<T>;
127
+ declare const withStytchOrganization: <T extends object>(Component: React.ComponentType<T & {
128
+ stytchOrganization: Organization | null;
129
+ stytchOrganizationIsInitialized: boolean;
130
+ stytchOrganizationIsFromCache: boolean;
131
+ }>) => React.ComponentType<T>;
104
132
  /**
105
133
  * Wrap your component with this HOC in order to receive the permissions for the logged-in member.
106
134
  * Evaluates all permissions granted to the logged-in member.
@@ -247,5 +275,5 @@ interface StytchB2BProps {
247
275
  * @param props {@link StytchB2BProps}
248
276
  */
249
277
  declare const StytchB2B: ({ styles, callbacks, config }: StytchB2BProps) => React.JSX.Element;
250
- export { StytchB2BProvider, useStytchB2BClient, useStytchMemberSession, useStytchMember, useStytchIsAuthorized, withStytchB2BClient, withStytchMemberSession, withStytchMember, withStytchPermissions, StytchB2B };
278
+ export { StytchB2BProvider, useStytchB2BClient, useStytchMemberSession, useStytchMember, useStytchIsAuthorized, useStytchOrganization, withStytchB2BClient, withStytchMemberSession, withStytchMember, withStytchOrganization, withStytchPermissions, StytchB2B };
251
279
  export type { StytchB2BProviderProps };
package/dist/b2b/index.esm.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import React from "react";
3
3
  import { ReactNode } from "react";
4
- import { Member, MemberSession, StytchB2BUIClient } from "@stytch/vanilla-js/b2b";
4
+ import { Member, MemberSession, Organization, StytchB2BUIClient } from "@stytch/vanilla-js/b2b";
5
5
  import { StytchB2BHeadlessClient } from "@stytch/vanilla-js/b2b/headless";
6
6
  import { PermissionsMap } from "@stytch/core/public";
7
7
  import { Callbacks, StyleConfig, StytchB2BUIConfig } from "@stytch/vanilla-js";
@@ -28,6 +28,15 @@ type SWRMemberSession = {
28
28
  fromCache: boolean;
29
29
  isInitialized: true;
30
30
  };
31
+ type SWROrganization = {
32
+ organization: null;
33
+ fromCache: false;
34
+ isInitialized: false;
35
+ } | {
36
+ organization: Organization | null;
37
+ fromCache: boolean;
38
+ isInitialized: true;
39
+ };
31
40
  /**
32
41
  * Returns the active member.
33
42
  * The Stytch SDKs are used for client-side authentication and session management.
@@ -60,6 +69,20 @@ declare const useStytchMember: () => SWRMember;
60
69
  * }, [session, isInitialized]);
61
70
  */
62
71
  declare const useStytchMemberSession: () => SWRMemberSession;
72
+ /**
73
+ * Returns the active Stytch organization.
74
+ * The Stytch SDKs are used for client-side authentication and session management.
75
+ * Check the isInitialized property to determine if the SDK has completed initialization.
76
+ * Check the fromCache property to determine if the session data is from persistent storage.
77
+ * See Next's {@link https://nextjs.org/docs/authentication#authenticating-statically-generated-pages documentation} for more.
78
+ * @example
79
+ * const {organization, isInitialized, fromCache} = useStytchOrganization();
80
+ * if (!isInitialized) {
81
+ * return <p>Loading...</p>;
82
+ * }
83
+ * return (<p>Welcome to {organization.organization_name}</p>);
84
+ */
85
+ declare const useStytchOrganization: () => SWROrganization;
63
86
  type SWRIsAuthorized = {
64
87
  isAuthorized: boolean;
65
88
  fromCache: boolean;
@@ -101,6 +124,11 @@ declare const withStytchMemberSession: <T extends object>(Component: React.Compo
101
124
  stytchMemberSessionIsInitialized: boolean;
102
125
  stytchMemberSessionIsFromCache: boolean;
103
126
  }>) => React.ComponentType<T>;
127
+ declare const withStytchOrganization: <T extends object>(Component: React.ComponentType<T & {
128
+ stytchOrganization: Organization | null;
129
+ stytchOrganizationIsInitialized: boolean;
130
+ stytchOrganizationIsFromCache: boolean;
131
+ }>) => React.ComponentType<T>;
104
132
  /**
105
133
  * Wrap your component with this HOC in order to receive the permissions for the logged-in member.
106
134
  * Evaluates all permissions granted to the logged-in member.
@@ -247,5 +275,5 @@ interface StytchB2BProps {
247
275
  * @param props {@link StytchB2BProps}
248
276
  */
249
277
  declare const StytchB2B: ({ styles, callbacks, config }: StytchB2BProps) => React.JSX.Element;
250
- export { StytchB2BProvider, useStytchB2BClient, useStytchMemberSession, useStytchMember, useStytchIsAuthorized, withStytchB2BClient, withStytchMemberSession, withStytchMember, withStytchPermissions, StytchB2B };
278
+ export { StytchB2BProvider, useStytchB2BClient, useStytchMemberSession, useStytchMember, useStytchIsAuthorized, useStytchOrganization, withStytchB2BClient, withStytchMemberSession, withStytchMember, withStytchOrganization, withStytchPermissions, StytchB2B };
251
279
  export type { StytchB2BProviderProps };
package/dist/b2b/index.esm.js CHANGED
@@ -44,9 +44,15 @@ const initialMemberSession = {
44
44
  fromCache: false,
45
45
  isInitialized: false,
46
46
  };
47
+ const initialOrganization = {
48
+ organization: null,
49
+ fromCache: false,
50
+ isInitialized: false,
51
+ };
47
52
  const StytchContext = createContext({ isMounted: false });
48
53
  const StytchMemberContext = createContext(initialMember);
49
54
  const StytchMemberSessionContext = createContext(initialMemberSession);
55
+ const StytchOrganizationContext = createContext(initialOrganization);
50
56
  const useIsMounted__INTERNAL = () => useContext(StytchContext).isMounted;
51
57
  const isUIClient = (client) => {
52
58
  return client.mount !== undefined;
@@ -89,6 +95,23 @@ const useStytchMemberSession = () => {
89
95
  invariant(useIsMounted__INTERNAL(), noProviderError('useStytchMemberSession', 'StytchB2BProvider'));
90
96
  return useContext(StytchMemberSessionContext);
91
97
  };
98
+ /**
99
+ * Returns the active Stytch organization.
100
+ * The Stytch SDKs are used for client-side authentication and session management.
101
+ * Check the isInitialized property to determine if the SDK has completed initialization.
102
+ * Check the fromCache property to determine if the session data is from persistent storage.
103
+ * See Next's {@link https://nextjs.org/docs/authentication#authenticating-statically-generated-pages documentation} for more.
104
+ * @example
105
+ * const {organization, isInitialized, fromCache} = useStytchOrganization();
106
+ * if (!isInitialized) {
107
+ * return <p>Loading...</p>;
108
+ * }
109
+ * return (<p>Welcome to {organization.organization_name}</p>);
110
+ */
111
+ const useStytchOrganization = () => {
112
+ invariant(useIsMounted__INTERNAL(), noProviderError('useStytchOrganization', 'StytchB2BProvider'));
113
+ return useContext(StytchOrganizationContext);
114
+ };
92
115
  /**
93
116
  * Determines whether the logged-in member is allowed to perform the specified action on the specified resource.
94
117
  * Returns `true` if the member can perform the action, `false` otherwise.
@@ -170,6 +193,15 @@ const withStytchMemberSession = (Component) => {
170
193
  WithStytchSession.displayName = `withStytchMemberSession(${Component.displayName || Component.name || 'Component'})`;
171
194
  return WithStytchSession;
172
195
  };
196
+ const withStytchOrganization = (Component) => {
197
+ const WithStytchOrganization = (props) => {
198
+ invariant(useIsMounted__INTERNAL(), noProviderError('withStytchOrganization', 'StytchB2BProvider'));
199
+ const { organization, isInitialized, fromCache } = useStytchOrganization();
200
+ return (React.createElement(Component, Object.assign({}, props, { stytchOrganization: organization, stytchOrganizationIsInitialized: isInitialized, stytchOrganizationIsFromCache: fromCache })));
201
+ };
202
+ WithStytchOrganization.displayName = `withStytchOrganization(${Component.displayName || Component.name || 'Component'})`;
203
+ return WithStytchOrganization;
204
+ };
173
205
  /**
174
206
  * Wrap your component with this HOC in order to receive the permissions for the logged-in member.
175
207
  * Evaluates all permissions granted to the logged-in member.
@@ -226,6 +258,7 @@ const StytchB2BProvider = ({ stytch, children }) => {
226
258
  const ctx = useMemo(() => ({ client: stytch, isMounted: true }), [stytch]);
227
259
  const [member, setMember] = useAsyncState(initialMember);
228
260
  const [session, setMemberSession] = useAsyncState(initialMemberSession);
261
+ const [organization, setOrganization] = useAsyncState(initialOrganization);
229
262
  useEffect(() => {
230
263
  if (isStytchSSRProxy(stytch)) {
231
264
  return;
@@ -240,18 +273,36 @@ const StytchB2BProvider = ({ stytch, children }) => {
240
273
  fromCache: true,
241
274
  isInitialized: true,
242
275
  });
276
+ setOrganization({
277
+ organization: stytch.organization.getSync(),
278
+ fromCache: true,
279
+ isInitialized: true,
280
+ });
243
281
  const unsubscribeMember = stytch.self.onChange((member) => setMember({ member, fromCache: false, isInitialized: true }));
244
282
  const unsubscribeMemberSession = stytch.session.onChange((session) => setMemberSession({ session, fromCache: false, isInitialized: true }));
283
+ const unsubscribeOrganization = stytch.organization.onChange((organization) => setOrganization({ organization, fromCache: false, isInitialized: true }));
245
284
  return () => {
246
285
  unsubscribeMember();
247
286
  unsubscribeMemberSession();
287
+ unsubscribeOrganization();
288
+ };
289
+ }, [stytch, setMember, setMemberSession, setOrganization]);
290
+ const allValuesReady = !!member.member === !!session.session && !!session.session === !!organization.organization;
291
+ const finalValues = allValuesReady
292
+ ? {
293
+ member,
294
+ session,
295
+ organization,
296
+ }
297
+ : {
298
+ member: initialMember,
299
+ session: initialMemberSession,
300
+ organization: initialOrganization,
248
301
  };
249
- }, [stytch, setMember, setMemberSession]);
250
- const finalMemberSession = !!session.session === !!member.member ? session : initialMemberSession;
251
- const finalMember = !!session.session === !!member.member ? member : initialMember;
252
302
  return (React.createElement(StytchContext.Provider, { value: ctx },
253
- React.createElement(StytchMemberContext.Provider, { value: finalMember },
254
- React.createElement(StytchMemberSessionContext.Provider, { value: finalMemberSession }, children))));
303
+ React.createElement(StytchOrganizationContext.Provider, { value: finalValues.organization },
304
+ React.createElement(StytchMemberContext.Provider, { value: finalValues.member },
305
+ React.createElement(StytchMemberSessionContext.Provider, { value: finalValues.session }, children)))));
255
306
  };
256
307
 
257
308
  /**
@@ -313,4 +364,4 @@ const StytchB2B = ({ styles, callbacks, config }) => {
313
364
  return React.createElement("div", { ref: containerEl });
314
365
  };
315
366
 
316
- export { StytchB2B, StytchB2BProvider, useStytchB2BClient, useStytchIsAuthorized, useStytchMember, useStytchMemberSession, withStytchB2BClient, withStytchMember, withStytchMemberSession, withStytchPermissions };
367
+ export { StytchB2B, StytchB2BProvider, useStytchB2BClient, useStytchIsAuthorized, useStytchMember, useStytchMemberSession, useStytchOrganization, withStytchB2BClient, withStytchMember, withStytchMemberSession, withStytchOrganization, withStytchPermissions };
package/dist/b2b/index.headless.esm.js CHANGED
@@ -1435,7 +1435,7 @@ var je, Fe = ["[Stytch]"], Ne = function Ne() {
1435
1435
  for (var e, t = arguments.length, r = new Array(t), n = 0; n < t; n++)
1436
1436
  r[n] = arguments[n];
1437
1437
  return (e = console).error.apply(e, Fe.concat(r));
1438
- }, Ue = "\nYou can find your public token at https://stytch.com/dashboard/api-keys.", ze = function ze(e) {
1438
+ }, ze = "\nYou can find your public token at https://stytch.com/dashboard/api-keys.", Ue = function Ue(e) {
1439
1439
  return e.includes("public-token-test");
1440
1440
  }, qe = function qe(e) {
1441
1441
  var t = {
@@ -1929,7 +1929,8 @@ var Ye = Promise.resolve({
1929
1929
  return n.member_session ? this._subscriptionService.updateStateAndTokens({
1930
1930
  state: {
1931
1931
  session: n.member_session,
1932
- member: n.member
1932
+ member: n.member,
1933
+ organization: n.organization
1933
1934
  },
1934
1935
  session_token: n.session_token,
1935
1936
  session_jwt: n.session_jwt,
@@ -2306,7 +2307,8 @@ var Ye = Promise.resolve({
2306
2307
  return s = t.sent, this._pkceManager.clearPKPair(), s.member_session ? this._subscriptionService.updateStateAndTokens({
2307
2308
  state: {
2308
2309
  session: s.member_session,
2309
- member: s.member
2310
+ member: s.member,
2311
+ organization: s.organization
2310
2312
  },
2311
2313
  session_token: s.session_token,
2312
2314
  session_jwt: s.session_jwt,
@@ -2332,7 +2334,7 @@ var Ye = Promise.resolve({
2332
2334
  for (;;)
2333
2335
  switch (e.prev = e.next) {
2334
2336
  case 0:
2335
- if (!ze(this._config.publicToken)) {
2337
+ if (!Ue(this._config.publicToken)) {
2336
2338
  e.next = 2;
2337
2339
  break;
2338
2340
  }
@@ -2437,13 +2439,20 @@ var Ye = Promise.resolve({
2437
2439
  method: "GET"
2438
2440
  });
2439
2441
  case 2:
2440
- return t = e.sent, e.abrupt("return", t.organization);
2441
- case 4:
2442
+ return t = e.sent, this._subscriptionService.updateOrganization(t.organization), e.abrupt("return", t.organization);
2443
+ case 5:
2442
2444
  case "end":
2443
2445
  return e.stop();
2444
2446
  }
2445
2447
  }, e, this);
2446
2448
  }));
2449
+ }, this.getSync = function () {
2450
+ return n._subscriptionService.getOrganization();
2451
+ }, this.onChange = function (e) {
2452
+ return n._subscriptionService.subscribeToState(function (t) {
2453
+ var r;
2454
+ return e(null !== (r = null == t ? void 0 : t.organization) && void 0 !== r ? r : null);
2455
+ });
2447
2456
  }, this.update = function (e) {
2448
2457
  return we(n, void 0, void 0, de().mark(function t() {
2449
2458
  var r;
@@ -2696,7 +2705,8 @@ var Ye = Promise.resolve({
2696
2705
  return s = t.sent, this._pkceManager.clearPKPair(), s.member_session ? this._subscriptionService.updateStateAndTokens({
2697
2706
  state: {
2698
2707
  session: s.member_session,
2699
- member: s.member
2708
+ member: s.member,
2709
+ organization: s.organization
2700
2710
  },
2701
2711
  session_token: s.session_token,
2702
2712
  session_jwt: s.session_jwt,
@@ -2731,7 +2741,7 @@ var Ye = Promise.resolve({
2731
2741
  }
2732
2742
  return e.abrupt("return", "https://".concat(r));
2733
2743
  case 6:
2734
- if (!ze(this._config.publicToken)) {
2744
+ if (!Ue(this._config.publicToken)) {
2735
2745
  e.next = 8;
2736
2746
  break;
2737
2747
  }
@@ -2875,7 +2885,8 @@ var Ye = Promise.resolve({
2875
2885
  return n = t.sent, this._subscriptionService.updateStateAndTokens({
2876
2886
  state: {
2877
2887
  session: n.member_session,
2878
- member: n.member
2888
+ member: n.member,
2889
+ organization: n.organization
2879
2890
  },
2880
2891
  session_token: n.session_token,
2881
2892
  session_jwt: n.session_jwt,
@@ -2906,7 +2917,8 @@ var Ye = Promise.resolve({
2906
2917
  return (r = t.sent).member_session ? this._subscriptionService.updateStateAndTokens({
2907
2918
  state: {
2908
2919
  session: r.member_session,
2909
- member: r.member
2920
+ member: r.member,
2921
+ organization: r.organization
2910
2922
  },
2911
2923
  session_token: r.session_token,
2912
2924
  session_jwt: r.session_jwt,
@@ -2992,7 +3004,8 @@ var Ye = Promise.resolve({
2992
3004
  return (n = t.sent).member_session ? this._subscriptionService.updateStateAndTokens({
2993
3005
  state: {
2994
3006
  session: n.member_session,
2995
- member: n.member
3007
+ member: n.member,
3008
+ organization: n.organization
2996
3009
  },
2997
3010
  session_token: n.session_token,
2998
3011
  session_jwt: n.session_jwt,
@@ -3038,7 +3051,8 @@ var Ye = Promise.resolve({
3038
3051
  return (n = t.sent).member_session ? this._subscriptionService.updateStateAndTokens({
3039
3052
  state: {
3040
3053
  session: n.member_session,
3041
- member: n.member
3054
+ member: n.member,
3055
+ organization: n.organization
3042
3056
  },
3043
3057
  session_token: n.session_token,
3044
3058
  session_jwt: n.session_jwt,
@@ -3122,7 +3136,8 @@ var tt = pe(function e(t, r) {
3122
3136
  return s = t.sent, this._subscriptionService.updateStateAndTokens({
3123
3137
  state: {
3124
3138
  session: s.member_session,
3125
- member: s.member
3139
+ member: s.member,
3140
+ organization: s.organization
3126
3141
  },
3127
3142
  session_token: s.session_token,
3128
3143
  session_jwt: s.session_jwt,
@@ -3203,7 +3218,8 @@ var tt = pe(function e(t, r) {
3203
3218
  return s = t.sent, this._subscriptionService.updateStateAndTokens({
3204
3219
  state: {
3205
3220
  session: s.member_session,
3206
- member: s.member
3221
+ member: s.member,
3222
+ organization: s.organization
3207
3223
  },
3208
3224
  session_token: s.session_token,
3209
3225
  session_jwt: s.session_jwt,
@@ -3646,7 +3662,8 @@ var kt = /*#__PURE__*/ function () {
3646
3662
  return _context6.abrupt("return", (o.member_session ? this._subscriptionService.updateStateAndTokens({
3647
3663
  state: {
3648
3664
  session: o.member_session,
3649
- member: o.member
3665
+ member: o.member,
3666
+ organization: o.organization
3650
3667
  },
3651
3668
  session_token: o.session_token,
3652
3669
  session_jwt: o.session_jwt,
@@ -3750,7 +3767,8 @@ var kt = /*#__PURE__*/ function () {
3750
3767
  return _context8.abrupt("return", (this._pkceManager.clearPKPair(), o.member_session ? this._subscriptionService.updateStateAndTokens({
3751
3768
  state: {
3752
3769
  session: o.member_session,
3753
- member: o.member
3770
+ member: o.member,
3771
+ organization: o.organization
3754
3772
  },
3755
3773
  session_token: o.session_token,
3756
3774
  session_jwt: o.session_jwt,
@@ -3805,7 +3823,8 @@ var kt = /*#__PURE__*/ function () {
3805
3823
  return _context9.abrupt("return", (n.member_session ? this._subscriptionService.updateStateAndTokens({
3806
3824
  state: {
3807
3825
  session: n.member_session,
3808
- member: n.member
3826
+ member: n.member,
3827
+ organization: n.organization
3809
3828
  },
3810
3829
  session_token: n.session_token,
3811
3830
  session_jwt: n.session_jwt,
@@ -3856,7 +3875,8 @@ var kt = /*#__PURE__*/ function () {
3856
3875
  return _context10.abrupt("return", (this._subscriptionService.updateStateAndTokens({
3857
3876
  state: {
3858
3877
  session: n.member_session,
3859
- member: n.member
3878
+ member: n.member,
3879
+ organization: n.organization
3860
3880
  },
3861
3881
  session_token: n.session_token,
3862
3882
  session_jwt: n.session_jwt,
@@ -4119,7 +4139,7 @@ var At = /*#__PURE__*/ function () {
4119
4139
  },
4120
4140
  sdk: {
4121
4141
  identifier: "Stytch.js Javascript SDK",
4122
- version: "4.1.0"
4142
+ version: "4.2.0"
4123
4143
  }
4124
4144
  });
4125
4145
  }
@@ -4438,7 +4458,7 @@ var It = /*#__PURE__*/ function () {
4438
4458
  removeItem: function removeItem(e) {
4439
4459
  return sessionStorage.removeItem(Rt(_this4.publicToken, e));
4440
4460
  }
4441
- }, this.publicToken = e, this.state = null, this.subscriptions = {}, (null == t ? void 0 : t.cookieOptions) ? (qe("SubscriptionDataLayer").isOptionalString("cookieOptions.opaqueTokenCookieName", t.cookieOptions.opaqueTokenCookieName).isOptionalString("cookieOptions.jwtCookieName", t.cookieOptions.jwtCookieName).isOptionalString("cookieOptions.istCookieName", t.cookieOptions.istCookieName).isOptionalString("cookieOptions.path", t.cookieOptions.path).isOptionalString("cookieOptions.domain", t.cookieOptions.domain), this._jwtCookieName = t.cookieOptions.jwtCookieName || null, this._opaqueTokenCookieName = t.cookieOptions.opaqueTokenCookieName || null, this._cookiePath = t.cookieOptions.path || null, this._domain = t.cookieOptions.domain || null, this._cookieAvailableToSubdomains = t.cookieOptions.availableToSubdomains || !1, this._istCookieName = t.cookieOptions.istCookieName || null) : (this._opaqueTokenCookieName = null, this._jwtCookieName = null, this._cookiePath = null, this._domain = null, this._cookieAvailableToSubdomains = !1, this._istCookieName = null);
4461
+ }, this.publicToken = e, this.state = null, this.stateKeysUpdated = new Set(), this.subscriptions = {}, (null == t ? void 0 : t.cookieOptions) ? (qe("SubscriptionDataLayer").isOptionalString("cookieOptions.opaqueTokenCookieName", t.cookieOptions.opaqueTokenCookieName).isOptionalString("cookieOptions.jwtCookieName", t.cookieOptions.jwtCookieName).isOptionalString("cookieOptions.istCookieName", t.cookieOptions.istCookieName).isOptionalString("cookieOptions.path", t.cookieOptions.path).isOptionalString("cookieOptions.domain", t.cookieOptions.domain), this._jwtCookieName = t.cookieOptions.jwtCookieName || null, this._opaqueTokenCookieName = t.cookieOptions.opaqueTokenCookieName || null, this._cookiePath = t.cookieOptions.path || null, this._domain = t.cookieOptions.domain || null, this._cookieAvailableToSubdomains = t.cookieOptions.availableToSubdomains || !1, this._istCookieName = t.cookieOptions.istCookieName || null) : (this._opaqueTokenCookieName = null, this._jwtCookieName = null, this._cookiePath = null, this._domain = null, this._cookieAvailableToSubdomains = !1, this._istCookieName = null);
4442
4462
  var r = localStorage.getItem(Rt(this.publicToken));
4443
4463
  if (!r)
4444
4464
  return;
@@ -4562,6 +4582,15 @@ var It = /*#__PURE__*/ function () {
4562
4582
  value: function removeItem(e) {
4563
4583
  return localStorage.removeItem(Rt(this.publicToken, e));
4564
4584
  }
4585
+ }, {
4586
+ key: "markStateKeysUpdated",
4587
+ value: function markStateKeysUpdated(e) {
4588
+ var _this6 = this;
4589
+ var t = this.stateKeysUpdated.size;
4590
+ return e.forEach(function (e) {
4591
+ return _this6.stateKeysUpdated.add(e);
4592
+ }), t !== this.stateKeysUpdated.size;
4593
+ }
4565
4594
  }], [{
4566
4595
  key: "generateCookieOpts",
4567
4596
  value: function generateCookieOpts(_ref4) {
@@ -4612,15 +4641,15 @@ var Lt = Symbol["for"]("__stytch_b2b_DataLayer"), Mt = function Mt(e, t) {
4612
4641
  });
4613
4642
  var Nt = /*#__PURE__*/ function () {
4614
4643
  function Nt(e, t) {
4615
- var _this6 = this;
4644
+ var _this7 = this;
4616
4645
  _classCallCheck(this, Nt);
4617
4646
  this._publicToken = e, this._datalayer = t, this._listen = function (e) {
4618
- if (e.key !== Rt(_this6._publicToken))
4647
+ if (e.key !== Rt(_this7._publicToken))
4619
4648
  return;
4620
4649
  if (null === e.newValue || "null" === e.newValue)
4621
- return void _this6.destroyState();
4650
+ return void _this7.destroyState();
4622
4651
  var t = JSON.parse(e.newValue);
4623
- _this6.updateState(t);
4652
+ _this7.updateState(t);
4624
4653
  }, window.addEventListener("storage", this._listen);
4625
4654
  var _this$_datalayer$read = this._datalayer.readSessionCookie(), r = _this$_datalayer$read.session_token;
4626
4655
  r || this.destroyState();
@@ -4653,7 +4682,9 @@ var Nt = /*#__PURE__*/ function () {
4653
4682
  key: "_updateStateAndTokensInternal",
4654
4683
  value: function _updateStateAndTokensInternal(e) {
4655
4684
  var t = this._datalayer.state, r = null === e.state ? null : Object.assign(Object.assign({}, this._datalayer.state), e.state);
4656
- this._datalayer.state = r, Ft(t, r) || jt(this._datalayer.subscriptions, r);
4685
+ this._datalayer.state = r;
4686
+ var n = e.state ? Object.keys(e.state) : [];
4687
+ !this._datalayer.markStateKeysUpdated(n) && Ft(t, r) || jt(this._datalayer.subscriptions, r);
4657
4688
  }
4658
4689
  }, {
4659
4690
  key: "updateStateAndTokens",
@@ -4664,7 +4695,9 @@ var Nt = /*#__PURE__*/ function () {
4664
4695
  key: "updateState",
4665
4696
  value: function updateState(e) {
4666
4697
  var t = this._datalayer.state, r = null === e ? null : Object.assign(Object.assign({}, this._datalayer.state), e);
4667
- this._datalayer.state = r, Ft(t, r) || (jt(this._datalayer.subscriptions, r), this._datalayer.syncToLocalStorage());
4698
+ this._datalayer.state = r;
4699
+ var n = e ? Object.keys(e) : [], i = this._datalayer.markStateKeysUpdated(n), o = !Ft(t, r);
4700
+ (i || o) && (jt(this._datalayer.subscriptions, r), o && this._datalayer.syncToLocalStorage());
4668
4701
  }
4669
4702
  }, {
4670
4703
  key: "updateTokens",
@@ -4707,32 +4740,39 @@ var Kt = /*#__PURE__*/ function (_Nt) {
4707
4740
  _inherits(Kt, _Nt);
4708
4741
  var _super3 = _createSuper(Kt);
4709
4742
  function Kt() {
4710
- var _this7;
4743
+ var _this8;
4711
4744
  _classCallCheck(this, Kt);
4712
- _this7 = _super3.apply(this, arguments), _this7.updateMember = function (e) {
4713
- return _this7.updateState({
4745
+ _this8 = _super3.apply(this, arguments), _this8.updateMember = function (e) {
4746
+ return _this8.updateState({
4714
4747
  member: e
4715
4748
  });
4716
- }, _this7.getMember = function () {
4749
+ }, _this8.getMember = function () {
4750
+ var e, t;
4751
+ return null !== (t = null === (e = _this8.getState()) || void 0 === e ? void 0 : e.member) && void 0 !== t ? t : null;
4752
+ }, _this8.updateOrganization = function (e) {
4753
+ return _this8.updateState({
4754
+ organization: e
4755
+ });
4756
+ }, _this8.getOrganization = function () {
4717
4757
  var e, t;
4718
- return null !== (t = null === (e = _this7.getState()) || void 0 === e ? void 0 : e.member) && void 0 !== t ? t : null;
4719
- }, _this7.getSession = function () {
4758
+ return null !== (t = null === (e = _this8.getState()) || void 0 === e ? void 0 : e.organization) && void 0 !== t ? t : null;
4759
+ }, _this8.getSession = function () {
4720
4760
  var e, t;
4721
- return null !== (t = null === (e = _this7.getState()) || void 0 === e ? void 0 : e.session) && void 0 !== t ? t : null;
4761
+ return null !== (t = null === (e = _this8.getState()) || void 0 === e ? void 0 : e.session) && void 0 !== t ? t : null;
4722
4762
  };
4723
- return _this7;
4763
+ return _this8;
4724
4764
  }
4725
4765
  return _createClass(Kt);
4726
4766
  }(Nt);
4727
- var Ut = Symbol["for"]("stytch__internal_b2b");
4728
- var zt = /*#__PURE__*/ _createClass(function zt(e, t) {
4729
- var _this8 = this;
4730
- _classCallCheck(this, zt);
4767
+ var zt = Symbol["for"]("stytch__internal_b2b");
4768
+ var Ut = /*#__PURE__*/ _createClass(function Ut(e, t) {
4769
+ var _this9 = this;
4770
+ _classCallCheck(this, Ut);
4731
4771
  var r;
4732
4772
  !function (e) {
4733
4773
  if ("undefined" == typeof window)
4734
4774
  throw new Error("The ".concat(e, " is not compatible with server-side environments.\nIf using nextjs, use the create").concat(e, " method instead.\n```\n").concat("import { createStytchB2BHeadlessClient } from '@stytch/nextjs/b2b';\n \n const stytch = createStytchB2BHeadlessClient('public-token-...');\n ", "\n```\n"));
4735
- }("StytchB2BHeadlessClient"), "string" != typeof (r = e) ? Ne("Public token is malformed. Expected a string, got ".concat(le(r), ".").concat(Ue)) : "" === r ? Ne('Public token is malformed. Expected "public-token-...", got an empty string.'.concat(Ue)) : r.startsWith("public-token-") || Ne('Public token is malformed. Expected "public-token-...", got '.concat(r, ".").concat(Ue));
4775
+ }("StytchB2BHeadlessClient"), "string" != typeof (r = e) ? Ne("Public token is malformed. Expected a string, got ".concat(le(r), ".").concat(ze)) : "" === r ? Ne('Public token is malformed. Expected "public-token-...", got an empty string.'.concat(ze)) : r.startsWith("public-token-") || Ne('Public token is malformed. Expected "public-token-...", got '.concat(r, ".").concat(ze));
4736
4776
  var n = t, i = {
4737
4777
  cookieOptions: null == (o = n) ? void 0 : o.cookieOptions,
4738
4778
  endpoints: {
@@ -4749,8 +4789,8 @@ var zt = /*#__PURE__*/ _createClass(function zt(e, t) {
4749
4789
  this._networkClient = new At(e, this._dataLayer, i.endpoints.sdkBackendURL, function () {
4750
4790
  var e, t, r, n;
4751
4791
  return {
4752
- stytch_member_id: null === (t = null === (e = _this8._dataLayer.state) || void 0 === e ? void 0 : e.member) || void 0 === t ? void 0 : t.member_id,
4753
- stytch_member_session_id: null === (n = null === (r = _this8._dataLayer.state) || void 0 === r ? void 0 : r.session) || void 0 === n ? void 0 : n.member_session_id
4792
+ stytch_member_id: null === (t = null === (e = _this9._dataLayer.state) || void 0 === e ? void 0 : e.member) || void 0 === t ? void 0 : t.member_id,
4793
+ stytch_member_session_id: null === (n = null === (r = _this9._dataLayer.state) || void 0 === r ? void 0 : r.session) || void 0 === n ? void 0 : n.member_session_id
4754
4794
  };
4755
4795
  });
4756
4796
  var v = new St(e, this._networkClient, this._dataLayer), b = new Pt(v.getAsync()), g = new We(e, i.endpoints.dfpBackendURL, v.getAsync(), b.executeRecaptcha);
@@ -4773,7 +4813,7 @@ var zt = /*#__PURE__*/ _createClass(function zt(e, t) {
4773
4813
  }
4774
4814
  });
4775
4815
  (function (e, t) {
4776
- Object.assign(e, _defineProperty({}, Ut, t));
4816
+ Object.assign(e, _defineProperty({}, zt, t));
4777
4817
  })(this, {
4778
4818
  bootstrap: v,
4779
4819
  publicToken: e,
@@ -4838,7 +4878,7 @@ const createStytchB2BHeadlessClient = (...args) => {
4838
4878
  if (typeof window === 'undefined') {
4839
4879
  return createStytchSSRProxy();
4840
4880
  }
4841
- return new zt(...args);
4881
+ return new Ut(...args);
4842
4882
  };
4843
4883
 
4844
4884
  export { createStytchB2BHeadlessClient };
package/dist/b2b/index.headless.js CHANGED
@@ -1439,7 +1439,7 @@ var je, Fe = ["[Stytch]"], Ne = function Ne() {
1439
1439
  for (var e, t = arguments.length, r = new Array(t), n = 0; n < t; n++)
1440
1440
  r[n] = arguments[n];
1441
1441
  return (e = console).error.apply(e, Fe.concat(r));
1442
- }, Ue = "\nYou can find your public token at https://stytch.com/dashboard/api-keys.", ze = function ze(e) {
1442
+ }, ze = "\nYou can find your public token at https://stytch.com/dashboard/api-keys.", Ue = function Ue(e) {
1443
1443
  return e.includes("public-token-test");
1444
1444
  }, qe = function qe(e) {
1445
1445
  var t = {
@@ -1933,7 +1933,8 @@ var Ye = Promise.resolve({
1933
1933
  return n.member_session ? this._subscriptionService.updateStateAndTokens({
1934
1934
  state: {
1935
1935
  session: n.member_session,
1936
- member: n.member
1936
+ member: n.member,
1937
+ organization: n.organization
1937
1938
  },
1938
1939
  session_token: n.session_token,
1939
1940
  session_jwt: n.session_jwt,
@@ -2310,7 +2311,8 @@ var Ye = Promise.resolve({
2310
2311
  return s = t.sent, this._pkceManager.clearPKPair(), s.member_session ? this._subscriptionService.updateStateAndTokens({
2311
2312
  state: {
2312
2313
  session: s.member_session,
2313
- member: s.member
2314
+ member: s.member,
2315
+ organization: s.organization
2314
2316
  },
2315
2317
  session_token: s.session_token,
2316
2318
  session_jwt: s.session_jwt,
@@ -2336,7 +2338,7 @@ var Ye = Promise.resolve({
2336
2338
  for (;;)
2337
2339
  switch (e.prev = e.next) {
2338
2340
  case 0:
2339
- if (!ze(this._config.publicToken)) {
2341
+ if (!Ue(this._config.publicToken)) {
2340
2342
  e.next = 2;
2341
2343
  break;
2342
2344
  }
@@ -2441,13 +2443,20 @@ var Ye = Promise.resolve({
2441
2443
  method: "GET"
2442
2444
  });
2443
2445
  case 2:
2444
- return t = e.sent, e.abrupt("return", t.organization);
2445
- case 4:
2446
+ return t = e.sent, this._subscriptionService.updateOrganization(t.organization), e.abrupt("return", t.organization);
2447
+ case 5:
2446
2448
  case "end":
2447
2449
  return e.stop();
2448
2450
  }
2449
2451
  }, e, this);
2450
2452
  }));
2453
+ }, this.getSync = function () {
2454
+ return n._subscriptionService.getOrganization();
2455
+ }, this.onChange = function (e) {
2456
+ return n._subscriptionService.subscribeToState(function (t) {
2457
+ var r;
2458
+ return e(null !== (r = null == t ? void 0 : t.organization) && void 0 !== r ? r : null);
2459
+ });
2451
2460
  }, this.update = function (e) {
2452
2461
  return we(n, void 0, void 0, de().mark(function t() {
2453
2462
  var r;
@@ -2700,7 +2709,8 @@ var Ye = Promise.resolve({
2700
2709
  return s = t.sent, this._pkceManager.clearPKPair(), s.member_session ? this._subscriptionService.updateStateAndTokens({
2701
2710
  state: {
2702
2711
  session: s.member_session,
2703
- member: s.member
2712
+ member: s.member,
2713
+ organization: s.organization
2704
2714
  },
2705
2715
  session_token: s.session_token,
2706
2716
  session_jwt: s.session_jwt,
@@ -2735,7 +2745,7 @@ var Ye = Promise.resolve({
2735
2745
  }
2736
2746
  return e.abrupt("return", "https://".concat(r));
2737
2747
  case 6:
2738
- if (!ze(this._config.publicToken)) {
2748
+ if (!Ue(this._config.publicToken)) {
2739
2749
  e.next = 8;
2740
2750
  break;
2741
2751
  }
@@ -2879,7 +2889,8 @@ var Ye = Promise.resolve({
2879
2889
  return n = t.sent, this._subscriptionService.updateStateAndTokens({
2880
2890
  state: {
2881
2891
  session: n.member_session,
2882
- member: n.member
2892
+ member: n.member,
2893
+ organization: n.organization
2883
2894
  },
2884
2895
  session_token: n.session_token,
2885
2896
  session_jwt: n.session_jwt,
@@ -2910,7 +2921,8 @@ var Ye = Promise.resolve({
2910
2921
  return (r = t.sent).member_session ? this._subscriptionService.updateStateAndTokens({
2911
2922
  state: {
2912
2923
  session: r.member_session,
2913
- member: r.member
2924
+ member: r.member,
2925
+ organization: r.organization
2914
2926
  },
2915
2927
  session_token: r.session_token,
2916
2928
  session_jwt: r.session_jwt,
@@ -2996,7 +3008,8 @@ var Ye = Promise.resolve({
2996
3008
  return (n = t.sent).member_session ? this._subscriptionService.updateStateAndTokens({
2997
3009
  state: {
2998
3010
  session: n.member_session,
2999
- member: n.member
3011
+ member: n.member,
3012
+ organization: n.organization
3000
3013
  },
3001
3014
  session_token: n.session_token,
3002
3015
  session_jwt: n.session_jwt,
@@ -3042,7 +3055,8 @@ var Ye = Promise.resolve({
3042
3055
  return (n = t.sent).member_session ? this._subscriptionService.updateStateAndTokens({
3043
3056
  state: {
3044
3057
  session: n.member_session,
3045
- member: n.member
3058
+ member: n.member,
3059
+ organization: n.organization
3046
3060
  },
3047
3061
  session_token: n.session_token,
3048
3062
  session_jwt: n.session_jwt,
@@ -3126,7 +3140,8 @@ var tt = pe(function e(t, r) {
3126
3140
  return s = t.sent, this._subscriptionService.updateStateAndTokens({
3127
3141
  state: {
3128
3142
  session: s.member_session,
3129
- member: s.member
3143
+ member: s.member,
3144
+ organization: s.organization
3130
3145
  },
3131
3146
  session_token: s.session_token,
3132
3147
  session_jwt: s.session_jwt,
@@ -3207,7 +3222,8 @@ var tt = pe(function e(t, r) {
3207
3222
  return s = t.sent, this._subscriptionService.updateStateAndTokens({
3208
3223
  state: {
3209
3224
  session: s.member_session,
3210
- member: s.member
3225
+ member: s.member,
3226
+ organization: s.organization
3211
3227
  },
3212
3228
  session_token: s.session_token,
3213
3229
  session_jwt: s.session_jwt,
@@ -3650,7 +3666,8 @@ var kt = /*#__PURE__*/ function () {
3650
3666
  return _context6.abrupt("return", (o.member_session ? this._subscriptionService.updateStateAndTokens({
3651
3667
  state: {
3652
3668
  session: o.member_session,
3653
- member: o.member
3669
+ member: o.member,
3670
+ organization: o.organization
3654
3671
  },
3655
3672
  session_token: o.session_token,
3656
3673
  session_jwt: o.session_jwt,
@@ -3754,7 +3771,8 @@ var kt = /*#__PURE__*/ function () {
3754
3771
  return _context8.abrupt("return", (this._pkceManager.clearPKPair(), o.member_session ? this._subscriptionService.updateStateAndTokens({
3755
3772
  state: {
3756
3773
  session: o.member_session,
3757
- member: o.member
3774
+ member: o.member,
3775
+ organization: o.organization
3758
3776
  },
3759
3777
  session_token: o.session_token,
3760
3778
  session_jwt: o.session_jwt,
@@ -3809,7 +3827,8 @@ var kt = /*#__PURE__*/ function () {
3809
3827
  return _context9.abrupt("return", (n.member_session ? this._subscriptionService.updateStateAndTokens({
3810
3828
  state: {
3811
3829
  session: n.member_session,
3812
- member: n.member
3830
+ member: n.member,
3831
+ organization: n.organization
3813
3832
  },
3814
3833
  session_token: n.session_token,
3815
3834
  session_jwt: n.session_jwt,
@@ -3860,7 +3879,8 @@ var kt = /*#__PURE__*/ function () {
3860
3879
  return _context10.abrupt("return", (this._subscriptionService.updateStateAndTokens({
3861
3880
  state: {
3862
3881
  session: n.member_session,
3863
- member: n.member
3882
+ member: n.member,
3883
+ organization: n.organization
3864
3884
  },
3865
3885
  session_token: n.session_token,
3866
3886
  session_jwt: n.session_jwt,
@@ -4123,7 +4143,7 @@ var At = /*#__PURE__*/ function () {
4123
4143
  },
4124
4144
  sdk: {
4125
4145
  identifier: "Stytch.js Javascript SDK",
4126
- version: "4.1.0"
4146
+ version: "4.2.0"
4127
4147
  }
4128
4148
  });
4129
4149
  }
@@ -4442,7 +4462,7 @@ var It = /*#__PURE__*/ function () {
4442
4462
  removeItem: function removeItem(e) {
4443
4463
  return sessionStorage.removeItem(Rt(_this4.publicToken, e));
4444
4464
  }
4445
- }, this.publicToken = e, this.state = null, this.subscriptions = {}, (null == t ? void 0 : t.cookieOptions) ? (qe("SubscriptionDataLayer").isOptionalString("cookieOptions.opaqueTokenCookieName", t.cookieOptions.opaqueTokenCookieName).isOptionalString("cookieOptions.jwtCookieName", t.cookieOptions.jwtCookieName).isOptionalString("cookieOptions.istCookieName", t.cookieOptions.istCookieName).isOptionalString("cookieOptions.path", t.cookieOptions.path).isOptionalString("cookieOptions.domain", t.cookieOptions.domain), this._jwtCookieName = t.cookieOptions.jwtCookieName || null, this._opaqueTokenCookieName = t.cookieOptions.opaqueTokenCookieName || null, this._cookiePath = t.cookieOptions.path || null, this._domain = t.cookieOptions.domain || null, this._cookieAvailableToSubdomains = t.cookieOptions.availableToSubdomains || !1, this._istCookieName = t.cookieOptions.istCookieName || null) : (this._opaqueTokenCookieName = null, this._jwtCookieName = null, this._cookiePath = null, this._domain = null, this._cookieAvailableToSubdomains = !1, this._istCookieName = null);
4465
+ }, this.publicToken = e, this.state = null, this.stateKeysUpdated = new Set(), this.subscriptions = {}, (null == t ? void 0 : t.cookieOptions) ? (qe("SubscriptionDataLayer").isOptionalString("cookieOptions.opaqueTokenCookieName", t.cookieOptions.opaqueTokenCookieName).isOptionalString("cookieOptions.jwtCookieName", t.cookieOptions.jwtCookieName).isOptionalString("cookieOptions.istCookieName", t.cookieOptions.istCookieName).isOptionalString("cookieOptions.path", t.cookieOptions.path).isOptionalString("cookieOptions.domain", t.cookieOptions.domain), this._jwtCookieName = t.cookieOptions.jwtCookieName || null, this._opaqueTokenCookieName = t.cookieOptions.opaqueTokenCookieName || null, this._cookiePath = t.cookieOptions.path || null, this._domain = t.cookieOptions.domain || null, this._cookieAvailableToSubdomains = t.cookieOptions.availableToSubdomains || !1, this._istCookieName = t.cookieOptions.istCookieName || null) : (this._opaqueTokenCookieName = null, this._jwtCookieName = null, this._cookiePath = null, this._domain = null, this._cookieAvailableToSubdomains = !1, this._istCookieName = null);
4446
4466
  var r = localStorage.getItem(Rt(this.publicToken));
4447
4467
  if (!r)
4448
4468
  return;
@@ -4566,6 +4586,15 @@ var It = /*#__PURE__*/ function () {
4566
4586
  value: function removeItem(e) {
4567
4587
  return localStorage.removeItem(Rt(this.publicToken, e));
4568
4588
  }
4589
+ }, {
4590
+ key: "markStateKeysUpdated",
4591
+ value: function markStateKeysUpdated(e) {
4592
+ var _this6 = this;
4593
+ var t = this.stateKeysUpdated.size;
4594
+ return e.forEach(function (e) {
4595
+ return _this6.stateKeysUpdated.add(e);
4596
+ }), t !== this.stateKeysUpdated.size;
4597
+ }
4569
4598
  }], [{
4570
4599
  key: "generateCookieOpts",
4571
4600
  value: function generateCookieOpts(_ref4) {
@@ -4616,15 +4645,15 @@ var Lt = Symbol["for"]("__stytch_b2b_DataLayer"), Mt = function Mt(e, t) {
4616
4645
  });
4617
4646
  var Nt = /*#__PURE__*/ function () {
4618
4647
  function Nt(e, t) {
4619
- var _this6 = this;
4648
+ var _this7 = this;
4620
4649
  _classCallCheck(this, Nt);
4621
4650
  this._publicToken = e, this._datalayer = t, this._listen = function (e) {
4622
- if (e.key !== Rt(_this6._publicToken))
4651
+ if (e.key !== Rt(_this7._publicToken))
4623
4652
  return;
4624
4653
  if (null === e.newValue || "null" === e.newValue)
4625
- return void _this6.destroyState();
4654
+ return void _this7.destroyState();
4626
4655
  var t = JSON.parse(e.newValue);
4627
- _this6.updateState(t);
4656
+ _this7.updateState(t);
4628
4657
  }, window.addEventListener("storage", this._listen);
4629
4658
  var _this$_datalayer$read = this._datalayer.readSessionCookie(), r = _this$_datalayer$read.session_token;
4630
4659
  r || this.destroyState();
@@ -4657,7 +4686,9 @@ var Nt = /*#__PURE__*/ function () {
4657
4686
  key: "_updateStateAndTokensInternal",
4658
4687
  value: function _updateStateAndTokensInternal(e) {
4659
4688
  var t = this._datalayer.state, r = null === e.state ? null : Object.assign(Object.assign({}, this._datalayer.state), e.state);
4660
- this._datalayer.state = r, Ft(t, r) || jt(this._datalayer.subscriptions, r);
4689
+ this._datalayer.state = r;
4690
+ var n = e.state ? Object.keys(e.state) : [];
4691
+ !this._datalayer.markStateKeysUpdated(n) && Ft(t, r) || jt(this._datalayer.subscriptions, r);
4661
4692
  }
4662
4693
  }, {
4663
4694
  key: "updateStateAndTokens",
@@ -4668,7 +4699,9 @@ var Nt = /*#__PURE__*/ function () {
4668
4699
  key: "updateState",
4669
4700
  value: function updateState(e) {
4670
4701
  var t = this._datalayer.state, r = null === e ? null : Object.assign(Object.assign({}, this._datalayer.state), e);
4671
- this._datalayer.state = r, Ft(t, r) || (jt(this._datalayer.subscriptions, r), this._datalayer.syncToLocalStorage());
4702
+ this._datalayer.state = r;
4703
+ var n = e ? Object.keys(e) : [], i = this._datalayer.markStateKeysUpdated(n), o = !Ft(t, r);
4704
+ (i || o) && (jt(this._datalayer.subscriptions, r), o && this._datalayer.syncToLocalStorage());
4672
4705
  }
4673
4706
  }, {
4674
4707
  key: "updateTokens",
@@ -4711,32 +4744,39 @@ var Kt = /*#__PURE__*/ function (_Nt) {
4711
4744
  _inherits(Kt, _Nt);
4712
4745
  var _super3 = _createSuper(Kt);
4713
4746
  function Kt() {
4714
- var _this7;
4747
+ var _this8;
4715
4748
  _classCallCheck(this, Kt);
4716
- _this7 = _super3.apply(this, arguments), _this7.updateMember = function (e) {
4717
- return _this7.updateState({
4749
+ _this8 = _super3.apply(this, arguments), _this8.updateMember = function (e) {
4750
+ return _this8.updateState({
4718
4751
  member: e
4719
4752
  });
4720
- }, _this7.getMember = function () {
4753
+ }, _this8.getMember = function () {
4754
+ var e, t;
4755
+ return null !== (t = null === (e = _this8.getState()) || void 0 === e ? void 0 : e.member) && void 0 !== t ? t : null;
4756
+ }, _this8.updateOrganization = function (e) {
4757
+ return _this8.updateState({
4758
+ organization: e
4759
+ });
4760
+ }, _this8.getOrganization = function () {
4721
4761
  var e, t;
4722
- return null !== (t = null === (e = _this7.getState()) || void 0 === e ? void 0 : e.member) && void 0 !== t ? t : null;
4723
- }, _this7.getSession = function () {
4762
+ return null !== (t = null === (e = _this8.getState()) || void 0 === e ? void 0 : e.organization) && void 0 !== t ? t : null;
4763
+ }, _this8.getSession = function () {
4724
4764
  var e, t;
4725
- return null !== (t = null === (e = _this7.getState()) || void 0 === e ? void 0 : e.session) && void 0 !== t ? t : null;
4765
+ return null !== (t = null === (e = _this8.getState()) || void 0 === e ? void 0 : e.session) && void 0 !== t ? t : null;
4726
4766
  };
4727
- return _this7;
4767
+ return _this8;
4728
4768
  }
4729
4769
  return _createClass(Kt);
4730
4770
  }(Nt);
4731
- var Ut = Symbol["for"]("stytch__internal_b2b");
4732
- var zt = /*#__PURE__*/ _createClass(function zt(e, t) {
4733
- var _this8 = this;
4734
- _classCallCheck(this, zt);
4771
+ var zt = Symbol["for"]("stytch__internal_b2b");
4772
+ var Ut = /*#__PURE__*/ _createClass(function Ut(e, t) {
4773
+ var _this9 = this;
4774
+ _classCallCheck(this, Ut);
4735
4775
  var r;
4736
4776
  !function (e) {
4737
4777
  if ("undefined" == typeof window)
4738
4778
  throw new Error("The ".concat(e, " is not compatible with server-side environments.\nIf using nextjs, use the create").concat(e, " method instead.\n```\n").concat("import { createStytchB2BHeadlessClient } from '@stytch/nextjs/b2b';\n \n const stytch = createStytchB2BHeadlessClient('public-token-...');\n ", "\n```\n"));
4739
- }("StytchB2BHeadlessClient"), "string" != typeof (r = e) ? Ne("Public token is malformed. Expected a string, got ".concat(le(r), ".").concat(Ue)) : "" === r ? Ne('Public token is malformed. Expected "public-token-...", got an empty string.'.concat(Ue)) : r.startsWith("public-token-") || Ne('Public token is malformed. Expected "public-token-...", got '.concat(r, ".").concat(Ue));
4779
+ }("StytchB2BHeadlessClient"), "string" != typeof (r = e) ? Ne("Public token is malformed. Expected a string, got ".concat(le(r), ".").concat(ze)) : "" === r ? Ne('Public token is malformed. Expected "public-token-...", got an empty string.'.concat(ze)) : r.startsWith("public-token-") || Ne('Public token is malformed. Expected "public-token-...", got '.concat(r, ".").concat(ze));
4740
4780
  var n = t, i = {
4741
4781
  cookieOptions: null == (o = n) ? void 0 : o.cookieOptions,
4742
4782
  endpoints: {
@@ -4753,8 +4793,8 @@ var zt = /*#__PURE__*/ _createClass(function zt(e, t) {
4753
4793
  this._networkClient = new At(e, this._dataLayer, i.endpoints.sdkBackendURL, function () {
4754
4794
  var e, t, r, n;
4755
4795
  return {
4756
- stytch_member_id: null === (t = null === (e = _this8._dataLayer.state) || void 0 === e ? void 0 : e.member) || void 0 === t ? void 0 : t.member_id,
4757
- stytch_member_session_id: null === (n = null === (r = _this8._dataLayer.state) || void 0 === r ? void 0 : r.session) || void 0 === n ? void 0 : n.member_session_id
4796
+ stytch_member_id: null === (t = null === (e = _this9._dataLayer.state) || void 0 === e ? void 0 : e.member) || void 0 === t ? void 0 : t.member_id,
4797
+ stytch_member_session_id: null === (n = null === (r = _this9._dataLayer.state) || void 0 === r ? void 0 : r.session) || void 0 === n ? void 0 : n.member_session_id
4758
4798
  };
4759
4799
  });
4760
4800
  var v = new St(e, this._networkClient, this._dataLayer), b = new Pt(v.getAsync()), g = new We(e, i.endpoints.dfpBackendURL, v.getAsync(), b.executeRecaptcha);
@@ -4777,7 +4817,7 @@ var zt = /*#__PURE__*/ _createClass(function zt(e, t) {
4777
4817
  }
4778
4818
  });
4779
4819
  (function (e, t) {
4780
- Object.assign(e, _defineProperty({}, Ut, t));
4820
+ Object.assign(e, _defineProperty({}, zt, t));
4781
4821
  })(this, {
4782
4822
  bootstrap: v,
4783
4823
  publicToken: e,
@@ -4842,7 +4882,7 @@ const createStytchB2BHeadlessClient = (...args) => {
4842
4882
  if (typeof window === 'undefined') {
4843
4883
  return createStytchSSRProxy();
4844
4884
  }
4845
- return new zt(...args);
4885
+ return new Ut(...args);
4846
4886
  };
4847
4887
 
4848
4888
  exports.createStytchB2BHeadlessClient = createStytchB2BHeadlessClient;
package/dist/b2b/index.js CHANGED
@@ -52,9 +52,15 @@ const initialMemberSession = {
52
52
  fromCache: false,
53
53
  isInitialized: false,
54
54
  };
55
+ const initialOrganization = {
56
+ organization: null,
57
+ fromCache: false,
58
+ isInitialized: false,
59
+ };
55
60
  const StytchContext = React.createContext({ isMounted: false });
56
61
  const StytchMemberContext = React.createContext(initialMember);
57
62
  const StytchMemberSessionContext = React.createContext(initialMemberSession);
63
+ const StytchOrganizationContext = React.createContext(initialOrganization);
58
64
  const useIsMounted__INTERNAL = () => React.useContext(StytchContext).isMounted;
59
65
  const isUIClient = (client) => {
60
66
  return client.mount !== undefined;
@@ -97,6 +103,23 @@ const useStytchMemberSession = () => {
97
103
  invariant(useIsMounted__INTERNAL(), noProviderError('useStytchMemberSession', 'StytchB2BProvider'));
98
104
  return React.useContext(StytchMemberSessionContext);
99
105
  };
106
+ /**
107
+ * Returns the active Stytch organization.
108
+ * The Stytch SDKs are used for client-side authentication and session management.
109
+ * Check the isInitialized property to determine if the SDK has completed initialization.
110
+ * Check the fromCache property to determine if the session data is from persistent storage.
111
+ * See Next's {@link https://nextjs.org/docs/authentication#authenticating-statically-generated-pages documentation} for more.
112
+ * @example
113
+ * const {organization, isInitialized, fromCache} = useStytchOrganization();
114
+ * if (!isInitialized) {
115
+ * return <p>Loading...</p>;
116
+ * }
117
+ * return (<p>Welcome to {organization.organization_name}</p>);
118
+ */
119
+ const useStytchOrganization = () => {
120
+ invariant(useIsMounted__INTERNAL(), noProviderError('useStytchOrganization', 'StytchB2BProvider'));
121
+ return React.useContext(StytchOrganizationContext);
122
+ };
100
123
  /**
101
124
  * Determines whether the logged-in member is allowed to perform the specified action on the specified resource.
102
125
  * Returns `true` if the member can perform the action, `false` otherwise.
@@ -178,6 +201,15 @@ const withStytchMemberSession = (Component) => {
178
201
  WithStytchSession.displayName = `withStytchMemberSession(${Component.displayName || Component.name || 'Component'})`;
179
202
  return WithStytchSession;
180
203
  };
204
+ const withStytchOrganization = (Component) => {
205
+ const WithStytchOrganization = (props) => {
206
+ invariant(useIsMounted__INTERNAL(), noProviderError('withStytchOrganization', 'StytchB2BProvider'));
207
+ const { organization, isInitialized, fromCache } = useStytchOrganization();
208
+ return (React__default['default'].createElement(Component, Object.assign({}, props, { stytchOrganization: organization, stytchOrganizationIsInitialized: isInitialized, stytchOrganizationIsFromCache: fromCache })));
209
+ };
210
+ WithStytchOrganization.displayName = `withStytchOrganization(${Component.displayName || Component.name || 'Component'})`;
211
+ return WithStytchOrganization;
212
+ };
181
213
  /**
182
214
  * Wrap your component with this HOC in order to receive the permissions for the logged-in member.
183
215
  * Evaluates all permissions granted to the logged-in member.
@@ -234,6 +266,7 @@ const StytchB2BProvider = ({ stytch, children }) => {
234
266
  const ctx = React.useMemo(() => ({ client: stytch, isMounted: true }), [stytch]);
235
267
  const [member, setMember] = useAsyncState(initialMember);
236
268
  const [session, setMemberSession] = useAsyncState(initialMemberSession);
269
+ const [organization, setOrganization] = useAsyncState(initialOrganization);
237
270
  React.useEffect(() => {
238
271
  if (isStytchSSRProxy(stytch)) {
239
272
  return;
@@ -248,18 +281,36 @@ const StytchB2BProvider = ({ stytch, children }) => {
248
281
  fromCache: true,
249
282
  isInitialized: true,
250
283
  });
284
+ setOrganization({
285
+ organization: stytch.organization.getSync(),
286
+ fromCache: true,
287
+ isInitialized: true,
288
+ });
251
289
  const unsubscribeMember = stytch.self.onChange((member) => setMember({ member, fromCache: false, isInitialized: true }));
252
290
  const unsubscribeMemberSession = stytch.session.onChange((session) => setMemberSession({ session, fromCache: false, isInitialized: true }));
291
+ const unsubscribeOrganization = stytch.organization.onChange((organization) => setOrganization({ organization, fromCache: false, isInitialized: true }));
253
292
  return () => {
254
293
  unsubscribeMember();
255
294
  unsubscribeMemberSession();
295
+ unsubscribeOrganization();
296
+ };
297
+ }, [stytch, setMember, setMemberSession, setOrganization]);
298
+ const allValuesReady = !!member.member === !!session.session && !!session.session === !!organization.organization;
299
+ const finalValues = allValuesReady
300
+ ? {
301
+ member,
302
+ session,
303
+ organization,
304
+ }
305
+ : {
306
+ member: initialMember,
307
+ session: initialMemberSession,
308
+ organization: initialOrganization,
256
309
  };
257
- }, [stytch, setMember, setMemberSession]);
258
- const finalMemberSession = !!session.session === !!member.member ? session : initialMemberSession;
259
- const finalMember = !!session.session === !!member.member ? member : initialMember;
260
310
  return (React__default['default'].createElement(StytchContext.Provider, { value: ctx },
261
- React__default['default'].createElement(StytchMemberContext.Provider, { value: finalMember },
262
- React__default['default'].createElement(StytchMemberSessionContext.Provider, { value: finalMemberSession }, children))));
311
+ React__default['default'].createElement(StytchOrganizationContext.Provider, { value: finalValues.organization },
312
+ React__default['default'].createElement(StytchMemberContext.Provider, { value: finalValues.member },
313
+ React__default['default'].createElement(StytchMemberSessionContext.Provider, { value: finalValues.session }, children)))));
263
314
  };
264
315
 
265
316
  /**
@@ -327,7 +378,9 @@ exports.useStytchB2BClient = useStytchB2BClient;
327
378
  exports.useStytchIsAuthorized = useStytchIsAuthorized;
328
379
  exports.useStytchMember = useStytchMember;
329
380
  exports.useStytchMemberSession = useStytchMemberSession;
381
+ exports.useStytchOrganization = useStytchOrganization;
330
382
  exports.withStytchB2BClient = withStytchB2BClient;
331
383
  exports.withStytchMember = withStytchMember;
332
384
  exports.withStytchMemberSession = withStytchMemberSession;
385
+ exports.withStytchOrganization = withStytchOrganization;
333
386
  exports.withStytchPermissions = withStytchPermissions;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stytch/nextjs",
3
- "version": "16.0.0",
3
+ "version": "17.0.0",
4
4
  "description": "Stytch's official Next.js Library",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.esm.js",
@@ -22,7 +22,7 @@
22
22
  "author": "Stytch",
23
23
  "devDependencies": {
24
24
  "@babel/runtime": "7.18.6",
25
- "@stytch/vanilla-js": "4.1.0",
25
+ "@stytch/vanilla-js": "4.2.0",
26
26
  "@testing-library/react": "14.0.0",
27
27
  "eslint-config-custom": "0.0.1",
28
28
  "react-dom": ">= 17.0.2",
@@ -31,7 +31,7 @@
31
31
  "typescript": "4.7.4"
32
32
  },
33
33
  "peerDependencies": {
34
- "@stytch/vanilla-js": "^4.1.0",
34
+ "@stytch/vanilla-js": "^4.2.0",
35
35
  "react": ">= 17.0.2",
36
36
  "react-dom": ">= 17.0.2"
37
37
  },