@descope/react-sdk 0.0.52-alpha.2 → 0.0.52-alpha.21

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 Descope
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,29 +1,56 @@
 # @descope/react-sdk
+
 This library lets you consume your login pages created by Descope console-app in your application
 Under the hood, it uses [web-js-sdk](https://github.com/descope/web-js-sdk)
 
 ## Usage
+
 ### Install the package
+
 ```bash
 npm install @descope/react-sdk
 ```
 
 ### Render it in your application
+
 #### Wrap your app with Auth Provider
+
 ```js
-import { AuthProvider } from '@descope/react-sdk'
+import { AuthProvider } from '@descope/react-sdk';
 
 const AppRoot = () => {
+	return (
+		<AuthProvider projectId="myProjectId">
+			<App />
+		</AuthProvider>
+	);
+};
+```
+
+#### Use Descope to render specific flow
+
+You can use **default flows** or **provide flow id** directly to the Descope component
+
+##### 1. Default flows
+
+```js
+import { SignInFlow } from '@descope/react-sdk'
+// you can choose flow to run from the following
+// import { SignUpFlow } from '@descope/react-sdk'
+// import { SignUpOrInFlow } from '@descope/react-sdk'
+
+const App = () => {
     return (
-        <AuthProvider 
-            projectId="myProjectId" 
-        >
-         <App />
-        </AuthProvider>
+        {...}
+        <SignInFlow
+            onSuccess={(e) => console.log('Logged in!')}
+            onError={(e) => console.log('Could not logged in!')}
+        />
     )
 }
 ```
-#### Use Descope to render specific flow
+
+##### 2. Provide flow id
 
 ```js
 import { Descope } from '@descope/react-sdk'
@@ -31,14 +58,120 @@ import { Descope } from '@descope/react-sdk'
 const App = () => {
     return (
         {...}
-        <Descope 
-            flowId="myFlowId" 
+        <Descope
+            flowId="myFlowId"
             onSuccess={(e) => console.log('Logged in!')}
             onError={(e) => console.log('Could not logged in!')}
-        >
+            // theme can be "light" or "dark". If empty, Descope will use the OS theme
+            // theme="light"
+        />
+    )
+}
+```
+
+#### Use the `useAuth` hook in your components in order to access authentication state and utilities
+
+This can be helpful to implement application-specific logic. Examples:
+
+- Render different components if current session is authenticated
+- Render user's content
+- Logout button
+
+```js
+import { useAuth } from '@descope/react-sdk'
+
+const App = () => {
+    // NOTE - `useAuth` should be used inside `AuthProvider` context,
+    // and will throw an exception if this requirement is not met
+    const { authenticated, user, logout } = useAuth()
+    return (
+        {...}
+        {
+            // render different components if current session is authenticated
+            authenticated && <MyPrivateComponent />
+        }
+        {
+            // render user's content
+            authenticated && <div>Hello ${user.name}</div>
+        }
+        {
+            // logout button
+            authenticated && <button onClick={logout}>Logout</div>
+        }
+    )
+}
+```
+
+#### Session token server validation (pass session token to server API)
+
+When developing a full-stack application, it is common to have private server API which requires a valid session token:
+
+![session-token-validation-diagram](https://docs.descope.com/static/SessionValidation-cf7b2d5d26594f96421d894273a713d8.png)
+
+Note: Descope also provides server-side SDKs in various languages (NodeJS, Go, Python, etc). Descope's server SDKs have out-of-the-box session validation API that supports the options described bellow. To read more about session validation, Read [this section](https://docs.descope.com/guides/gettingstarted/#session-validation) in Descope documentation.
+
+The mechanism to pass session token depends on the Descope project's "Token response method" configuration.
+
+##### 1. Manage in cookies
+
+- Descope sets session token as cookie, which automatically sent each server api request. This option is more secure and is the recommended method for managing tokens, but for this option to work well with the browser - you must also configure a CNAME record for the custom domain listed, which will give a unified log in experience and securely restrict access to the session tokens that are stored in the cookies.
+
+When this option is configured, the browser will automatically add the session token cookie to the server in every request.
+
+##### 2. Manage in response body
+
+- Descope API returns session token in body. In this option, The React application should pass session cookie (`const { sessionToken } = useAuth()`) as Authorization header. This option never requires a custom domain, and is recommended for testing or while working in a sandbox environment.
+
+An example for using session token,
+
+```js
+import { useAuth } from '@descope/react-sdk'
+import { useCallback } from 'react'
+
+const App = () => {
+    const { sessionToken } = useAuth()
+
+    const onClick = useCallback(() => {
+        fetch('https://localhost:3002/api/some-path' {
+            method: 'GET',
+            headers: { Authorization: `Bearer ${sessionToken}` }
+        })
+    },[sessionToken])
+    return (
+        {...}
+        {
+            // button that triggers an API that may use session token
+            <button onClick={onClick}>Click Me</div>
+        }
     )
 }
 ```
 
-TODO:
-- decide about the callbacks event data & structure
+## Run a local example
+
+There is a simple app that uses Descope React SDK, with two routes
+
+- Home
+- Login
+
+In order to run this app locally, do the following steps:
+
+- Clone this repository
+- Navigate to repository directory
+- Run `npm i`
+- Create a `.env` file with the following variables (or alternatively export them manually):
+
+```env
+// .env
+# Your project id
+DESCOPE_PROJECT_ID=<project-id>
+# Flow id to run, e.g. sign-up-or-in
+DESCOPE_FLOW_ID=<flow-id>
+# Optional - Descope base url, e.g. http://localhost:8000
+DESCOPE_BASE_URL=<base-url>
+```
+
+- Run `npm run start`
+- Go to `http://localhost:3000/` and press the "Start Flow" button
+
+Note: if you change env file (for example, change DESCOPE_PROJECT_ID), you need to rerun `npm run start`

package/dist/cjs/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@descope/web-js-sdk"),t=require("react");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=r(e),n=r(t);const u=n.default.createContext(void 0),a=({projectId:e,baseUrl:r,children:o})=>{const[a,l]=t.useState({}),[c,i]=t.useState(""),d=t.useMemo((()=>{if(e)return s.default({projectId:e,baseUrl:r,hooks:{beforeRequest:e=>{const t=e;return t.headers={...t.headers,"x-descope-sdk-name":"react","x-descope-sdk-version":"0.0.52-alpha.21"},t}}})}),[e,r]);t.useEffect((()=>{if(!d)return;const e=d.onSessionTokenChange(i),t=d.onUserChange(l);return()=>{e?.(),t?.()}}),[d]);const f=t.useMemo((()=>({sdk:d,projectId:e,baseUrl:r,user:a,sessionToken:c,setUser:l,setSessionToken:i})),[c,a,e,r]);return n.default.createElement(u.Provider,{value:f},o)};a.defaultProps={baseUrl:"",children:void 0};const l=t.lazy((async()=>(await Promise.resolve().then((function(){return o(require("@descope/web-component"))})),{default:({projectId:e,flowId:t,baseUrl:r,innerRef:o,tenant:s,theme:u})=>n.default.createElement("descope-wc",{"project-id":e,"flow-id":t,"base-url":r,ref:o,tenant:s,theme:u})}))),c=n.default.forwardRef((({flowId:e,onSuccess:r,onError:o,tenant:s,theme:a},c)=>{const[i,d]=t.useState(null);t.useImperativeHandle(c,(()=>i));const{projectId:f,baseUrl:p,setUser:m,setSessionToken:b}=n.default.useContext(u),h=t.useCallback((e=>{m(e.detail?.user);const t=e.detail?.sessionJwt;b(t),r&&r(e)}),[m,b,r]);return t.useEffect((()=>{const e=i;return e?.addEventListener("success",h),o&&e?.addEventListener("error",o),()=>{o&&e?.removeEventListener("error",o),e?.removeEventListener("success",h)}}),[i,o,h]),n.default.createElement(t.Suspense,null,n.default.createElement(l,{projectId:f,flowId:e,baseUrl:p,innerRef:d,tenant:s,theme:a}))}));c.defaultProps={onError:void 0,onSuccess:void 0};const i=e=>(...t)=>{if(!e)throw Error("You can only use this function after sdk initialization. Make sure to supply 'projectId' to <AuthProvider /> component");return e(...t)};exports.AuthProvider=a,exports.Descope=c,exports.SignInFlow=e=>n.default.createElement(c,{...e,flowId:"sign-in"}),exports.SignUpFlow=e=>n.default.createElement(c,{...e,flowId:"sign-up"}),exports.SignUpOrInFlow=e=>n.default.createElement(c,{...e,flowId:"sign-up-or-in"}),exports.useAuth=()=>{const e=n.default.useContext(u);if(!e)throw Error("You can only use 'useAuth' in the context of <AuthProvider />");const{user:r,sessionToken:o,sdk:s}=e,a=t.useCallback(i(s?.logoutAll),[s]),l=t.useCallback(i(s?.logout),[s]),c=t.useCallback(i(s?.me),[s]),d=t.useCallback(i(s?.getJwtPermissions),[s]),f=t.useCallback(i(s?.getJwtRoles),[s]);return t.useMemo((()=>({authenticated:!!o,user:r,sessionToken:o,logoutAll:a,logout:l,me:c,getJwtPermissions:d,getJwtRoles:f})),[r,o,s])};
+//# sourceMappingURL=index.cjs.js.map

package/dist/cjs/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../src/lib/hooks/authContext.ts","../../src/lib/components/AuthProvider.tsx","../../src/lib/components/Descope.tsx","../../src/lib/hooks/useAuth.ts","../../src/lib/components/DefaultFlows.tsx"],"sourcesContent":["import React from 'react';\nimport { IAuthContext } from '../types';\n\nconst AuthContext = React.createContext<IAuthContext>(undefined);\n\nexport default AuthContext;\n","// '@descope/web-js-sdk' is a dependency of '@descope/web-component'\n// and we want to use the same version that is used there\n// eslint-disable-next-line import/no-extraneous-dependencies\nimport createSdk from '@descope/web-js-sdk';\nimport React, { FC, useEffect, useMemo, useState } from 'react';\nimport AuthContext from '../hooks/authContext';\nimport { IAuthContext } from '../types';\n\ndeclare const BUILD_VERSION: string;\n\ninterface IAuthProviderProps {\n\tprojectId: string;\n\tbaseUrl?: string;\n\tchildren?: JSX.Element;\n}\n\nconst AuthProvider: FC<IAuthProviderProps> = ({\n\tprojectId,\n\tbaseUrl,\n\tchildren\n}) => {\n\tconst [user, setUser] = useState({});\n\tconst [sessionToken, setSessionToken] = useState('');\n\n\tconst sdk = useMemo(() => {\n\t\tif (!projectId) {\n\t\t\treturn undefined;\n\t\t}\n\t\treturn createSdk({\n\t\t\tprojectId,\n\t\t\tbaseUrl,\n\t\t\thooks: {\n\t\t\t\tbeforeRequest: (config) => {\n\t\t\t\t\tconst conf = config;\n\t\t\t\t\tconf.headers = {\n\t\t\t\t\t\t...conf.headers,\n\t\t\t\t\t\t'x-descope-sdk-name': 'react',\n\t\t\t\t\t\t'x-descope-sdk-version': BUILD_VERSION\n\t\t\t\t\t};\n\t\t\t\t\treturn conf;\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\t}, [projectId, baseUrl]);\n\n\tuseEffect(() => {\n\t\tif (!sdk) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst unsubscribeSessionToken = sdk.onSessionTokenChange(setSessionToken);\n\t\tconst unsubscribeUser = sdk.onUserChange(setUser);\n\t\treturn () => {\n\t\t\tunsubscribeSessionToken?.();\n\t\t\tunsubscribeUser?.();\n\t\t};\n\t}, [sdk]);\n\n\tconst value = useMemo<IAuthContext>(\n\t\t() => ({\n\t\t\tsdk,\n\t\t\tprojectId,\n\t\t\tbaseUrl,\n\t\t\tuser,\n\t\t\tsessionToken,\n\t\t\tsetUser,\n\t\t\tsetSessionToken\n\t\t}),\n\t\t[sessionToken, user, projectId, baseUrl]\n\t);\n\treturn <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;\n};\n\nAuthProvider.defaultProps = {\n\tbaseUrl: '',\n\tchildren: undefined\n};\n\nexport default AuthProvider;\n","import React, {\n\tlazy,\n\tSuspense,\n\tuseCallback,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseState\n} from 'react';\nimport AuthContext from '../hooks/authContext';\nimport { DescopeProps } from '../types';\n\n// web-component code uses browser API, but can be used in SSR apps, hence the lazy loading\nconst DescopeWC = lazy(async () => {\n\tawait import('@descope/web-component');\n\treturn {\n\t\tdefault: ({ projectId, flowId, baseUrl, innerRef, tenant, theme }) => (\n\t\t\t<descope-wc\n\t\t\t\tproject-id={projectId}\n\t\t\t\tflow-id={flowId}\n\t\t\t\tbase-url={baseUrl}\n\t\t\t\tref={innerRef}\n\t\t\t\ttenant={tenant}\n\t\t\t\ttheme={theme}\n\t\t\t/>\n\t\t)\n\t};\n});\n\nconst Descope = React.forwardRef<HTMLElement, DescopeProps>(\n\t({ flowId, onSuccess, onError, tenant, theme }, ref) => {\n\t\tconst [innerRef, setInnerRef] = useState(null);\n\n\t\tuseImperativeHandle(ref, () => innerRef);\n\n\t\tconst { projectId, baseUrl, setUser, setSessionToken } =\n\t\t\tReact.useContext(AuthContext);\n\n\t\tconst handleSuccess = useCallback(\n\t\t\t(e: CustomEvent) => {\n\t\t\t\tsetUser(e.detail?.user);\n\t\t\t\tconst sessionJwt = e.detail?.sessionJwt;\n\t\t\t\tsetSessionToken(sessionJwt);\n\t\t\t\tif (onSuccess) {\n\t\t\t\t\tonSuccess(e);\n\t\t\t\t}\n\t\t\t},\n\t\t\t[setUser, setSessionToken, onSuccess]\n\t\t);\n\n\t\tuseEffect(() => {\n\t\t\tconst ele = innerRef;\n\t\t\tele?.addEventListener('success', handleSuccess);\n\t\t\tif (onError) ele?.addEventListener('error', onError);\n\n\t\t\treturn () => {\n\t\t\t\tif (onError) ele?.removeEventListener('error', onError);\n\n\t\t\t\tele?.removeEventListener('success', handleSuccess);\n\t\t\t};\n\t\t}, [innerRef, onError, handleSuccess]);\n\n\t\treturn (\n\t\t\t<Suspense>\n\t\t\t\t<DescopeWC\n\t\t\t\t\tprojectId={projectId}\n\t\t\t\t\tflowId={flowId}\n\t\t\t\t\tbaseUrl={baseUrl}\n\t\t\t\t\tinnerRef={setInnerRef}\n\t\t\t\t\ttenant={tenant}\n\t\t\t\t\ttheme={theme}\n\t\t\t\t/>\n\t\t\t</Suspense>\n\t\t);\n\t}\n);\n\nDescope.defaultProps = {\n\tonError: undefined,\n\tonSuccess: undefined\n};\n\nexport default Descope;\n","import React, { useCallback, useMemo } from 'react';\nimport { IAuth } from '../types';\nimport AuthContext from './authContext';\n\n/**\n * Wrap a function with a validation that it exists\n * @param fn The function to wrap with the validation\n * @throws if function does not exist, an error with the relevant message will be thrown\n */\nconst withValidation =\n\t<T extends Array<any>, U>(fn: (...args: T) => U) =>\n\t(...args: T): U => {\n\t\tif (!fn) {\n\t\t\tthrow Error(\n\t\t\t\t`You can only use this function after sdk initialization. Make sure to supply 'projectId' to <AuthProvider /> component`\n\t\t\t);\n\t\t}\n\t\treturn fn(...args);\n\t};\n\nconst useAuth = (): IAuth => {\n\tconst ctx = React.useContext(AuthContext);\n\tif (!ctx) {\n\t\tthrow Error(\n\t\t\t`You can only use 'useAuth' in the context of <AuthProvider />`\n\t\t);\n\t}\n\tconst { user, sessionToken, sdk } = ctx;\n\n\tconst logoutAll = useCallback(withValidation(sdk?.logoutAll), [sdk]);\n\n\tconst logout = useCallback(withValidation(sdk?.logout), [sdk]);\n\n\tconst me = useCallback(withValidation(sdk?.me), [sdk]);\n\n\tconst getJwtPermissions = useCallback(\n\t\twithValidation(sdk?.getJwtPermissions),\n\t\t[sdk]\n\t);\n\n\tconst getJwtRoles = useCallback(withValidation(sdk?.getJwtRoles), [sdk]);\n\n\treturn useMemo(\n\t\t() => ({\n\t\t\tauthenticated: !!sessionToken,\n\t\t\tuser,\n\t\t\tsessionToken,\n\t\t\tlogoutAll,\n\t\t\tlogout,\n\t\t\tme,\n\t\t\tgetJwtPermissions,\n\t\t\tgetJwtRoles\n\t\t}),\n\t\t[user, sessionToken, sdk]\n\t);\n};\n\nexport default useAuth;\n","import React from 'react';\nimport { DefaultFlowProps } from '../types';\nimport Descope from './Descope';\n\nexport const SignInFlow = (props: DefaultFlowProps) => (\n\t<Descope {...props} flowId=\"sign-in\" />\n);\n\nexport const SignUpFlow = (props: DefaultFlowProps) => (\n\t<Descope {...props} flowId=\"sign-up\" />\n);\n\nexport const SignUpOrInFlow = (props: DefaultFlowProps) => (\n\t<Descope {...props} flowId=\"sign-up-or-in\" />\n);\n"],"names":["AuthContext","React","createContext","undefined","AuthProvider","projectId","baseUrl","children","user","setUser","useState","sessionToken","setSessionToken","sdk","useMemo","createSdk","hooks","beforeRequest","config","conf","headers","useEffect","unsubscribeSessionToken","onSessionTokenChange","unsubscribeUser","onUserChange","value","createElement","Provider","defaultProps","DescopeWC","lazy","async","Promise","resolve","then","_interopNamespace","require","default","flowId","innerRef","tenant","theme","ref","Descope","forwardRef","onSuccess","onError","setInnerRef","useImperativeHandle","useContext","handleSuccess","useCallback","e","detail","sessionJwt","ele","addEventListener","removeEventListener","Suspense","withValidation","fn","args","Error","props","ctx","logoutAll","logout","me","getJwtPermissions","getJwtRoles","authenticated"],"mappings":"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"}

package/dist/cjs/package.json

@@ -0,0 +1 @@
+{"type":"commonjs"}

package/dist/index.d.ts

@@ -1,5 +1,14 @@
-import React, { DOMAttributes, FC } from 'react';
+/// <reference types="react" />
+import React, { FC, DOMAttributes } from 'react';
 import DescopeWc from '@descope/web-component';
+import createSdk from '@descope/web-js-sdk';
+
+interface IAuthProviderProps {
+    projectId: string;
+    baseUrl?: string;
+    children?: JSX.Element;
+}
+declare const AuthProvider: FC<IAuthProviderProps>;
 
 declare global {
     namespace JSX {
@@ -8,6 +17,7 @@ declare global {
         }
     }
 }
+declare type Sdk = ReturnType<typeof createSdk>;
 declare type CustomEvents<K extends string> = {
     [key in K]: (event: CustomEvent) => void;
 };
@@ -39,27 +49,32 @@ interface User {
     verifiedPhone?: boolean;
     tenants?: string[];
 }
-
-declare const useAuth: () => {
-    projectId: string;
-    baseUrl: string;
+interface IAuth {
     authenticated: boolean;
-    user: User;
-    sessionToken: string;
-};
-
-interface PropsType {
+    user?: User;
+    sessionToken?: string;
+    logoutAll: Sdk['logoutAll'];
+    logout: Sdk['logout'];
+    me: Sdk['me'];
+    getJwtRoles: Sdk['getJwtRoles'];
+    getJwtPermissions: Sdk['getJwtPermissions'];
+}
+declare type DescopeTheme = 'light' | 'dark';
+interface DescopeProps {
     flowId: string;
     onSuccess?: DescopeCustomElement['onsuccess'];
     onError?: DescopeCustomElement['onerror'];
+    tenant?: string;
+    theme?: DescopeTheme;
 }
-declare const Descope: React.ForwardRefExoticComponent<PropsType & React.RefAttributes<HTMLElement>>;
+declare type DefaultFlowProps = Omit<DescopeProps, 'flowId'>;
 
-interface IAuthProviderProps {
-    projectId: string;
-    baseUrl?: string;
-    children?: JSX.Element;
-}
-declare const AuthProvider: FC<IAuthProviderProps>;
+declare const SignInFlow: (props: DefaultFlowProps) => JSX.Element;
+declare const SignUpFlow: (props: DefaultFlowProps) => JSX.Element;
+declare const SignUpOrInFlow: (props: DefaultFlowProps) => JSX.Element;
+
+declare const Descope: React.ForwardRefExoticComponent<DescopeProps & React.RefAttributes<HTMLElement>>;
+
+declare const useAuth: () => IAuth;
 
-export { AuthProvider, Descope, useAuth };
+export { AuthProvider, Descope, SignInFlow, SignUpFlow, SignUpOrInFlow, useAuth };

package/dist/index.esm.js

@@ -0,0 +1,2 @@
+import e from"@descope/web-js-sdk";import t,{useState as o,useMemo as r,useEffect as s,lazy as n,useImperativeHandle as c,useCallback as i,Suspense as a}from"react";const l=t.createContext(void 0),d=({projectId:n,baseUrl:c,children:i})=>{const[a,d]=o({}),[u,p]=o(""),f=r((()=>{if(n)return e({projectId:n,baseUrl:c,hooks:{beforeRequest:e=>{const t=e;return t.headers={...t.headers,"x-descope-sdk-name":"react","x-descope-sdk-version":"0.0.52-alpha.21"},t}}})}),[n,c]);s((()=>{if(!f)return;const e=f.onSessionTokenChange(p),t=f.onUserChange(d);return()=>{e?.(),t?.()}}),[f]);const m=r((()=>({sdk:f,projectId:n,baseUrl:c,user:a,sessionToken:u,setUser:d,setSessionToken:p})),[u,a,n,c]);return t.createElement(l.Provider,{value:m},i)};d.defaultProps={baseUrl:"",children:void 0};const u=n((async()=>(await import("@descope/web-component"),{default:({projectId:e,flowId:o,baseUrl:r,innerRef:s,tenant:n,theme:c})=>t.createElement("descope-wc",{"project-id":e,"flow-id":o,"base-url":r,ref:s,tenant:n,theme:c})}))),p=t.forwardRef((({flowId:e,onSuccess:r,onError:n,tenant:d,theme:p},f)=>{const[m,h]=o(null);c(f,(()=>m));const{projectId:w,baseUrl:v,setUser:E,setSessionToken:k}=t.useContext(l),g=i((e=>{E(e.detail?.user);const t=e.detail?.sessionJwt;k(t),r&&r(e)}),[E,k,r]);return s((()=>{const e=m;return e?.addEventListener("success",g),n&&e?.addEventListener("error",n),()=>{n&&e?.removeEventListener("error",n),e?.removeEventListener("success",g)}}),[m,n,g]),t.createElement(a,null,t.createElement(u,{projectId:w,flowId:e,baseUrl:v,innerRef:h,tenant:d,theme:p}))}));p.defaultProps={onError:void 0,onSuccess:void 0};const f=e=>t.createElement(p,{...e,flowId:"sign-in"}),m=e=>t.createElement(p,{...e,flowId:"sign-up"}),h=e=>t.createElement(p,{...e,flowId:"sign-up-or-in"}),w=e=>(...t)=>{if(!e)throw Error("You can only use this function after sdk initialization. Make sure to supply 'projectId' to <AuthProvider /> component");return e(...t)},v=()=>{const e=t.useContext(l);if(!e)throw Error("You can only use 'useAuth' in the context of <AuthProvider />");const{user:o,sessionToken:s,sdk:n}=e,c=i(w(n?.logoutAll),[n]),a=i(w(n?.logout),[n]),d=i(w(n?.me),[n]),u=i(w(n?.getJwtPermissions),[n]),p=i(w(n?.getJwtRoles),[n]);return r((()=>({authenticated:!!s,user:o,sessionToken:s,logoutAll:c,logout:a,me:d,getJwtPermissions:u,getJwtRoles:p})),[o,s,n])};export{d as AuthProvider,p as Descope,f as SignInFlow,m as SignUpFlow,h as SignUpOrInFlow,v as useAuth};
+//# sourceMappingURL=index.esm.js.map

package/dist/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../src/lib/hooks/authContext.ts","../src/lib/components/AuthProvider.tsx","../src/lib/components/Descope.tsx","../src/lib/components/DefaultFlows.tsx","../src/lib/hooks/useAuth.ts"],"sourcesContent":["import React from 'react';\nimport { IAuthContext } from '../types';\n\nconst AuthContext = React.createContext<IAuthContext>(undefined);\n\nexport default AuthContext;\n","// '@descope/web-js-sdk' is a dependency of '@descope/web-component'\n// and we want to use the same version that is used there\n// eslint-disable-next-line import/no-extraneous-dependencies\nimport createSdk from '@descope/web-js-sdk';\nimport React, { FC, useEffect, useMemo, useState } from 'react';\nimport AuthContext from '../hooks/authContext';\nimport { IAuthContext } from '../types';\n\ndeclare const BUILD_VERSION: string;\n\ninterface IAuthProviderProps {\n\tprojectId: string;\n\tbaseUrl?: string;\n\tchildren?: JSX.Element;\n}\n\nconst AuthProvider: FC<IAuthProviderProps> = ({\n\tprojectId,\n\tbaseUrl,\n\tchildren\n}) => {\n\tconst [user, setUser] = useState({});\n\tconst [sessionToken, setSessionToken] = useState('');\n\n\tconst sdk = useMemo(() => {\n\t\tif (!projectId) {\n\t\t\treturn undefined;\n\t\t}\n\t\treturn createSdk({\n\t\t\tprojectId,\n\t\t\tbaseUrl,\n\t\t\thooks: {\n\t\t\t\tbeforeRequest: (config) => {\n\t\t\t\t\tconst conf = config;\n\t\t\t\t\tconf.headers = {\n\t\t\t\t\t\t...conf.headers,\n\t\t\t\t\t\t'x-descope-sdk-name': 'react',\n\t\t\t\t\t\t'x-descope-sdk-version': BUILD_VERSION\n\t\t\t\t\t};\n\t\t\t\t\treturn conf;\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\t}, [projectId, baseUrl]);\n\n\tuseEffect(() => {\n\t\tif (!sdk) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst unsubscribeSessionToken = sdk.onSessionTokenChange(setSessionToken);\n\t\tconst unsubscribeUser = sdk.onUserChange(setUser);\n\t\treturn () => {\n\t\t\tunsubscribeSessionToken?.();\n\t\t\tunsubscribeUser?.();\n\t\t};\n\t}, [sdk]);\n\n\tconst value = useMemo<IAuthContext>(\n\t\t() => ({\n\t\t\tsdk,\n\t\t\tprojectId,\n\t\t\tbaseUrl,\n\t\t\tuser,\n\t\t\tsessionToken,\n\t\t\tsetUser,\n\t\t\tsetSessionToken\n\t\t}),\n\t\t[sessionToken, user, projectId, baseUrl]\n\t);\n\treturn <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;\n};\n\nAuthProvider.defaultProps = {\n\tbaseUrl: '',\n\tchildren: undefined\n};\n\nexport default AuthProvider;\n","import React, {\n\tlazy,\n\tSuspense,\n\tuseCallback,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseState\n} from 'react';\nimport AuthContext from '../hooks/authContext';\nimport { DescopeProps } from '../types';\n\n// web-component code uses browser API, but can be used in SSR apps, hence the lazy loading\nconst DescopeWC = lazy(async () => {\n\tawait import('@descope/web-component');\n\treturn {\n\t\tdefault: ({ projectId, flowId, baseUrl, innerRef, tenant, theme }) => (\n\t\t\t<descope-wc\n\t\t\t\tproject-id={projectId}\n\t\t\t\tflow-id={flowId}\n\t\t\t\tbase-url={baseUrl}\n\t\t\t\tref={innerRef}\n\t\t\t\ttenant={tenant}\n\t\t\t\ttheme={theme}\n\t\t\t/>\n\t\t)\n\t};\n});\n\nconst Descope = React.forwardRef<HTMLElement, DescopeProps>(\n\t({ flowId, onSuccess, onError, tenant, theme }, ref) => {\n\t\tconst [innerRef, setInnerRef] = useState(null);\n\n\t\tuseImperativeHandle(ref, () => innerRef);\n\n\t\tconst { projectId, baseUrl, setUser, setSessionToken } =\n\t\t\tReact.useContext(AuthContext);\n\n\t\tconst handleSuccess = useCallback(\n\t\t\t(e: CustomEvent) => {\n\t\t\t\tsetUser(e.detail?.user);\n\t\t\t\tconst sessionJwt = e.detail?.sessionJwt;\n\t\t\t\tsetSessionToken(sessionJwt);\n\t\t\t\tif (onSuccess) {\n\t\t\t\t\tonSuccess(e);\n\t\t\t\t}\n\t\t\t},\n\t\t\t[setUser, setSessionToken, onSuccess]\n\t\t);\n\n\t\tuseEffect(() => {\n\t\t\tconst ele = innerRef;\n\t\t\tele?.addEventListener('success', handleSuccess);\n\t\t\tif (onError) ele?.addEventListener('error', onError);\n\n\t\t\treturn () => {\n\t\t\t\tif (onError) ele?.removeEventListener('error', onError);\n\n\t\t\t\tele?.removeEventListener('success', handleSuccess);\n\t\t\t};\n\t\t}, [innerRef, onError, handleSuccess]);\n\n\t\treturn (\n\t\t\t<Suspense>\n\t\t\t\t<DescopeWC\n\t\t\t\t\tprojectId={projectId}\n\t\t\t\t\tflowId={flowId}\n\t\t\t\t\tbaseUrl={baseUrl}\n\t\t\t\t\tinnerRef={setInnerRef}\n\t\t\t\t\ttenant={tenant}\n\t\t\t\t\ttheme={theme}\n\t\t\t\t/>\n\t\t\t</Suspense>\n\t\t);\n\t}\n);\n\nDescope.defaultProps = {\n\tonError: undefined,\n\tonSuccess: undefined\n};\n\nexport default Descope;\n","import React from 'react';\nimport { DefaultFlowProps } from '../types';\nimport Descope from './Descope';\n\nexport const SignInFlow = (props: DefaultFlowProps) => (\n\t<Descope {...props} flowId=\"sign-in\" />\n);\n\nexport const SignUpFlow = (props: DefaultFlowProps) => (\n\t<Descope {...props} flowId=\"sign-up\" />\n);\n\nexport const SignUpOrInFlow = (props: DefaultFlowProps) => (\n\t<Descope {...props} flowId=\"sign-up-or-in\" />\n);\n","import React, { useCallback, useMemo } from 'react';\nimport { IAuth } from '../types';\nimport AuthContext from './authContext';\n\n/**\n * Wrap a function with a validation that it exists\n * @param fn The function to wrap with the validation\n * @throws if function does not exist, an error with the relevant message will be thrown\n */\nconst withValidation =\n\t<T extends Array<any>, U>(fn: (...args: T) => U) =>\n\t(...args: T): U => {\n\t\tif (!fn) {\n\t\t\tthrow Error(\n\t\t\t\t`You can only use this function after sdk initialization. Make sure to supply 'projectId' to <AuthProvider /> component`\n\t\t\t);\n\t\t}\n\t\treturn fn(...args);\n\t};\n\nconst useAuth = (): IAuth => {\n\tconst ctx = React.useContext(AuthContext);\n\tif (!ctx) {\n\t\tthrow Error(\n\t\t\t`You can only use 'useAuth' in the context of <AuthProvider />`\n\t\t);\n\t}\n\tconst { user, sessionToken, sdk } = ctx;\n\n\tconst logoutAll = useCallback(withValidation(sdk?.logoutAll), [sdk]);\n\n\tconst logout = useCallback(withValidation(sdk?.logout), [sdk]);\n\n\tconst me = useCallback(withValidation(sdk?.me), [sdk]);\n\n\tconst getJwtPermissions = useCallback(\n\t\twithValidation(sdk?.getJwtPermissions),\n\t\t[sdk]\n\t);\n\n\tconst getJwtRoles = useCallback(withValidation(sdk?.getJwtRoles), [sdk]);\n\n\treturn useMemo(\n\t\t() => ({\n\t\t\tauthenticated: !!sessionToken,\n\t\t\tuser,\n\t\t\tsessionToken,\n\t\t\tlogoutAll,\n\t\t\tlogout,\n\t\t\tme,\n\t\t\tgetJwtPermissions,\n\t\t\tgetJwtRoles\n\t\t}),\n\t\t[user, sessionToken, sdk]\n\t);\n};\n\nexport default useAuth;\n"],"names":["AuthContext","React","createContext","undefined","AuthProvider","projectId","baseUrl","children","user","setUser","useState","sessionToken","setSessionToken","sdk","useMemo","createSdk","hooks","beforeRequest","config","conf","headers","useEffect","unsubscribeSessionToken","onSessionTokenChange","unsubscribeUser","onUserChange","value","createElement","Provider","defaultProps","DescopeWC","lazy","async","import","default","flowId","innerRef","tenant","theme","ref","Descope","forwardRef","onSuccess","onError","setInnerRef","useImperativeHandle","useContext","handleSuccess","useCallback","e","detail","sessionJwt","ele","addEventListener","removeEventListener","Suspense","SignInFlow","props","SignUpFlow","SignUpOrInFlow","withValidation","fn","args","Error","useAuth","ctx","logoutAll","logout","me","getJwtPermissions","getJwtRoles","authenticated"],"mappings":"qKAGA,MAAMA,EAAcC,EAAMC,mBAA4BC,GCahDC,EAAuC,EAC5CC,YACAC,UACAC,eAEA,MAAOC,EAAMC,GAAWC,EAAS,CAAE,IAC5BC,EAAcC,GAAmBF,EAAS,IAE3CG,EAAMC,GAAQ,KACnB,GAAKT,EAGL,OAAOU,EAAU,CAChBV,YACAC,UACAU,MAAO,CACNC,cAAgBC,IACf,MAAMC,EAAOD,EAMb,OALAC,EAAKC,QAAU,IACXD,EAAKC,QACR,qBAAsB,QACtB,wBAAyB,mBAEnBD,CAAI,IAGZ,GACA,CAACd,EAAWC,IAEfe,GAAU,KACT,IAAKR,EACJ,OAGD,MAAMS,EAA0BT,EAAIU,qBAAqBX,GACnDY,EAAkBX,EAAIY,aAAahB,GACzC,MAAO,KACNa,MACAE,KAAmB,CACnB,GACC,CAACX,IAEJ,MAAMa,EAAQZ,GACb,KAAO,CACND,MACAR,YACAC,UACAE,OACAG,eACAF,UACAG,qBAED,CAACD,EAAcH,EAAMH,EAAWC,IAEjC,OAAOL,EAAA0B,cAAC3B,EAAY4B,SAAQ,CAACF,MAAOA,GAAQnB,EAAgC,EAG7EH,EAAayB,aAAe,CAC3BvB,QAAS,GACTC,cAAUJ,GC/DX,MAAM2B,EAAYC,GAAKC,gBAChBC,OAAO,0BACN,CACNC,QAAS,EAAG7B,YAAW8B,SAAQ7B,UAAS8B,WAAUC,SAAQC,WACzDrC,EACa0B,cAAA,aAAA,CAAA,aAAAtB,YACH8B,EAAM,WACL7B,EACViC,IAAKH,EACLC,OAAQA,EACRC,MAAOA,QAMLE,EAAUvC,EAAMwC,YACrB,EAAGN,SAAQO,YAAWC,UAASN,SAAQC,SAASC,KAC/C,MAAOH,EAAUQ,GAAelC,EAAS,MAEzCmC,EAAoBN,GAAK,IAAMH,IAE/B,MAAM/B,UAAEA,EAASC,QAAEA,EAAOG,QAAEA,EAAOG,gBAAEA,GACpCX,EAAM6C,WAAW9C,GAEZ+C,EAAgBC,GACpBC,IACAxC,EAAQwC,EAAEC,QAAQ1C,MAClB,MAAM2C,EAAaF,EAAEC,QAAQC,WAC7BvC,EAAgBuC,GACZT,GACHA,EAAUO,EACV,GAEF,CAACxC,EAASG,EAAiB8B,IAe5B,OAZArB,GAAU,KACT,MAAM+B,EAAMhB,EAIZ,OAHAgB,GAAKC,iBAAiB,UAAWN,GAC7BJ,GAASS,GAAKC,iBAAiB,QAASV,GAErC,KACFA,GAASS,GAAKE,oBAAoB,QAASX,GAE/CS,GAAKE,oBAAoB,UAAWP,EAAc,CAClD,GACC,CAACX,EAAUO,EAASI,IAGtB9C,gBAACsD,EAAQ,KACRtD,EAAA0B,cAACG,EAAS,CACTzB,UAAWA,EACX8B,OAAQA,EACR7B,QAASA,EACT8B,SAAUQ,EACVP,OAAQA,EACRC,MAAOA,IAGR,IAIJE,EAAQX,aAAe,CACtBc,aAASxC,EACTuC,eAAWvC,SC1ECqD,EAAcC,GAC1BxD,gBAACuC,EAAO,IAAKiB,EAAOtB,OAAO,YAGfuB,EAAcD,GAC1BxD,gBAACuC,EAAO,IAAKiB,EAAOtB,OAAO,YAGfwB,EAAkBF,GAC9BxD,gBAACuC,EAAO,IAAKiB,EAAOtB,OAAO,kBCJtByB,EACqBC,GAC1B,IAAIC,KACH,IAAKD,EACJ,MAAME,MACL,0HAGF,OAAOF,KAAMC,EAAK,EAGdE,EAAU,KACf,MAAMC,EAAMhE,EAAM6C,WAAW9C,GAC7B,IAAKiE,EACJ,MAAMF,MACL,iEAGF,MAAMvD,KAAEA,EAAIG,aAAEA,EAAYE,IAAEA,GAAQoD,EAE9BC,EAAYlB,EAAYY,EAAe/C,GAAKqD,WAAY,CAACrD,IAEzDsD,EAASnB,EAAYY,EAAe/C,GAAKsD,QAAS,CAACtD,IAEnDuD,EAAKpB,EAAYY,EAAe/C,GAAKuD,IAAK,CAACvD,IAE3CwD,EAAoBrB,EACzBY,EAAe/C,GAAKwD,mBACpB,CAACxD,IAGIyD,EAActB,EAAYY,EAAe/C,GAAKyD,aAAc,CAACzD,IAEnE,OAAOC,GACN,KAAO,CACNyD,gBAAiB5D,EACjBH,OACAG,eACAuD,YACAC,SACAC,KACAC,oBACAC,iBAED,CAAC9D,EAAMG,EAAcE,GACrB"}

package/package.json

@@ -1,80 +1,102 @@
 {
-  "name": "@descope/react-sdk",
-  "version": "0.0.52-alpha.2",
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
-  "description": "Descope React SDK",
-  "license": "ISC",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/descope/react-sdk.git"
-  },
-  "files": [
-    "dist"
-  ],
-  "dependencies": {
-    "@descope/web-component": "^0.0.26-alpha.3"
-  },
-  "devDependencies": {
-    "@babel/core": "7.18.9",
-    "@babel/preset-env": "7.18.9",
-    "@babel/preset-react": "7.18.6",
-    "@babel/preset-typescript": "7.18.6",
-    "@open-wc/rollup-plugin-html": "^1.2.5",
-    "@rollup/plugin-commonjs": "^21.0.1",
-    "@rollup/plugin-node-resolve": "^13.1.1",
-    "@rollup/plugin-replace": "^3.0.0",
-    "@rollup/plugin-typescript": "^8.3.0",
-    "@testing-library/jest-dom": "5.16.5",
-    "@testing-library/react": "13.3.0",
-    "@testing-library/user-event": "14.4.3",
-    "@types/jest": "^27.0.2",
-    "@types/react": "18.0.17",
-    "@types/react-dom": "18.0.5",
-    "babel-jest": "27.5.1",
-    "eslint": "8.20.0",
-    "eslint-config-airbnb": "19.0.4",
-    "eslint-config-airbnb-typescript": "17.0.0",
-    "eslint-config-prettier": "8.5.0",
-    "eslint-config-standard": "17.0.0",
-    "eslint-import-resolver-typescript": "2.7.1",
-    "eslint-plugin-import": "2.26.0",
-    "eslint-plugin-jest": "26.7.0",
-    "eslint-plugin-jest-dom": "4.0.2",
-    "eslint-plugin-jest-formatting": "3.1.0",
-    "eslint-plugin-jsx-a11y": "6.6.1",
-    "eslint-plugin-n": "15.2.4",
-    "eslint-plugin-no-only-tests": "2.6.0",
-    "eslint-plugin-prefer-arrow": "1.2.3",
-    "eslint-plugin-prettier": "4.2.1",
-    "eslint-plugin-promise": "6.0.0",
-    "eslint-plugin-react": "7.30.1",
-    "eslint-plugin-react-hooks": "4.6.0",
-    "eslint-plugin-testing-library": "5.6.0",
-    "jest": "^27.3.1",
-    "react": "18.2.0",
-    "react-dom": "18.2.0",
-    "rollup": "^2.62.0",
-    "rollup-plugin-auto-external": "^2.0.0",
-    "rollup-plugin-browsersync": "^1.3.3",
-    "rollup-plugin-delete": "^2.0.0",
-    "rollup-plugin-dts": "^4.2.2",
-    "rollup-plugin-livereload": "^2.0.5",
-    "rollup-plugin-serve": "^1.1.0",
-    "rollup-plugin-terser": "^7.0.2",
-    "ts-jest": "^27.0.7",
-    "ts-node": "10.9.1",
-    "typescript": "^4.5.3"
-  },
-  "peerDependencies": {
-    "@types/react": ">=16",
-    "react": ">=16"
-  },
-  "scripts": {
-    "start": "npm run build && rollup -c rollup.config.app.js -w",
-    "build": "rollup -c",
-    "test": "jest",
-    "lint": "eslint ./src",
-    "prepublishOnly": "npm run build"
-  }
+	"name": "@descope/react-sdk",
+	"version": "0.0.52-alpha.21",
+	"main": "dist/cjs/index.cjs.js",
+	"module": "dist/index.esm.js",
+	"types": "dist/index.d.ts",
+	"exports": {
+		"require": "./dist/cjs/index.cjs.js",
+		"import": "./dist/index.esm.js"
+	},
+	"type": "module",
+	"description": "Descope React SDK",
+	"license": "ISC",
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/descope/react-sdk.git"
+	},
+	"files": [
+		"dist"
+	],
+	"dependencies": {
+		"@descope/web-component": "0.1.0-alpha.16",
+		"react-router-dom": "6.4.3"
+	},
+	"devDependencies": {
+		"@babel/core": "7.20.2",
+		"@babel/preset-env": "7.20.2",
+		"@babel/preset-react": "7.18.6",
+		"@babel/preset-typescript": "7.18.6",
+		"@open-wc/rollup-plugin-html": "^1.2.5",
+		"@rollup/plugin-commonjs": "^21.1.0",
+		"@rollup/plugin-node-resolve": "^13.3.0",
+		"@rollup/plugin-replace": "^3.0.0",
+		"@rollup/plugin-typescript": "^8.3.0",
+		"@testing-library/jest-dom": "5.16.5",
+		"@testing-library/react": "13.4.0",
+		"@testing-library/user-event": "14.4.3",
+		"@types/jest": "^27.0.2",
+		"@types/react": "18.0.25",
+		"@types/react-dom": "18.0.9",
+		"@types/react-router-dom": "^5.3.3",
+		"babel-jest": "27.5.1",
+		"eslint": "8.26.0",
+		"eslint-config-airbnb": "19.0.4",
+		"eslint-config-airbnb-typescript": "17.0.0",
+		"eslint-config-prettier": "8.5.0",
+		"eslint-config-standard": "17.0.0",
+		"eslint-import-resolver-typescript": "2.7.1",
+		"eslint-plugin-import": "2.26.0",
+		"eslint-plugin-jest": "26.9.0",
+		"eslint-plugin-jest-dom": "4.0.3",
+		"eslint-plugin-jest-formatting": "3.1.0",
+		"eslint-plugin-jsx-a11y": "6.6.1",
+		"eslint-plugin-n": "15.5.1",
+		"eslint-plugin-no-only-tests": "2.6.0",
+		"eslint-plugin-prefer-arrow": "1.2.3",
+		"eslint-plugin-prettier": "4.2.1",
+		"eslint-plugin-promise": "6.1.1",
+		"eslint-plugin-react": "7.31.10",
+		"eslint-plugin-react-hooks": "4.6.0",
+		"eslint-plugin-testing-library": "5.9.1",
+		"husky": "^8.0.1",
+		"jest": "^27.3.1",
+		"lint-staged": "^13.0.3",
+		"pretty-quick": "^3.1.3",
+		"react": "18.2.0",
+		"react-dom": "18.2.0",
+		"rollup": "^2.62.0",
+		"rollup-plugin-auto-external": "^2.0.0",
+		"rollup-plugin-browsersync": "^1.3.3",
+		"rollup-plugin-define": "^1.0.1",
+		"rollup-plugin-delete": "^2.0.0",
+		"rollup-plugin-dotenv": "^0.4.1",
+		"rollup-plugin-dts": "^4.2.2",
+		"rollup-plugin-livereload": "^2.0.5",
+		"rollup-plugin-serve": "^1.1.0",
+		"rollup-plugin-terser": "^7.0.2",
+		"ts-jest": "^27.0.7",
+		"ts-node": "10.9.1",
+		"typescript": "^4.5.3"
+	},
+	"peerDependencies": {
+		"@types/react": ">=16",
+		"react": ">=16"
+	},
+	"scripts": {
+		"start": "npm run build && rollup -c rollup.config.app.js -w",
+		"build": "rollup -c",
+		"prepare": "husky install",
+		"test": "jest",
+		"lint": "eslint '+(src|test|testUtils)/**/*.ts' --fix",
+		"format": "prettier . -w --ignore-path .gitignore",
+		"format-check": "prettier . --check --ignore-path .gitignore",
+		"format-lint": "pretty-quick --staged --ignore-path .gitignore && lint-staged",
+		"prepublishOnly": "npm run build"
+	},
+	"lint-staged": {
+		"+(src|test|examples)/**/*.{js,ts,jsx,tsx}": [
+			"npm run lint"
+		]
+	}
 }

package/dist/index.js

@@ -1 +0,0 @@
-import e,{useMemo as t,useRef as r,useImperativeHandle as s,useCallback as o,useEffect as n,useState as c}from"react";import"@descope/web-component";const d=e.createContext(void 0),i=()=>{const r=e.useContext(d);if(!r)throw Error("You can only use useAuth in the context of <AuthProvider />");const{projectId:s,baseUrl:o,authenticated:n,user:c,sessionToken:i}=r;return t((()=>({projectId:s,baseUrl:o,authenticated:n,user:c,sessionToken:i})),[s,o,n,c,i])},u=e.forwardRef((({flowId:t,onSuccess:c,onError:i},u)=>{const a=r();s(u,(()=>a.current));const{projectId:l,baseUrl:p,setAuthenticated:v,setUser:h,setSessionToken:f}=e.useContext(d),E=o((e=>{h(e.detail?.user),v(!0),f(e.detail?.sessionJwt),c&&c(e)}),[h,v,c]);return n((()=>{const e=a.current;return e?.addEventListener("success",E),i&&e?.addEventListener("error",i),()=>{i&&e?.removeEventListener("error",i),e?.removeEventListener("success",E)}}),[a,i,E]),e.createElement("descope-wc",{"project-id":l,"flow-id":t,"base-url":p,ref:a})}));u.defaultProps={onError:void 0,onSuccess:void 0};const a=({projectId:r,baseUrl:s,children:o})=>{const[n,i]=c(!1),[u,a]=c({}),[l,p]=c(""),v=t((()=>({projectId:r,baseUrl:s,user:u,authenticated:n,sessionToken:l,setUser:a,setAuthenticated:i,setSessionToken:p})),[n,u,r,s]);return e.createElement(d.Provider,{value:v},o)};a.defaultProps={baseUrl:"",children:void 0};export{a as AuthProvider,u as Descope,i as useAuth};