@civic/auth 0.0.1-beta.2 → 0.0.1-beta.21

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 (84) hide show
  1. package/README.md +26 -0
  2. package/dist/AuthProvider-Bj_Prt1x.d.ts +21 -0
  3. package/dist/AuthProvider-DUAoX4G9.d.mts +21 -0
  4. package/dist/UserProvider-CMLaYOUD.d.ts +16 -0
  5. package/dist/UserProvider-Cbm8MZkJ.d.mts +16 -0
  6. package/dist/chunk-4PLCDPEN.mjs +599 -0
  7. package/dist/chunk-4PLCDPEN.mjs.map +1 -0
  8. package/dist/chunk-5UQQYXCX.js +1 -0
  9. package/dist/chunk-5UQQYXCX.js.map +1 -0
  10. package/dist/chunk-6RFRDWIP.js +223 -0
  11. package/dist/chunk-6RFRDWIP.js.map +1 -0
  12. package/dist/chunk-7K3QN2AT.js +599 -0
  13. package/dist/chunk-7K3QN2AT.js.map +1 -0
  14. package/dist/chunk-AP4627CS.mjs +223 -0
  15. package/dist/chunk-AP4627CS.mjs.map +1 -0
  16. package/dist/chunk-CRTRMMJ7.js.map +1 -1
  17. package/dist/chunk-CTVJJBBA.js +118 -0
  18. package/dist/chunk-CTVJJBBA.js.map +1 -0
  19. package/dist/chunk-FHRZSX3C.js +710 -0
  20. package/dist/chunk-FHRZSX3C.js.map +1 -0
  21. package/dist/chunk-JDZPCA3P.js +173 -0
  22. package/dist/chunk-JDZPCA3P.js.map +1 -0
  23. package/dist/chunk-MK7557NR.mjs +118 -0
  24. package/dist/chunk-MK7557NR.mjs.map +1 -0
  25. package/dist/chunk-NLRREFOX.mjs +710 -0
  26. package/dist/chunk-NLRREFOX.mjs.map +1 -0
  27. package/dist/chunk-O3WGNLRO.mjs +173 -0
  28. package/dist/chunk-O3WGNLRO.mjs.map +1 -0
  29. package/dist/chunk-PMJAV4JJ.mjs +1 -0
  30. package/dist/chunk-PMJAV4JJ.mjs.map +1 -0
  31. package/dist/index.css +63 -70
  32. package/dist/index.css.map +1 -1
  33. package/dist/index.d.mts +3 -1
  34. package/dist/index.d.ts +3 -1
  35. package/dist/index.js +2 -1
  36. package/dist/index.js.map +1 -1
  37. package/dist/index.mjs +1 -0
  38. package/dist/nextjs/client.css +335 -0
  39. package/dist/nextjs/client.css.map +1 -0
  40. package/dist/nextjs/client.d.mts +12 -0
  41. package/dist/nextjs/client.d.ts +12 -0
  42. package/dist/nextjs/client.js +179 -0
  43. package/dist/nextjs/client.js.map +1 -0
  44. package/dist/nextjs/client.mjs +179 -0
  45. package/dist/nextjs/client.mjs.map +1 -0
  46. package/dist/nextjs.d.mts +67 -15
  47. package/dist/nextjs.d.ts +67 -15
  48. package/dist/nextjs.js +158 -180
  49. package/dist/nextjs.js.map +1 -1
  50. package/dist/nextjs.mjs +155 -177
  51. package/dist/nextjs.mjs.map +1 -1
  52. package/dist/react.d.mts +31 -81
  53. package/dist/react.d.ts +31 -81
  54. package/dist/react.js +35 -634
  55. package/dist/react.js.map +1 -1
  56. package/dist/react.mjs +65 -664
  57. package/dist/react.mjs.map +1 -1
  58. package/dist/server.d.mts +14 -34
  59. package/dist/server.d.ts +14 -34
  60. package/dist/server.js +4 -185
  61. package/dist/server.js.map +1 -1
  62. package/dist/server.mjs +10 -191
  63. package/dist/server.mjs.map +1 -1
  64. package/dist/storage-B2eAQNdv.d.ts +25 -0
  65. package/dist/storage-BJPUpxhm.d.mts +25 -0
  66. package/dist/types-Bqm9OCZN.d.mts +22 -0
  67. package/dist/types-Bqm9OCZN.d.ts +22 -0
  68. package/dist/types-HdCjGldB.d.mts +58 -0
  69. package/dist/types-HdCjGldB.d.ts +58 -0
  70. package/package.json +26 -17
  71. package/dist/chunk-5NUJ7LFF.mjs +0 -17
  72. package/dist/chunk-5NUJ7LFF.mjs.map +0 -1
  73. package/dist/chunk-KS7ERXGZ.js +0 -481
  74. package/dist/chunk-KS7ERXGZ.js.map +0 -1
  75. package/dist/chunk-NINRO7GS.js +0 -209
  76. package/dist/chunk-NINRO7GS.js.map +0 -1
  77. package/dist/chunk-NXBKSUKI.mjs +0 -481
  78. package/dist/chunk-NXBKSUKI.mjs.map +0 -1
  79. package/dist/chunk-T7HUHQ3J.mjs +0 -209
  80. package/dist/chunk-T7HUHQ3J.mjs.map +0 -1
  81. package/dist/chunk-WZLC5B4C.js +0 -17
  82. package/dist/chunk-WZLC5B4C.js.map +0 -1
  83. package/dist/index-DoDoIY_K.d.mts +0 -79
  84. package/dist/index-DoDoIY_K.d.ts +0 -79
package/dist/react.mjs CHANGED
@@ -1,14 +1,22 @@
1
1
  import {
2
- AuthSessionServiceImpl,
3
- resolveAuthConfig
4
- } from "./chunk-NXBKSUKI.mjs";
2
+ AuthProvider,
3
+ CivicAuthIframeContainer,
4
+ UserContext,
5
+ UserProvider,
6
+ useAuth,
7
+ useConfig,
8
+ useIframe,
9
+ useSession,
10
+ useToken
11
+ } from "./chunk-NLRREFOX.mjs";
5
12
  import {
6
- DEFAULT_SCOPES,
7
- IFRAME_ID
8
- } from "./chunk-5NUJ7LFF.mjs";
13
+ resolveAuthConfig
14
+ } from "./chunk-O3WGNLRO.mjs";
9
15
  import {
16
+ BrowserPublicClientPKCEProducer,
17
+ LocalStorageAdapter,
10
18
  cn
11
- } from "./chunk-T7HUHQ3J.mjs";
19
+ } from "./chunk-4PLCDPEN.mjs";
12
20
  import {
13
21
  __async,
14
22
  __objRest,
@@ -17,635 +25,27 @@ import {
17
25
  } from "./chunk-RGHW4PYM.mjs";
18
26
 
19
27
  // src/react/hooks/useUser.tsx
20
- import { useContext as useContext5 } from "react";
21
-
22
- // src/react/providers/UserProvider.tsx
23
- import { createContext as createContext4 } from "react";
24
- import { useQuery } from "@tanstack/react-query";
25
-
26
- // src/react/hooks/useAuth.tsx
27
28
  import { useContext } from "react";
28
29
 
29
- // src/shared/AuthContext.tsx
30
- import { createContext } from "react";
31
- var AuthContext = createContext(null);
32
-
33
- // src/react/hooks/useAuth.tsx
34
- var useAuth = () => {
35
- const context = useContext(AuthContext);
36
- if (!context) {
37
- throw new Error("useAuth must be used within an AuthProvider");
38
- }
39
- return context;
40
- };
41
-
42
- // src/react/hooks/useToken.tsx
43
- import { useContext as useContext3 } from "react";
44
-
45
- // src/react/providers/TokenProvider.tsx
46
- import { createContext as createContext3, useMemo } from "react";
47
- import { useMutation, useQueryClient } from "@tanstack/react-query";
48
-
49
- // src/react/hooks/useSession.tsx
50
- import { useContext as useContext2 } from "react";
51
-
52
- // src/react/providers/SessionProvider.tsx
53
- import { createContext as createContext2 } from "react";
54
- import { jsx } from "react/jsx-runtime";
55
- var defaultSession = {
56
- authenticated: false,
57
- idToken: void 0,
58
- accessToken: void 0,
59
- displayMode: "iframe"
60
- };
61
- var SessionContext = createContext2(defaultSession);
62
- var SessionProvider = ({ children, session }) => /* @__PURE__ */ jsx(SessionContext.Provider, { value: session || defaultSession, children });
63
-
64
- // src/react/hooks/useSession.tsx
65
- var useSession = () => {
66
- const context = useContext2(SessionContext);
67
- if (!context) {
68
- throw new Error("useSession must be used within an SessionProvider");
69
- }
70
- return context;
71
- };
72
-
73
- // src/react/providers/TokenProvider.tsx
74
- import { parseJWT } from "oslo/jwt";
75
-
76
- // src/lib/jwt.ts
77
- var convertForwardedTokenFormat = (inputTokens) => Object.fromEntries(
78
- Object.entries(inputTokens).map(([source, tokens]) => [
79
- source,
80
- {
81
- idToken: tokens == null ? void 0 : tokens.id_token,
82
- accessToken: tokens == null ? void 0 : tokens.access_token,
83
- refreshToken: tokens == null ? void 0 : tokens.refresh_token
84
- }
85
- ])
86
- );
87
-
88
- // src/react/providers/TokenProvider.tsx
89
- import { jsx as jsx2 } from "react/jsx-runtime";
90
- var TokenContext = createContext3(void 0);
91
- var TokenProvider = ({ children }) => {
92
- const { isLoading, error: authError } = useAuth();
93
- const session = useSession();
94
- const queryClient3 = useQueryClient();
95
- const refreshTokenMutation = useMutation({
96
- mutationFn: () => __async(void 0, null, function* () {
97
- throw new Error("Method not implemented.");
98
- }),
99
- onSuccess: () => {
100
- queryClient3.invalidateQueries({ queryKey: ["session"] });
101
- }
102
- });
103
- const decodeTokens = useMemo(() => {
104
- if (!(session == null ? void 0 : session.idToken)) return null;
105
- const parsedJWT = parseJWT(session.idToken);
106
- if (!parsedJWT) return null;
107
- const { forwardedTokens } = parsedJWT.payload;
108
- return forwardedTokens ? convertForwardedTokenFormat(forwardedTokens) : null;
109
- }, [session == null ? void 0 : session.idToken]);
110
- const value = useMemo(
111
- () => ({
112
- accessToken: session.accessToken || null,
113
- idToken: session.idToken || null,
114
- forwardedTokens: decodeTokens || {},
115
- refreshToken: refreshTokenMutation.mutateAsync,
116
- isLoading,
117
- error: authError || refreshTokenMutation.error
118
- }),
119
- [
120
- session.accessToken,
121
- session.idToken,
122
- decodeTokens,
123
- refreshTokenMutation.mutateAsync,
124
- refreshTokenMutation.error,
125
- isLoading,
126
- authError
127
- ]
128
- );
129
- return /* @__PURE__ */ jsx2(TokenContext.Provider, { value, children });
130
- };
131
-
132
- // src/react/hooks/useToken.tsx
133
- var useToken = () => {
134
- const context = useContext3(TokenContext);
135
- if (!context) {
136
- throw new Error("useToken must be used within a TokenProvider");
137
- }
138
- return context;
139
- };
140
-
141
- // src/react/providers/UserProvider.tsx
142
- import { jsx as jsx3 } from "react/jsx-runtime";
143
- var UserContext = createContext4(null);
144
- var UserProvider = ({
145
- children,
146
- userInfoService
147
- }) => {
148
- const { isLoading: authLoading, error: authError } = useAuth();
149
- const session = useSession();
150
- const { forwardedTokens, idToken, accessToken, refreshToken } = useToken();
151
- const { signIn, signOut } = useAuth();
152
- const fetchUser = () => __async(void 0, null, function* () {
153
- if (!accessToken || !userInfoService) {
154
- return null;
155
- }
156
- const user2 = yield userInfoService == null ? void 0 : userInfoService.getUserInfo(accessToken, idToken);
157
- if (!user2) {
158
- return null;
159
- }
160
- return __spreadProps(__spreadValues({}, user2), {
161
- forwardedTokens,
162
- idToken,
163
- accessToken,
164
- refreshToken
165
- });
166
- });
167
- const {
168
- data: user,
169
- isLoading: userLoading,
170
- error: userError
171
- } = useQuery({
172
- queryKey: ["user", session == null ? void 0 : session.idToken],
173
- queryFn: fetchUser,
174
- enabled: !!(session == null ? void 0 : session.idToken)
175
- // Only run the query if we have an access token
176
- });
177
- const isLoading = authLoading || userLoading;
178
- const error = authError || userError;
179
- return /* @__PURE__ */ jsx3(
180
- UserContext.Provider,
181
- {
182
- value: {
183
- user: user != null ? user : null,
184
- isLoading,
185
- error,
186
- signIn,
187
- signOut
188
- },
189
- children
190
- }
191
- );
192
- };
193
-
194
- // src/shared/AuthProvider.tsx
195
- import {
196
- useCallback as useCallback2,
197
- useEffect as useEffect2,
198
- useMemo as useMemo2,
199
- useRef as useRef2,
200
- useState as useState2
201
- } from "react";
202
- import { useMutation as useMutation2, useQuery as useQuery2, useQueryClient as useQueryClient2 } from "@tanstack/react-query";
203
-
204
- // src/react/components/CivicAuthIframeModal.tsx
205
- import { useCallback, useEffect, useRef, useState } from "react";
206
-
207
- // src/react/components/LoadingIcon.tsx
208
- import { jsx as jsx4, jsxs } from "react/jsx-runtime";
209
- var LoadingIcon = () => /* @__PURE__ */ jsxs("div", { role: "status", children: [
210
- /* @__PURE__ */ jsxs(
211
- "svg",
212
- {
213
- "aria-hidden": "true",
214
- className: "inline h-8 w-8 animate-spin fill-neutral-600 text-neutral-200 dark:fill-neutral-300 dark:text-neutral-600",
215
- viewBox: "0 0 100 101",
216
- fill: "none",
217
- xmlns: "http://www.w3.org/2000/svg",
218
- children: [
219
- /* @__PURE__ */ jsx4(
220
- "path",
221
- {
222
- d: "M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z",
223
- fill: "currentColor"
224
- }
225
- ),
226
- /* @__PURE__ */ jsx4(
227
- "path",
228
- {
229
- d: "M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z",
230
- fill: "currentFill"
231
- }
232
- )
233
- ]
234
- }
235
- ),
236
- /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Loading..." })
237
- ] });
238
-
239
- // src/react/components/CloseIcon.tsx
240
- import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
241
- var CloseIcon = () => /* @__PURE__ */ jsxs2(
242
- "svg",
243
- {
244
- xmlns: "http://www.w3.org/2000/svg",
245
- width: "24",
246
- height: "24",
247
- viewBox: "0 0 24 24",
248
- fill: "none",
249
- stroke: "currentColor",
250
- strokeWidth: "2",
251
- strokeLinecap: "round",
252
- strokeLinejoin: "round",
253
- className: "lucide lucide-x",
254
- children: [
255
- /* @__PURE__ */ jsx5("path", { d: "M18 6 6 18" }),
256
- /* @__PURE__ */ jsx5("path", { d: "m6 6 12 12" })
257
- ]
258
- }
259
- );
260
-
261
- // src/react/components/CivicAuthIframe.tsx
262
- import { forwardRef } from "react";
263
- import { jsx as jsx6 } from "react/jsx-runtime";
264
- var CivicAuthIframe = forwardRef(
265
- ({ authUrl, onLoad }, ref) => {
266
- return /* @__PURE__ */ jsx6(
267
- "iframe",
268
- {
269
- id: IFRAME_ID,
270
- ref,
271
- src: authUrl,
272
- className: "h-96 w-80 border-none",
273
- onLoad
274
- }
275
- );
276
- }
277
- );
278
- CivicAuthIframe.displayName = "CivicAuthIframe";
279
-
280
- // src/react/components/CivicAuthIframeModal.tsx
281
- import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
282
- var CivicAuthIframeModal = ({
283
- authUrl,
284
- redirectUri,
285
- setAuthResponseUrl,
286
- onClose,
287
- iframeRef,
288
- redirectInProgress = false,
289
- closeOnRedirect = true
290
- }) => {
291
- const [isLoading, setIsLoading] = useState(true);
292
- const processIframeUrl = useCallback(() => {
293
- if (iframeRef.current && iframeRef.current.contentWindow) {
294
- try {
295
- const iframeUrl = iframeRef.current.contentWindow.location.href;
296
- if (iframeUrl.startsWith(redirectUri)) {
297
- setAuthResponseUrl(iframeUrl);
298
- if (closeOnRedirect) onClose();
299
- return true;
300
- }
301
- } catch (e) {
302
- console.log("Waiting for redirect...");
303
- }
304
- }
305
- return false;
306
- }, [closeOnRedirect, iframeRef, onClose, redirectUri, setAuthResponseUrl]);
307
- const intervalId = useRef();
308
- const handleEscape = useCallback(
309
- (event) => {
310
- if (event.key === "Escape") {
311
- onClose();
312
- }
313
- },
314
- [onClose]
315
- );
316
- useEffect(() => {
317
- window.addEventListener("keydown", handleEscape);
318
- return () => window.removeEventListener("keydown", handleEscape);
319
- });
320
- const handleIframeLoad = () => {
321
- setIsLoading(false);
322
- console.log("handleIframeLoad");
323
- if (processIframeUrl() && intervalId.current) {
324
- clearInterval(intervalId.current);
325
- }
326
- };
327
- return /* @__PURE__ */ jsx7(
328
- "div",
329
- {
330
- className: "absolute left-0 top-0 z-50 flex h-screen w-screen items-center justify-center bg-neutral-950 bg-opacity-50",
331
- onClick: onClose,
332
- children: /* @__PURE__ */ jsxs3(
333
- "div",
334
- {
335
- className: "relative rounded-3xl bg-white p-6 shadow-lg",
336
- onClick: (e) => e.stopPropagation(),
337
- children: [
338
- /* @__PURE__ */ jsx7(
339
- "button",
340
- {
341
- className: "absolute right-4 top-4 flex cursor-pointer items-center justify-center border-none bg-transparent p-1 text-neutral-400",
342
- onClick: onClose,
343
- children: /* @__PURE__ */ jsx7(CloseIcon, {})
344
- }
345
- ),
346
- (isLoading || redirectInProgress) && /* @__PURE__ */ jsx7("div", { className: "absolute inset-0 flex items-center justify-center rounded-3xl bg-neutral-100", children: /* @__PURE__ */ jsx7(LoadingIcon, {}) }),
347
- /* @__PURE__ */ jsx7(
348
- CivicAuthIframe,
349
- {
350
- ref: iframeRef,
351
- authUrl,
352
- onLoad: handleIframeLoad
353
- }
354
- )
355
- ]
356
- }
357
- )
358
- }
359
- );
360
- };
361
-
362
- // src/config.ts
363
- var authConfig = {
364
- // TODO change this to the production URL once we're out of beta
365
- oauthServer: "https://auth-dev.civic.com/oauth/"
366
- };
367
-
368
- // src/lib/windowUtil.ts
369
- var isWindowInIframe = (window2) => {
370
- var _a;
371
- if (typeof window2 !== "undefined") {
372
- try {
373
- if (((_a = window2 == null ? void 0 : window2.frameElement) == null ? void 0 : _a.id) === "civic-auth-iframe") {
374
- return true;
375
- }
376
- } catch (_e) {
377
- return false;
378
- }
379
- }
380
- return false;
381
- };
382
-
383
- // src/shared/AuthProvider.tsx
384
- import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
385
- var globalThisObject;
386
- if (typeof window !== "undefined") {
387
- globalThisObject = window;
388
- } else if (typeof global !== "undefined") {
389
- globalThisObject = global;
390
- } else {
391
- globalThisObject = Function("return this")();
392
- }
393
- globalThisObject.globalThis = globalThisObject;
394
- var AuthProvider = ({
395
- children,
396
- clientId,
397
- redirectUrl: inputRedirectUrl,
398
- config = authConfig,
399
- nonce,
400
- onSignIn,
401
- onSignOut,
402
- authServiceImpl,
403
- serverSideTokenExchange
404
- }) => {
405
- const [iframeUrl, setIframeUrl] = useState2(null);
406
- const [currentUrl, setCurrentUrl] = useState2(null);
407
- const [isInIframe, setIsInIframe] = useState2(false);
408
- const [authResponseUrl, setAuthResponseUrl] = useState2(null);
409
- const [tokenExchangeError, setTokenExchangeError] = useState2();
410
- const queryClient3 = useQueryClient2();
411
- const iframeRef = useRef2(null);
412
- useEffect2(() => {
413
- if (typeof globalThis.window !== "undefined") {
414
- setCurrentUrl(globalThis.window.location.href);
415
- const isInIframeVal = isWindowInIframe(globalThis.window);
416
- setIsInIframe(isInIframeVal);
417
- }
418
- }, []);
419
- const redirectUrl = useMemo2(
420
- () => (inputRedirectUrl || currentUrl || "").split("?")[0],
421
- [currentUrl, inputRedirectUrl]
422
- );
423
- const authService = useMemo2(
424
- () => currentUrl ? authServiceImpl || new AuthSessionServiceImpl(
425
- clientId,
426
- redirectUrl,
427
- config == null ? void 0 : config.oauthServer,
428
- config == null ? void 0 : config.endpoints
429
- ) : null,
430
- [currentUrl, clientId, redirectUrl, config, authServiceImpl]
431
- );
432
- const [userInfoService, setUserInfoService] = useState2();
433
- useEffect2(() => {
434
- if (!authService) return;
435
- authService.getUserInfoService().then(setUserInfoService);
436
- }, [authService]);
437
- const {
438
- data: session,
439
- isLoading,
440
- error
441
- } = useQuery2({
442
- queryKey: ["session", authResponseUrl, iframeUrl, currentUrl, isInIframe],
443
- queryFn: () => __async(void 0, null, function* () {
444
- if (!authService) {
445
- return { authenticated: false };
446
- }
447
- const url = new URL(
448
- authResponseUrl ? authResponseUrl : globalThis.window.location.href || ""
449
- );
450
- const code = url.searchParams.get("code");
451
- if (code && !isInIframe && !serverSideTokenExchange) {
452
- try {
453
- console.log("AuthProvider useQuery code", { isInIframe, code });
454
- const newSession = yield authService.tokenExchange(url.toString());
455
- onSignIn == null ? void 0 : onSignIn();
456
- return newSession;
457
- } catch (error2) {
458
- setTokenExchangeError(error2);
459
- onSignIn == null ? void 0 : onSignIn(
460
- error2 instanceof Error ? error2 : new Error("Failed to sign in")
461
- );
462
- return { authenticated: false };
463
- }
464
- }
465
- const existingSessionData = yield authService.validateExistingSession();
466
- if (existingSessionData.authenticated) {
467
- return existingSessionData;
468
- }
469
- return existingSessionData;
470
- })
471
- });
472
- const signOutMutation = useMutation2({
473
- mutationFn: () => __async(void 0, null, function* () {
474
- authService == null ? void 0 : authService.updateSessionData({});
475
- setIframeUrl(null);
476
- setAuthResponseUrl(null);
477
- onSignOut == null ? void 0 : onSignOut();
478
- }),
479
- onSuccess: () => {
480
- queryClient3.setQueryData(
481
- ["session", authResponseUrl, iframeUrl, currentUrl, isInIframe],
482
- null
483
- );
484
- }
485
- });
486
- const signIn = useCallback2(
487
- (overrideDisplayMode = "iframe") => __async(void 0, null, function* () {
488
- if (!authService) return;
489
- const url = yield authService.getAuthorizationUrl(
490
- // This is the default scope. We will eventually pull this from the partner dashboard
491
- DEFAULT_SCOPES,
492
- overrideDisplayMode,
493
- nonce
494
- );
495
- if (overrideDisplayMode === "iframe") {
496
- setIframeUrl(url);
497
- return;
498
- }
499
- authService.loadAuthorizationUrl(url, overrideDisplayMode);
500
- }),
501
- [authService, nonce]
502
- );
503
- const isAuthenticated = useMemo2(
504
- () => session ? session.authenticated : false,
505
- [session]
506
- );
507
- const value = useMemo2(
508
- () => ({
509
- isLoading,
510
- error,
511
- signOut: () => __async(void 0, null, function* () {
512
- yield signOutMutation.mutateAsync();
513
- }),
514
- isAuthenticated,
515
- signIn
516
- }),
517
- [isLoading, error, signOutMutation, isAuthenticated, signIn]
518
- );
519
- return /* @__PURE__ */ jsx8(AuthContext.Provider, { value, children: /* @__PURE__ */ jsx8(SessionProvider, { session, children: /* @__PURE__ */ jsx8(TokenProvider, { children: /* @__PURE__ */ jsxs4(UserProvider, { userInfoService, children: [
520
- !isInIframe && iframeUrl && !(session == null ? void 0 : session.authenticated) && /* @__PURE__ */ jsx8(
521
- CivicAuthIframeModal,
522
- {
523
- iframeRef,
524
- authUrl: iframeUrl,
525
- redirectUri: redirectUrl,
526
- setAuthResponseUrl,
527
- onClose: () => setIframeUrl(null)
528
- }
529
- ),
530
- (tokenExchangeError || isLoading || error || isInIframe && !(tokenExchangeError || error)) && /* @__PURE__ */ jsx8("div", { className: "absolute left-0 top-0 z-50 flex h-screen w-screen items-center justify-center bg-white", children: /* @__PURE__ */ jsx8("div", { className: "absolute inset-0 flex items-center justify-center bg-white", children: tokenExchangeError || error ? /* @__PURE__ */ jsxs4("div", { children: [
531
- "Error: ",
532
- (tokenExchangeError || error).message
533
- ] }) : /* @__PURE__ */ jsx8(LoadingIcon, {}) }) }),
534
- children
535
- ] }) }) }) });
536
- };
537
-
538
30
  // src/shared/CivicAuthProvider.tsx
539
31
  import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
540
32
  import "@civic/auth/styles.css";
541
- import { jsx as jsx9 } from "react/jsx-runtime";
33
+ import { jsx } from "react/jsx-runtime";
542
34
  var queryClient = new QueryClient();
543
35
  var CivicAuthProvider = (_a) => {
544
36
  var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
545
- return /* @__PURE__ */ jsx9(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx9(AuthProvider, __spreadProps(__spreadValues({}, props), { children })) });
546
- };
547
-
548
- // src/react/providers/NextAuthProvider.tsx
549
- import { createContext as createContext5, useContext as useContext4, useEffect as useEffect4, useMemo as useMemo3, useState as useState3 } from "react";
550
-
551
- // src/react/hooks/useUserCookie.ts
552
- import { useEffect as useEffect3, useRef as useRef3 } from "react";
553
- import { useRouter } from "next/navigation.js";
554
- import { useQuery as useQuery3 } from "@tanstack/react-query";
555
-
556
- // src/lib/cookies.ts
557
- var getCookieValue = (key, window2) => {
558
- const cookie = window2.document.cookie;
559
- if (!cookie) return null;
560
- const cookies = cookie.split(";");
561
- for (const c of cookies) {
562
- const [name, value] = c.trim().split("=");
563
- if (name === key) {
564
- try {
565
- return JSON.parse(decodeURIComponent(value));
566
- } catch (e) {
567
- console.log("Error parsing cookie value", e);
568
- return value;
569
- }
570
- }
571
- }
572
- return null;
573
- };
574
-
575
- // src/react/hooks/useUserCookie.ts
576
- var getUserFromCookie = () => {
577
- const userCookie = getCookieValue("user", globalThis.window);
578
- return userCookie;
579
- };
580
- var useUserCookie = () => {
581
- const hasRunRef = useRef3(false);
582
- const router = useRouter();
583
- const { data: user } = useQuery3({
584
- queryKey: ["user"],
585
- queryFn: () => getUserFromCookie(),
586
- refetchInterval: 2e3,
587
- refetchIntervalInBackground: true,
588
- enabled: !hasRunRef.current,
589
- refetchOnWindowFocus: true
590
- });
591
- useEffect3(() => {
592
- if (user) {
593
- if (!hasRunRef.current) {
594
- hasRunRef.current = true;
595
- router.refresh();
596
- }
597
- } else {
598
- hasRunRef.current = false;
599
- }
600
- }, [user, router]);
601
- return user;
602
- };
603
-
604
- // src/react/providers/NextAuthProvider.tsx
605
- import { QueryClient as QueryClient2, QueryClientProvider as QueryClientProvider2 } from "@tanstack/react-query";
606
- import { jsx as jsx10 } from "react/jsx-runtime";
607
- var queryClient2 = new QueryClient2();
608
- var defaultUserContext = { user: null };
609
- var UserContext2 = createContext5(defaultUserContext);
610
- var CivicNextAuthProvider = (_a) => {
611
- var _b = _a, {
612
- children
613
- } = _b, props = __objRest(_b, [
614
- "children"
615
- ]);
616
- const user = useUserCookie();
617
- const [redirectUrl, setRedirectUrl] = useState3("");
618
- const { clientId, oauthServer, callbackUrl, challengeUrl } = resolveAuthConfig();
619
- useEffect4(() => {
620
- if (typeof globalThis.window !== "undefined") {
621
- const currentUrl = globalThis.window.location.href;
622
- setRedirectUrl(new URL(callbackUrl, currentUrl).toString());
623
- }
624
- }, [callbackUrl]);
625
- const authService = useMemo3(() => {
626
- if (redirectUrl && clientId && oauthServer) {
627
- return new AuthSessionServiceImpl(clientId, redirectUrl, oauthServer, {
628
- challenge: challengeUrl
629
- });
630
- }
631
- return void 0;
632
- }, [redirectUrl, clientId, oauthServer, challengeUrl]);
633
- return /* @__PURE__ */ jsx10(QueryClientProvider2, { client: queryClient2, children: /* @__PURE__ */ jsx10(
37
+ return /* @__PURE__ */ jsx(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx(
634
38
  AuthProvider,
635
39
  __spreadProps(__spreadValues({}, props), {
636
- config: { oauthServer },
637
- clientId,
638
- authServiceImpl: authService,
639
- serverSideTokenExchange: true,
640
- children: /* @__PURE__ */ jsx10(UserContext2.Provider, { value: user, children })
40
+ pkceConsumer: new BrowserPublicClientPKCEProducer(),
41
+ children: /* @__PURE__ */ jsx(UserProvider, { storage: new LocalStorageAdapter(), children })
641
42
  })
642
43
  ) });
643
44
  };
644
- var useNextUser = () => useContext4(UserContext2);
645
45
 
646
46
  // src/react/hooks/useUser.tsx
647
47
  var useUser = () => {
648
- const context = useContext5(UserContext);
48
+ const context = useContext(UserContext);
649
49
  if (!context) {
650
50
  throw new Error("useUser must be used within a UserProvider");
651
51
  }
@@ -653,9 +53,9 @@ var useUser = () => {
653
53
  };
654
54
 
655
55
  // src/react/components/UserButton.tsx
656
- import { useCallback as useCallback3, useEffect as useEffect5, useState as useState4 } from "react";
657
- import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
658
- var ChevronDown = () => /* @__PURE__ */ jsx11(
56
+ import { useCallback, useEffect, useState } from "react";
57
+ import { jsx as jsx2, jsxs } from "react/jsx-runtime";
58
+ var ChevronDown = () => /* @__PURE__ */ jsx2(
659
59
  "svg",
660
60
  {
661
61
  xmlns: "http://www.w3.org/2000/svg",
@@ -668,10 +68,10 @@ var ChevronDown = () => /* @__PURE__ */ jsx11(
668
68
  strokeLinecap: "round",
669
69
  strokeLinejoin: "round",
670
70
  className: "lucide lucide-chevron-down",
671
- children: /* @__PURE__ */ jsx11("path", { d: "m6 9 6 6 6-6" })
71
+ children: /* @__PURE__ */ jsx2("path", { d: "m6 9 6 6 6-6" })
672
72
  }
673
73
  );
674
- var ChevronUp = () => /* @__PURE__ */ jsx11(
74
+ var ChevronUp = () => /* @__PURE__ */ jsx2(
675
75
  "svg",
676
76
  {
677
77
  xmlns: "http://www.w3.org/2000/svg",
@@ -684,36 +84,35 @@ var ChevronUp = () => /* @__PURE__ */ jsx11(
684
84
  strokeLinecap: "round",
685
85
  strokeLinejoin: "round",
686
86
  className: "lucide lucide-chevron-up",
687
- children: /* @__PURE__ */ jsx11("path", { d: "m18 15-6-6-6 6" })
87
+ children: /* @__PURE__ */ jsx2("path", { d: "m18 15-6-6-6 6" })
688
88
  }
689
89
  );
690
90
  var UserButton = ({
691
91
  displayMode,
692
92
  className
693
93
  }) => {
694
- const [isOpen, setIsOpen] = useState4(false);
695
- const { signIn, isAuthenticated, signOut } = useAuth();
696
- const { user } = useUser();
697
- const handleClickOutside = useCallback3((event) => {
94
+ const [isOpen, setIsOpen] = useState(false);
95
+ const { user, signIn, signOut } = useUser();
96
+ const handleClickOutside = useCallback((event) => {
698
97
  const target = event.target;
699
98
  if (!target.closest("#civic-dropdown-container")) {
700
99
  setIsOpen(false);
701
100
  }
702
101
  }, []);
703
- const handleSignOut = useCallback3(() => __async(void 0, null, function* () {
704
- yield signOut();
102
+ const handleSignOut = useCallback(() => __async(void 0, null, function* () {
103
+ signOut();
705
104
  setIsOpen(false);
706
105
  }), [signOut]);
707
- const handleSignIn = useCallback3(() => __async(void 0, null, function* () {
106
+ const handleSignIn = useCallback(() => __async(void 0, null, function* () {
708
107
  yield signIn(displayMode);
709
108
  setIsOpen(false);
710
109
  }), [signIn, displayMode]);
711
- const handleEscape = useCallback3((event) => {
110
+ const handleEscape = useCallback((event) => {
712
111
  if (event.key === "Escape") {
713
112
  setIsOpen(false);
714
113
  }
715
114
  }, []);
716
- useEffect5(() => {
115
+ useEffect(() => {
717
116
  if (isOpen) {
718
117
  window.addEventListener("click", handleClickOutside);
719
118
  window.addEventListener("keydown", handleEscape);
@@ -723,38 +122,38 @@ var UserButton = ({
723
122
  window.removeEventListener("keydown", handleEscape);
724
123
  };
725
124
  }, [handleClickOutside, handleEscape, isOpen]);
726
- if (isAuthenticated) {
727
- return /* @__PURE__ */ jsxs5("div", { className: "relative", id: "civic-dropdown-container", children: [
728
- /* @__PURE__ */ jsxs5(
125
+ if (user) {
126
+ return /* @__PURE__ */ jsxs("div", { className: "cac-relative", id: "civic-dropdown-container", children: [
127
+ /* @__PURE__ */ jsxs(
729
128
  "button",
730
129
  {
731
130
  className: cn(
732
- "flex w-full items-center justify-between gap-2 rounded-full border border-neutral-500 px-3 py-2 text-neutral-500 transition-colors hover:bg-neutral-200 hover:bg-opacity-50",
131
+ "cac-flex cac-w-full cac-items-center cac-justify-between cac-gap-2 cac-rounded-full cac-border cac-border-neutral-500 cac-px-3 cac-py-2 cac-text-neutral-500 cac-transition-colors hover:cac-bg-neutral-200 hover:cac-bg-opacity-50",
733
132
  className
734
133
  ),
735
134
  onClick: () => setIsOpen((isOpen2) => !isOpen2),
736
135
  children: [
737
- (user == null ? void 0 : user.picture) ? /* @__PURE__ */ jsx11("span", { className: "relative flex h-10 w-10 shrink-0 gap-2 overflow-hidden rounded-full", children: /* @__PURE__ */ jsx11(
136
+ (user == null ? void 0 : user.picture) ? /* @__PURE__ */ jsx2("span", { className: "cac-relative cac-flex cac-h-10 cac-w-10 cac-shrink-0 cac-gap-2 cac-overflow-hidden cac-rounded-full", children: /* @__PURE__ */ jsx2(
738
137
  "img",
739
138
  {
740
- className: "h-full w-full object-cover",
139
+ className: "cac-h-full cac-w-full cac-object-cover",
741
140
  src: user.picture,
742
141
  alt: (user == null ? void 0 : user.name) || (user == null ? void 0 : user.email)
743
142
  }
744
- ) }) : /* @__PURE__ */ jsx11("div", {}),
745
- /* @__PURE__ */ jsx11("span", { children: (user == null ? void 0 : user.name) || (user == null ? void 0 : user.email) }),
746
- isOpen ? /* @__PURE__ */ jsx11(ChevronUp, {}) : /* @__PURE__ */ jsx11(ChevronDown, {})
143
+ ) }) : /* @__PURE__ */ jsx2("div", {}),
144
+ /* @__PURE__ */ jsx2("span", { children: (user == null ? void 0 : user.name) || (user == null ? void 0 : user.email) }),
145
+ isOpen ? /* @__PURE__ */ jsx2(ChevronUp, {}) : /* @__PURE__ */ jsx2(ChevronDown, {})
747
146
  ]
748
147
  }
749
148
  ),
750
- /* @__PURE__ */ jsx11(
149
+ /* @__PURE__ */ jsx2(
751
150
  "div",
752
151
  {
753
- className: isOpen ? "absolute right-0 mt-2 w-full rounded-lg bg-white py-2 text-neutral-500 shadow-xl" : "hidden",
754
- children: /* @__PURE__ */ jsx11("ul", { children: /* @__PURE__ */ jsx11("li", { children: /* @__PURE__ */ jsx11(
152
+ className: isOpen ? "cac-absolute cac-right-0 cac-mt-2 cac-w-full cac-rounded-lg cac-bg-white cac-py-2 cac-text-neutral-500 cac-shadow-xl" : "cac-hidden",
153
+ children: /* @__PURE__ */ jsx2("ul", { children: /* @__PURE__ */ jsx2("li", { children: /* @__PURE__ */ jsx2(
755
154
  "button",
756
155
  {
757
- className: "block w-full px-4 py-2 transition-colors hover:bg-neutral-200 hover:bg-opacity-50",
156
+ className: "cac-block cac-w-full cac-px-4 cac-py-2 cac-transition-colors hover:cac-bg-neutral-200 hover:cac-bg-opacity-50",
758
157
  onClick: handleSignOut,
759
158
  children: "Logout"
760
159
  }
@@ -763,11 +162,12 @@ var UserButton = ({
763
162
  )
764
163
  ] });
765
164
  }
766
- return /* @__PURE__ */ jsx11(
165
+ return /* @__PURE__ */ jsx2(
767
166
  "button",
768
167
  {
168
+ "data-testid": "sign-in-button",
769
169
  className: cn(
770
- "rounded-full border border-neutral-500 px-3 py-2 transition-colors hover:bg-neutral-200 hover:bg-opacity-50",
170
+ "cac-rounded-full cac-border cac-border-neutral-500 cac-px-3 cac-py-2 cac-transition-colors hover:cac-bg-neutral-200 hover:cac-bg-opacity-50",
771
171
  className
772
172
  ),
773
173
  onClick: handleSignIn,
@@ -777,17 +177,18 @@ var UserButton = ({
777
177
  };
778
178
 
779
179
  // src/react/components/SignInButton.tsx
780
- import { jsx as jsx12 } from "react/jsx-runtime";
180
+ import { jsx as jsx3 } from "react/jsx-runtime";
781
181
  var SignInButton = ({
782
182
  displayMode,
783
183
  className
784
184
  }) => {
785
- const { signIn } = useAuth();
786
- return /* @__PURE__ */ jsx12(
185
+ const { signIn } = useUser();
186
+ return /* @__PURE__ */ jsx3(
787
187
  "button",
788
188
  {
189
+ "data-testid": "sign-in-button",
789
190
  className: cn(
790
- "rounded-full border border-neutral-500 px-3 py-2 transition-colors hover:bg-neutral-200 hover:bg-opacity-50",
191
+ "cac-rounded-full cac-border cac-border-neutral-500 cac-px-3 cac-py-2 cac-transition-colors hover:cac-bg-neutral-200 hover:cac-bg-opacity-50",
791
192
  className
792
193
  ),
793
194
  onClick: () => signIn(displayMode),
@@ -797,14 +198,14 @@ var SignInButton = ({
797
198
  };
798
199
 
799
200
  // src/react/components/SignOutButton.tsx
800
- import { jsx as jsx13 } from "react/jsx-runtime";
201
+ import { jsx as jsx4 } from "react/jsx-runtime";
801
202
  var SignOutButton = ({ className }) => {
802
- const { signOut } = useAuth();
803
- return /* @__PURE__ */ jsx13(
203
+ const { signOut } = useUser();
204
+ return /* @__PURE__ */ jsx4(
804
205
  "button",
805
206
  {
806
207
  className: cn(
807
- "rounded-full border border-neutral-500 px-3 py-2 transition-colors hover:bg-neutral-200 hover:bg-opacity-50",
208
+ "cac-rounded-full cac-border cac-border-neutral-500 cac-px-3 cac-py-2 cac-transition-colors hover:cac-bg-neutral-200 hover:cac-bg-opacity-50",
808
209
  className
809
210
  ),
810
211
  onClick: () => signOut(),
@@ -814,24 +215,24 @@ var SignOutButton = ({ className }) => {
814
215
  };
815
216
 
816
217
  // src/react/components/NextLogOut.tsx
817
- import { jsx as jsx14 } from "react/jsx-runtime";
218
+ import { jsx as jsx5 } from "react/jsx-runtime";
818
219
  var NextLogOut = ({ children }) => {
819
220
  const config = resolveAuthConfig();
820
221
  const logoutUrl = `${config.logoutUrl}`;
821
- return /* @__PURE__ */ jsx14("a", { href: logoutUrl, children });
222
+ return /* @__PURE__ */ jsx5("a", { href: logoutUrl, children });
822
223
  };
823
224
  export {
225
+ CivicAuthIframeContainer,
824
226
  CivicAuthProvider,
825
- CivicNextAuthProvider,
826
227
  NextLogOut,
827
228
  SignInButton,
828
229
  SignOutButton,
829
230
  UserButton,
830
231
  useAuth,
831
- useNextUser,
232
+ useConfig,
233
+ useIframe,
832
234
  useSession,
833
235
  useToken,
834
- useUser,
835
- useUserCookie
236
+ useUser
836
237
  };
837
238
  //# sourceMappingURL=react.mjs.map